情報デザインの考え方と手法

snack
snack

近年では製品やサービスなどでUXデザインが注目されてるっすね。

ボキタロー
ボキタロー

UX(User Experience)ってたしか、ユーザー体験っていう意味だっけ?ストラテジのところで勉強したよね。

snack
snack

そうっすよ。UXデザインは製品・サービスを使う前、使っているとき、使った後でユーザーがどんな気持ちになるかを考えて設計するっていうことっす。

ボキタロー
ボキタロー

ただ使えるっていうだけじゃダメなんだ。そんなことまで考えて設計してるんだね。

目標・情報デザインの考え方や手法を理解する。
説明・目的や受け手の状況に応じて正確に情報を伝えたり,操作性を高めたりするための考え方や手法を理解する。
情報デザインの考え方と手法の概要

情報デザインの考え方や手法

情報デザインとは

情報デザインとは、情報を分かりやすく、使いやすく、伝わりやすく設計・構成することを指します。特に、複雑なデータやコンテンツを視覚的・構造的に整理して、見る人・使う人にとって直感的に理解できるようにするのが目的です。

さらっと学習【デザインの原則】

デザインの原則(近接、整列、反復、対比)は、視覚デザインの基本となる4つの重要なルールです。特にグラフィックデザインやプレゼン資料、Webデザインなどでよく使われます。

・近接:関連する要素は近づけて配置し、関係のない要素は離す。
・整列:要素を揃えて配置する(左揃え、中央揃え、右揃えなど)。
・反復:デザインの中で要素(色、フォント、形など)を繰り返して使う。
・対比:異なる要素を明確に区別して強調する。

情報デザインの手法

シグニファイア

シグニファイアとは、操作や行動のヒントを与える視覚的・物理的なサインのことです。例えば、Webボタンであれば色が違う、ホバーで変化する、立体感があるなどの特徴を付けて、ユーザーに「クリックできる」ことを伝えたり、スマホ画面に一部のコンテンツを少しだけ見せることで「スワイプできる」ということを伝えることができます。

シグニファイアは「迷わせないデザイン」を作るうえで重要であり、情報をただ置くだけではなく、どう扱ってほしいかをきちんと示します。

構造化シナリオ法

構造化シナリオ法とは、ユーザーの行動や目的を、具体的なシナリオ(物語)として記述し、構造的に整理する方法です。ユーザーの視点から、「何を」「どんな順番で」「どんな状況で」「どんな課題を持って」行動するかを可視化していきます。

LATCHの法則

LATCH(ラッチ)の法則は、情報を「Location(場所)」「Alphabet(アルファベット/名前順)」「Time(時間)」「Category(カテゴリ)」「Hierarchy(階層)」の5つの軸で整理するという考え方です。

項目内容
Location(場所)地理的・空間的な位置で整理地図、店舗一覧(都道府県順)、観光スポットの位置
Alphabet(五十音順)名前やタイトルの五十音順・ABC順で整理辞書、連絡帳、索引、目次
Time(時間)時系列で整理年表、タイムライン、進捗表、履歴
Category(カテゴリ)タイプやジャンル別に分類商品カテゴリー、ニュース(スポーツ/政治/芸能など)
Hierarchy(階層)重要度や大きさなどの順位・優先順位順で整理売上ランキング、重要ニュースTOP5、組織図

UXデザイン

UX(User Experience)デザインとは、ユーザーが製品やサービスを使って得るすべての体験を設計することです。ただ使えるだけではなく、気持ちよく・ストレスなく・満足して使ってもらえる体験をつくるのが目的です。

UXは単なる見た目やUI(ユーザーインターフェース)だけでなく、サイトやアプリを見つける→初めてアクセスする→操作する(UI、ナビゲーション)→困る・迷う(エラーや遅さなど)→使い終わった後の感想・印象、といったユーザーが体験する一連の流れすべてを良くするための設計となります。

ユニバーサルデザイン

ユニバーサルデザインとは

ユニバーサルデザインとは、年齢・性別・身体的な能力・言語・文化的背景などに関係なく、すべての人にとって使いやすいように設計するデザインのことを指します。情報デザインやWebデザインだけでなく、家具、家電、日用品、公共施設、駅、エレベータなど様々な場面で使われています。

ユニバーサルデザインは、アクセシビリティ(すべての人が障がいの有無や環境にかかわらず、情報や機能にアクセスできる状態にすること)を高めるための設計ともいえます。中でもWebサイトを誰でも利用できるように配慮することをWebアクセシビリティと呼び、W3Cが定めた国際的なWebアクセシビリティの指針(知覚可能・操作可能・理解可能・堅牢など)があります。

snack
snack

要するに、使えない人を作らないように設計するっていうことっすね。

なお、ユニバーサルデザインと似た概念でバリアフリーがあります。ユニバーサルデザインが「誰にとっても使いやすく設計する」ことであるのに対して、バリアフリーは「高齢者や障がい者向けに障壁を取り除く」という考え方です。

ユニバーサルデザインの7原則

ユニバーサルデザインには、アメリカのノースカロライナ州立大学が定めた、有名な7つの原則があります。

  1. 公平な利用:誰でも使える(障がいの有無に関係なく)
  2. 柔軟な利用:使い方がいくつもある(右利き/左利きなど)
  3. 単純で直感的:操作がわかりやすい
  4. 情報のわかりやすさ:必要な情報がすぐに伝わる(視覚・音声など)
  5. ミスへの寛容さ:間違えても大きな問題にならないように設計
  6. 少ない身体的努力:力や動作が最小限で済むようにする
  7. アクセスしやすいサイズと空間:いろんな人の体格や道具に対応できるスペースを確保

ユニバーサルデザインの具体例

分野ユニバーサルデザインの例
家電凹凸のあるスイッチ、大きな表示文字
サインピクトグラム(言語に依存しないマーク)
Web音声読み上げ対応、色覚バリアフリーな配色
建築スロープ付きの入口、点字ブロック、広めのトイレ
教育図解を使った教材、多言語対応の教材
ボキタロー
ボキタロー

非常口やトイレなどのピクトグラムはよく目にするよね。

さらっと学習【インフォグラフィック】

インフォグラフィックとは、情報(Information)とグラフィック(Graphic)を組み合わせた造語で、言葉だけでは伝わりにくい複雑な情報・データ・知識などを、図解などで視覚的に整理・表現して、パッと見てわかるようにするデザイン手法です。

プレゼン資料や報告書、SNSや広告、ウェブ記事やニュース、学校の教材、観光マップ、案内板などでこの手法が利用されています。

確認○×問題

問1

見る人に意図が伝わりやすいデザインにするための四つの原則に関する次の記述中の(a)(b)に入れる字句の適切な組合せは、(a)が「対比」、(b)が「整列」である。

[四つの原則]

近接 : 互いに関連する要素は近づけてグループにする。
(a) : 要素を意図したルールに基づき配置する。
反復 : 要素ごとにデザインルールを繰り返す。
(b): 要素ごとの大小や強弱などの違いを明確にする。

答え:×

デザインの原則(近接、整列、反復、対比)は、視覚デザインの基本となる4つの重要なルールです。特にグラフィックデザインやプレゼン資料、Webデザインなどでよく使われます。

・近接:関連する要素は近づけて配置し、関係のない要素は離す。
整列:要素を揃えて配置する(左揃え、中央揃え、右揃えなど)。
・反復:デザインの中で要素(色、フォント、形など)を繰り返して使う。
対比:異なる要素を明確に区別して強調する。

よって、(a)(b)に入れる字句の適切な組合せは、(a)が「整列」、(b)が「対比」となります。

問2

情報デザインで用いられる概念であり、部屋のドアノブの形で開閉の仕方を示唆するというような、人間の適切な行動を誘発する知覚可能な手掛かりのことをシグニファイアと呼ぶ。

答え:〇

正しい記述です。

シグニファイアとは、操作や行動のヒントを与える視覚的・物理的なサインのことです。例えば、Webボタンであれば色が違う、ホバーで変化、立体感があるなどの特徴を付けて、ユーザーに「クリックできる」ことを伝えたり、スマホ画面の右に一部のコンテンツを少しだけ見せることで「スワイプできる」ということを伝えることができます。

問3

UXデザインとは、情報を「Location(場所)」「Alphabet(アルファベット/名前順)」「Time(時間)」「Category(カテゴリ)」「Hierarchy(階層)」の5つの軸で整理するという考え方である。

答え:×

設問の記述はLATCH(ラッチ)の法則の説明です。

UX(User Experience)デザインとは、ユーザーが製品やサービスを使って得るすべての体験を設計することです。ただ使えるだけではなく、気持ちよく・ストレスなく・満足して使ってもらえる体験をつくるのが目的です。

問4

Webアクセシビリティとは、年齢や身体的条件にかかわらず,誰もがWebを利用して,情報を受発信できる度合いである。

答え:〇

正しい記述です。

Webサイトを誰でも利用できるように配慮することをWebアクセシビリティと呼び、W3Cが定めた国際的なWebアクセシビリティの指針(知覚可能・操作可能・理解可能・堅牢など)があります。

問5

文化、言語、年齢及び性別の違いや、障害の有無や能力の違いなどにかかわらず、できる限り多くの人が快適に利用できることを目指した設計をバリアフリーデザインという。

答え:×

設問の記述はユニバーサルデザインの説明です。ユニバーサルデザインが「誰にとっても使いやすく設計する」ことであるのに対して、バリアフリーは「高齢者や障がい者向けに障壁を取り除く」という考え方です。