こんにちは。株式会社ゼストでプロダクトデザインを担当している長沢です。
2024年3月の『ZEST SCHEDULE』のリニューアルから、半年以上が経過し、時の流れの速さに驚かされています。
さて、弊社のプロダクトデザイナーは、ZEST SCHEDULEのリニューアルにおいて、OOUI(オブジェクト指向UI)を採用し、直感的で分かりやすいUIの実現を目指して尽力しました。
3月のリリースからしばらく時間が経ち、改めて「もしZEST SCHEDULEが、オブジェクト指向UIではなく、タスク指向UIで作られていたとしたら、どうなっていただろうか」という疑問が浮かび上がってきました。
本記事では、リニューアルされたZEST SCHEDULEのUI構造設計を振り返りつつ、タスク指向UI版ZEST SCHEDULEの可能性について考察してみたいと思います。
オブジェクト指向UIとは
OOUI(オブジェクト指向UI)は、Object Oriented User Interface
の略で、現実世界のモノや概念をデジタル空間にそのまま持ち込むように設計されたユーザーインターフェースのことです。
「オブジェクト(対象となるもの)」を起点に設計することで、ユーザーは現実世界の直感的な操作感覚をデジタル空間でそのまま体験できます。
例えば、パソコンのデスクトップ画面にあるゴミ箱に、不要なファイルをドラッグ&ドロップして捨てるという操作は、誰しもが一度は経験したことがある直感的な動作であり、OOUIの代表的な例と言えるでしょう。
OOUIの目的は、ユーザーが迷わずに、そして直感的に操作できるようなユーザーインターフェースを実現することです。これにより、学習コストを削減し、ユーザーエクスペリエンスを向上させることができます。
また、OOUIでは、情報を表示するビュー(画面)を大きく2つに分類します。
- コレクションビュー
- 複数のオブジェクトを一覧表示するビューです。
- シングルビュー
- 1つのオブジェクトの詳細情報を表示するビューです。
ナビゲーションの名称についても、OOUIでは、ユーザーインターフェースをより直感的で分かりやすくするため、ナビゲーションから「管理」「設定」といった抽象的な言葉を省くことを推奨しています。
タスク指向UIとは
タスク指向UIとは、ユーザーがまず行いたいことを選択し、その後、そのタスクに関連するオブジェクトを選択するような設計のユーザーインターフェースです。
OOUIが「オブジェクト」を起点に設計されるのに対し、タスク指向UIは「タスク(行動)」を起点に設計されます。
ZEST SCHEDULEのUI設計
ZEST SCHEDULEのUI設計について、OOUIのタスクからオブジェクトを特定するプロセスに基づき、UI構造設計を進めました。
1. ユーザータスクの洗い出し
想定されるユーザータスクの一例を以下に示します。
- 職員を登録する
- 職員を削除する
- 利用者を登録する
- 利用者を削除する
- シフト表の職員に休暇を登録
- シフト表の職員に勤務時間を登録
- シフト表の職員にオンコール当番を設定する
- 訪問する職員を未割当予定に割り当てる
- 割り当て済み訪問予定をキャンセルする
- 訪問予定の訪問時間を変更する
- 訪問予定に申し送り事項を記入する
- 外部連携の接続情報を設定する
- 外部サービスに訪問予定情報を送信する
2. オブジェクトの特定
上記タスクから名詞を抽出、主たるオブジェクトを特定し、初期段階では、
- 予定
- シフト
- 利用者
- 職員
- 外部連携
が候補として挙げられました。
しかし、「シフト」は職員オブジェクトの配下にある方が自然なのではないか?
「外部連携」は主たるオブジェクトとして定義するのは違和感。といった疑問が残りました。
3. オブジェクトの再検討と構造設計
「シフト」は職員オブジェクトの配下にあるべきか
- 職員オブジェクトの配下に置いた場合、職員単体にシフト情報がプロパティとして配置されることになります。シフトは、複数の職員のシフトを一括で表示・管理しなければ意味が無いため、職員配下ではない別の場所に配置した方が良さそうです。
- また、シフトは「予定」と密接な関係があり、両者の情報を統合的に管理することで、より効率的なスケジュール管理が可能になります。
- これらの点を考慮すると、シフトと予定の両方を包括する上位オブジェクトを設けることが、直感的で分かりやすい情報構造を実現する上で有効と考えられます。
- 最終的に、予定とシフトの上位オブジェクトとして「スケジュール」を設けることで、主たるオブジェクトがより簡潔になりました。
「外部連携」は主たるオブジェクトなのか
- 外部サービスの連携対象が予定だけでなく、利用者や職員情報など多岐にわたるため、予定や利用者、職員に対しての「アクション」として扱う方が適切と判断しました。
4. 最終的なオブジェクト構造
PdMやエンジニアとの議論を経て、システムのオブジェクト構造をスケジュール(予定とシフト)、利用者、職員の3つに決定しました。
UI上ではこの構造を反映し、グローバルナビゲーションとして配置することで、ユーザーが直感的にシステムを操作できるように設計しました。
- スケジュール
- 予定
- シフト
- 利用者
- 職員
タスク指向UIで再設計してみる
では、本題に移りましょう。タスク指向UIで設計した場合、ZEST SCHEDULEはどのような形になるのでしょうか?
タスク指向UIは、「何をするか」を選択し、その対象となる「もの」を選ぶUIになるので、
- 予定管理
- 新規予定作成
- 予定編集
- 予定キャンセル
- 職員を割り当てる
- 申し送り事項記入
- シフト管理
- シフト登録
- シフト変更
- オンコール設定
- 利用者管理
- 新規利用者登録
- 利用者情報編集
- 利用者削除
- 職員管理
- 新規職員登録
- 職員情報編集
- 職員削除
- 外部連携管理
- 連携情報設定
- 予定情報を送信
のような構造になります。 この構造をもとに、トップナビゲーションのUIを作成してみました。
多くのボタンが並ぶことで、ユーザーが目的のページを見つけるのが難しくなる可能性があります。また、似たような一覧画面や詳細画面が多くなり、デザインの重複が発生し管理が困難になる可能性もあります。
他にもタスク指向UIにすることで、以下のようなデメリットが発生することが想像できます。
- タスクの流れに沿った操作しかできず、自由な操作が制限される。
- タスクの流れを把握するのが難しく、初回操作に戸惑う可能性がある。
- 各タスクに対応した操作方法を覚える必要があり、学習コストが高くなる。
- すべてのユーザーが同じタスクを同じ順序で行うとは限らないため、個々のニーズに対応しづらい。
まとめ
タスク指向UIは、ユーザーが決められた手順に沿って操作を進めることを促す設計であり、操作の自由度が制限される傾向があります。
一方、ZEST SCHEDULEのような大規模かつ複雑なシステムにおいては、ユーザーが直感的に様々な操作を行い、柔軟な作業をこなせるよう、オブジェクト指向UIがより適していると考えられます。