■ユーザインターフェイス（UI）は永遠の課題
ユーザインターフェイス設計は、Web構築の重要な工程の一つだ。しかし困ったことに直接的な解を導くフレームワークが存在しない。戦略立案工程ではフレームワークを活用することが出来たが ユーザインターフェイス設計は対象ユーザの知識、経験だけではなく嗜好、行動、習慣、さらには時代のトレンドなど曖昧な要素が多いため、フレームワーク化は難しく「ワイヤーフレーム」で地道に検討をするしかない。
しかしながら、最適なユーザインターフェイス を導くため最低限、使った方が良い戦略的フレームワークがいくつかあり、ここでそれを紹介しよう。
■ UIを導くための インフォメーションストラテジ
優れたUIはワイヤーフレーム、デザイン作業という工程のみで生み出されるわけではない。実は戦略立案工程からユーザインターフェイスを意識しなければ確度の高い設計はできない。特に「ターゲットを知る」「クライアントを理解する」などのフレームワークは重要であるため理解しておいた方がよい。
●ターゲットを理解するペルソナ
ペルソナは、あたかも実在の人物が存在するかのようにターゲット像を想定する。年齢や性別などの属性はもちろん、知識や性格、行動や生活習慣、ファッション、仕事や休日の過ごし方、そして名前まで想定する。この例はBtoCビジネスの場合であるが、BtoBは、会社環境や担当としても課題、ステークホルダーとの関係など、想定内容が変わるので注意が必要だ。詳細については、以下のサイトが分かりやすいので参考にしてほしい。
マーケティング戦略系の記事でもペルソナを紹介したことはあるが、UIにおいても必須であり、設計の最初の一歩となる。
●ターゲットが必要とする「情報内容」「取得方法と順番」を設計するカスタマージャーニー
カスタマージャーニーではターゲットが、どのような情報を求めていて、それをどのチャネルで取得するか（したいか）理解する。
これによりどのチャネルにどのようなコンテンツを準備すればターゲットに届くか、どのような順番で見せると理解が高まるか、などが設計できる。これもUIを検討する上で重要な情報となる。
基本的にAIDMA（認知、理解、興味、比較、決定等）をベースに想定するとわかりやすい。 詳細については、以下のサイトが分かりやすいので参考にしてほしい。。
ペルソナとカスタマージャーニーがなぜ必要か。それは設計者がターゲットになりきるための役作りの重要な情報になるからだ。脚本家から渡される脚本（シナリオ）みたいなものだ。
そして、敢えて言うと優秀な設計者になるには「演技力」が重要だ。如何にターゲットになり切れるかでUIの出来が変わってくる、
●周辺環境を確認する３Ｃ
ここまでは、ターゲットを理解するためのフレームワークがメインであったが、ビジネスを理解するフレームワークも重要だ。
そのために３Cは知っておいた方がよい。３Ｃはカンパニー（自社）、カスタマー（客）、コンペティタ（競合）というビジネスの周辺環境を端的にまとめ、自社が置かれている状況を把握するフレームワークとなる。 クライアントを理解するためには必要だ。 詳細については、以下のサイトが分かりやすいので参考にしてほしい。
●どのように印象印象付けたいか確認するポジショニング
ポジショニングは「自社をターゲットにどのように印象付けたいか（ポジショニングしたいか）」を想定するフレームワークだ。
企業戦略とブランドイメージを想定する時に利用するが、ユーザインターフェイスにも影響があるため理解しておいた方が良い。 詳細については、以下のサイトが分かりやすいので参考にしてほしい。
■ インフォメーションアーキテクチャ
繰り返すがユーザインターフェイスの設計は、イメージを働かせて検討を重ねるしかないが、ただ検討の仕方、ワークフローについては古い書籍ではあるが「インフォメーションアーキテクチャ」に基本がまとめられている。
いまでも多くのWeb制作会社はこのワークフローをベースに開発を行っている。工程としては「戦略」「要件」「構造」「骨格」「表層」となるが、簡単に説明すると以下の通りだ。
●戦略
戦略ではユーザーの理解とそのニーズを把握し、マーケティング戦略とWebサイトの目的と目標を設定する。
ペルソナ・カスタマージャーニーマップ・３C・5W1Hなどのフレームワークを使う事になる。
●要件定義
ユーザに必要な情報（コンテンツ）は何か、必要な機能は何かのアウトラインを定義することになる。またマーケティングの具体的な戦略も定義する。
●構造
構造設計では情報（コンテンツ）の構造化、具体的なコンテンツ内容を策定する。 ここからUI的な設計が必用となる。ユーザに必要な情報の詳細とその提示順番、見せ方などの全体構造を確認する。ツリー構造の設計と、構造をもとにした誘導設計が重要な工程となる。
●骨格
簡単に言えばワイヤーフレームとなる。 ここで第一階層から第三階層程度までの代表的なページレイアウト、つまりヘッダ、本文、フッタ、ナビゲーション、タイトル、図や写真の置き方、アイコンやイラストトーン、CTAなどを設計する。
●表層
表層はまさにデザイナーの仕事で、いわゆるビジュアルデザインである。美しくスマートにストレスなく見せるだけではなく、ブランディングを打ち出すための重要な工程だ。
インフォメーションアーキテクチャ の 詳細については、以下のサイトが分かりやすいので参考にしてほしい。
UI設計の工程は上記のように存在するが設計のアウトプットを得るためにフレームワークは「ワイヤーフレーム作成」以外にはないため、ここは経験を積んでもらいたい。
■UIガイドラインの事例
経験を高めるうえで、有名な成功事例や先人たちのアウトプットは非常に参考になる。以下に有名なUIガイドラインを掲載するので学習に役立ててほしい。
● 2014年にGoogleが提唱したデザインガイドライン
●アップルのヒューマンインターフェイスガイドライン
● MicrosoftのMicrosoft Design
