Power AppsPower Platform

【Power Apps】すぐ使える!オリジナル日程調整アプリのサンプル(利用編) 

今回の記事では、新たに作成した日程調整アプリの使い方を紹介します。

まだアプリの導入が完了していない場合は、前回の記事(導入編)をご確認ください。

スポンサーリンク

アプリの概要

できること

  1. 複数人で会議を行う場合などに、全員が空いている時間を探すことができる
  2. 空いている時間が分かったら、その時間でOutlookの予定・会議を作成することができる

画面イメージ

画面イメージは次の通りです。

日程調整アプリ画面イメージ

アプリ利用の流れ

上記の画面イメージでもわかる通り、この日程調整アプリは3画面で構成されています。

①日程検索画面

日程検索画面

②日程選択画面

日程選択画面

③予定作成画面

予定作成画面

利用の流れは下記の通りです。

  1. 日程検索画面にて、空き時間を知りたい / 日程調整したいユーザーを選択し、
    日程範囲・検索条件を設定
  2. 日程選択画面にて、各出席者の空き状況を確認し、日程を選択
  3. 予定作成画面にて、予定のタイトルや詳細を入力し、会議開催通知を作成・送信

各画面の操作方法

日程検索画面

日程検索画面では、出席者の追加と日程範囲の設定を行います。

日程検索画面

出席者の追加

まずは以下を参考に、出席者を追加・設定してください。

出席者の追加
  1. まずは左上のコンボボックスに、空き時間を知りたい / 日程調整したい ユーザーを入力してください。
  2. 名前またはEmailをコンボボックスに入力すると、下にユーザー候補が表示されます。
  3. ユーザー候補をクリックすると、出席者の一覧にそのユーザーが追加されます。
出席者の設定
  1. 追加されたユーザーについて、必須出席(必ず出席してほしい) / 任意出席(可能であれば出席してほしい) を選択します。
  2. 必要に応じて、出席者の種類(ユーザー/場所/備品)を選択*します。

(*) 出席者の種類を適切に選択することで、「予定作成画面」にてOutlookの予定を正しく作成することができます。

日程範囲の設定

続いて、どの範囲で日程を検索するかを設定します。

日程範囲設定

以下の項目を設定します。

  • 検索範囲(開始日)
  • 検索範囲(終了日)
  • 検索時間帯
  • 会議の長さ

例えば以下のように設定した場合、

  • 検索開始日が10/27
  • 検索終了日が10/28
  • 検索時間帯が10:00~19:00
  • 会議の長さが30分

10/27~10/28の8:00~19:00の範囲で、出席者が30分間空いている日程を検索することができます。

(補足) 「各出席者の稼働時間内に絞る」オプションについて

各出席者の稼働時間内に絞る

上記画像のように「各出席者の稼働時間内に絞る」オプションにチェックを入れた場合、
「検索時間帯内」かつ「各出席者のOutlook稼働時間*内」の日程に絞り込みます。

* Outlook稼働時間とは、下記のようにOutlookにて設定されている時間です。

旧Outlookのオプション設定

旧Outlook稼働時間設定

新Outlookのオプション設定

新Outlook稼働時間設定

そのため例えば、

  • 検索時間帯が10:00~19:00
  • 「各出席者の稼働時間内に絞る」オプションにチェックが付いている
  • 出席者全員の稼働時間が8:00~17:00

となっている場合、10:00~17:00の時間帯で出席者の空き日程を探すという動作になります。

日程選択画面

日程選択画面では、表示された日程候補の一覧から、最適な日程を選択します。

日程選択画面

日程候補の並び替え

初期設定では、日程候補は「日時の昇順」で表示されています。
ドロップダウンで変更することで、「日時の降順」「空き人数が多い順」「予定あり人数が少ない順」に変更することができます。

日程候補の並び替え

空き状況詳細の確認

日程候補一覧には、空き時間・予定あり・その他(仮予定や不明ステータスなど)の各人数が表示されています。
誰の予定が空いていて、誰の予定が空いていないのかなど詳しい情報を知りたい場合は、「詳細」ボタンをクリックすることで確認できます。

出席者空き状況詳細を開く

予定作成画面への遷移

ここまでで最適な日程が決まったら、その横にある「予定作成へ」ボタンを押すことで、予定作成画面に遷移することができます。

予定作成画面への遷移

予定作成画面

予定作成画面では、イベント詳細情報の入力後、Outlookの予定を作成したり会議開催通知を送信することができます。

予定作成画面

追加情報の入力

日時や出席者についてはすでに値が入っているものの、以下の項目については追加での入力・設定が必要です。

予定作成画面設定
  • 基本設定
    • イベントタイトル
    • Teams会議を設定するか
  • 詳細設定
    • イベント本文
    • 表示方法
    • 重要度
    • アラーム
    • 応答を要求

また、日時や出席者も変更は可能です。
(特に複数の会議室を出席者として追加していた場合は、ここで削除することをお勧めします)
変更後に元に戻したい場合は、「戻す」ボタンを利用することもできます。

戻すボタンの動作

予定作成ボタンの押下

ここまででイベント詳細情報を入力できたら、「予定作成」ボタンを押して完了です。
Outlookに予定や開催通知が作成されていることを確認してください。

予定作成ボタン

工夫したポイント

使いやすいUI

モダンコントロールも利用しつつ、全体として使いやすいUI・きれいなデザインとなるよう注力しました。
デフォルトで存在しないコントロールについては、自作しつつ操作性を高めています。

ステップバー

ステップバー

ユーザー検索コンボボックス

ユーザー選択コンボボックス

必須/任意選択スイッチ

必須任意スイッチ

細かな機能

UIだけでなく、機能面でも細かな配慮をしています。

柔軟な日程検索

これまでに紹介した通り、今回の日程調整アプリでは出席者の任意/必須を選択できたり、検索時間帯を指定することができます。

日程検索画面

過去にも様々な方が日程調整アプリを作成されていますが、これらの機能を実装されている方はほとんどいらっしゃらないかと思います。

検索条件の保存

あくまでおまけ的な機能にはなりますが、前回の検索条件(出席者・検索時間帯・会議の長さ)はブラウザのキャッシュに保存されています。
以下のように、検索後にアプリを閉じてしまった場合でも、開きなおすと前回検索した条件が引き継がれていることが分かります。

検索条件の保存

まとめ

今回は、新たに作成した日程調整アプリの使い方を紹介しました。
使いやすいなと感じましたら、ぜひ周囲の方にも広めていただけると嬉しいです。

また、このアプリで得たノウハウや自作したコントロールなどは、今後の記事で紹介していく予定です。

スポンサーリンク
Hiromaru

普段からPower Platform・SharePointの技術を広めています!
デザインに力を入れて、見やすい・分かりやすい記事を投稿していきます

Hiromaruをフォローする
シェアする
Hiromaruをフォローする
タイトルとURLをコピーしました