『はじめよう！ 要件定義』（とそのシリーズ）を読んで、はじめよう！UIデザイン｜金 成奎

Tags

Top Highlights

• 本シリーズで定義されているタスクとその成果物は、ユーザー視点で理想の体験設計・サービスデザインを描き、それをUIに具現化すると言う、デザイナーの仕事にとってとても参考になる内容になっている

• この3部作はデザイナー目線で読み解くと、極めて明瞭で本質的で実践的な、ユーザー体験設計とUI設計の進め方について学べるデザイン教則本と言えるのです。

• 『はじめよう！ 要件定義 ～ビギナーからベテランまで』とその姉妹本『⁠はじめよう！ プロセス設計 ～要件定義のその前に』『はじめよう！ システム設計 ～要件定義のその後に』の、通称「はじめよう！シリーズ3部作」

• 要件定義とは「UI・機能・データを決めることである」

• つまり本書はUI・機能・データを決めていく形で要件定義を進めていく方法を解説した内容になっています。

• 筆者は「これがあればプログラマーがソフトウェア開発に着手できるよねと言う状態が要件定義のゴールであり、そのためにはUIもある程度明らかになっていないといけない、UIを決めずに要件を定義することなんてできないでしょ、むしろUIを決めることで要件が明らかになってくるはず」と主張されています。

• 本書が要件定義の進め方であると同時に、結果的にUIの進め方についても解説した本になっている

• この三冊は要件定義とその前後の過程で何をすべきかを語った内容になっています。

• 要件定義では「UI・機能・データ」を決めます。そのための前段のインプットとして「企画書・全体像・利用する実装技術・実現したいこと一覧・行動シナリオ・概念データモデル」が必要となってきます。そして、これが決まればその「UI・機能・データ」を「フロント・バック・DB」にマッピングしていくこと、これが後続のシステム設計でやることです。

• まずは企画を元に、これから作るソフトウェアの全体像を描いていきます。結局我々は何を作るんだっけ？を明らかにする作業です。

• 続いて、そのソフトウェアが完成したらそのユーザがどのように行動するのかを時系列で可視化した行動シナリオを描きます。ちなみにこの行動シナリオですが、色々呼び名はありますがユースケースやユーザーストーリーなどと同義と思っていただいてOKです。

• ソフトウェアを中心に置き、その周辺にユーザーと行動を書きます。

• 個人的にはユーザーとソフトウェアごとにスイムレーンを用意し、それを縦に積んだ上でそれぞれの一連の行動を水平方向に描いてみるのがおすすめです。

• つまりソフトウェアを介して人やコンピューターは仕事をしますが、仕事には成果が伴い、成果を出すための材料が必要です。そしてその仕事を行うためにはトリガー・きっかけ（イベント）があるはず、ということです。

• この「仕事」はタスク、「材料」「成果」はオブジェクトと見なすことができます

• 行動シナリオを描くことはお馴染みOOUIの考え方を意識し、ソフトウェア上のオブジェクトを見抜くためにも有効

• シナリオを眺めながら、UIが出現する箇所を考えていきます。具体的には先程のシナリオからワークセット（ソフトウェアに対して仕事をしているところ）を抜き出し、そこで行う「仕事」の画面イメージをラフなイメージにしていきます。

• プロジェクト関係者が見た時「あー、そうそう、こう言う感じだよね」と思ってもらい議論が弾む叩き台になっているといいでしょう。

• このラフイメージを見ながら、そこにあるべきUIを構成する項目をもう少し精緻に列挙していきます。

• 表示（何かを表示して読んだり見たりする項目。テキストや画像や表やグラフなど） 入力（何かの値を入れたり選んだりするための項目。テキストフィールドやセレクトボックスなど） 操作（何らかのイベントを発生させる項目。ボタンやリンクなど）