https://blog.members.co.jp/article/49901
我々が参画しているチームでは、前の記事で解説しました、スクラム開発の中のUX/UI設計フェーズを主に担当しています。 この章では、もっともUX/UIに関わる「要件定義」「詳細設計」「UIデザイン」の詳細について解説していきます。
3-1. 要件定義フェーズの説明各機能のあるべきプロセスを検討する業務要件をサイトに当てはめる
3-2. 詳細設計フェーズの説明要素のレイアウトを設計する機能の詳細を詰めるプロジェクトを円滑に進行するツール
3-3. UI設計フェーズの説明デザインシステムとは?どのように作成すれば良いのか?アトミックデザインなぜアトミックデザインなのか?デザインシステムがないとこうなるデザインガイドラインおすすめのツール
まずUX/UI設計のプロセスでは、ビジネスリクワイアメントで決まった各エピックに対し、 要件定義→詳細設計→UIデザインの順でプロセスを経て、仕様とデザインを固めてきます。
要件定義フェーズの具体的なプロセスを解説していきます。
まずは導線設計ですが、既存サイトへの影響範囲の調査をおこない、流入からコンバージョンまでの流れを確認します。 例としてドローン配送の場合、自宅配送やメール便などの「配送方法一覧画面」にドローン配送のオプションを追加するだけではなく「注文、最終確認画面」や「注文履歴画面」にも、配送方法を表示させる必要があるので、影響があるということを検討資料などに明示します。 これは、前の記事の「設計者の基本姿勢パート」でもお話しましたが、影響範囲を調査する際は必ずサイト構成がすべて可視化されたドキュメントを用いて確認するようにしています。
フロー・シナリオでは、洗い出した影響範囲・導線設計を元に「全体フロー図」「それぞれの画面の大まかな表示要素」「挙動」をパワーポイントなどの資料にまとめ、クライアントの企画チームやプロダクトマネージャーと合意を取ります。 ドローン配送の場合、ドローン配送が選べる画面から配送が完了するまでの「フロー」を組みつつ、「配送先の住所が登録済みかどうか」などの分岐によって、表示や動作が変わるものを「シナリオ」として分岐パターンを網羅します。 ここでのポイントとしては、ビジネス要求にマッチしているか、技術的に実現可能かを判断するためにも全体感を整理しておくこと。そしてシナリオについては色んなユーザーパターンが想定されるので、漏らさずシナリオを網羅することが大事になってきます。