Note 2 / IA and UI

IAとUI

情報設計(IA)とUI設計を、実際のプロジェクトでどう考え、進めてきたかをまとめています。

■IA(情報設計) — 情報の構造化

ユーザーのニーズを考え、適切な形で情報を提供すること。

01観察・行動分析

情報に対してユーザーがどう行動しているかを俯瞰する。どんな導線で情報にたどり着いているか、製品や情報がどう使われているかを見て、モデル化することで複雑な情報を単純化する。ペルソナ作成や、膨大なデータの単純化もここに含まれる。

02コンテンツ分析

時季ごとの情報の抽出、Webやアプリ内での情報流通が正しく行われているかを確認する。情報の種類や量が適切か、サイト全体の評価もここで行う。

03コンテキスト分析・明文化

ビジネスモデルと利用者の文脈を明文化する。フリーランスやスタートアップ、システム開発、企業ごとのルールなど、前提が違えば同じ機能でも意味合いが変わってくる。ここを曖昧にしたまま進めると、後の工程で認識のズレが大きくなる。

IAの資料クリエイティブブリーフ(一部)(昔の情報なので少し言葉が古い)

  • 要件仕様書
  • サイトのカテゴリ分け
  • プロジェクト構成図
  • スケジュール
  • システムサポート要員の整理
  • ヒューリスティック評価
  • ワイヤーフレーム
  • ユーザーフロー図

IA資料の在り方。IAが作った資料は、それだけで完結するものではなく、その後の設計・開発・レビューといった段階を経ていく中で、認識のズレが生まれやすい。特にSIerやコンサルの立場では、資料化の意図が正確に伝わらないと、クライアントとの信頼を損なうリスクがある。逆に、ここを丁寧にやり切れると、プロジェクト全体の成功要因になる。

UI設計 — その機能は目的を達成できるか、しやすいか

これまでのアクティビティで出てきた情報を基に、ユーザーのニーズを満たす画面と機能を作成していく。[2021年頃の情報なので古いです]

ラベル文言とUI

ラベルの文言は特に重要だと考えている。文章をそのまま使うのではなく、短く、何を伝えたいかが一目でわかる言葉を選ぶ。ボタンについても、押した結果どうなるかがすぐに想像できる文言を優先する。既存のUIパターンから大きく外れすぎないことも、迷わせないための工夫のひとつ。

アプリUI固有の設計ポイント

操作対象が今どういう「状態」にあるかを、UI上で分かりやすく表現できているかを意識する。表示要素が変わったときに、次に何を入力・操作できるのかが伝わるかどうかも重要な観点。

たとえば、ToDoアプリでタスクの完了・未完了をひと目で区別できるようにする、ステータスによって色を変える、対応期限が近いものを強調表示するといった工夫は、デザインシステムの中でよく使う具体例。

アプリのUI作成での注意

会社やプロジェクトの規模によって、UI作成のフローやツールは変わる。これまで複数のOS・デバイスに触れてきた経験から、iOS・Android・Windowsそれぞれのシステムルールや操作習慣の違いを理解しておく必要があると感じている。デザインルールをそのまま踏襲するだけでなく、レギュレーションの背景まで理解した上で判断するようにしている。

← デザイン思考のプロセス Notesへ戻る →