情報デザインとは — 抽象化・可視化・構造化
駅の案内図、非常口のマーク、スマホアプリの画面——身の回りには「情報を分かりやすく伝える工夫」があふれています。これが情報デザインです。この講義では、情報デザインの3つの基本手法である「抽象化・可視化・構造化」を学びます。
情報デザインとは何か
情報デザインとは、効果的なコミュニケーションや問題解決のために、情報を整理し、目的や受け手に応じて分かりやすく伝達する設計のことです。ポイントは「きれいに飾ること」ではなく、「相手に正しく伝わること」が目的である点です。同じ内容でも、受け手(子ども・高齢者・外国人)や状況(急いでいる・初めて見る)によって最適な表現は変わります。情報デザインの代表的な手法が、抽象化・可視化・構造化の3つです。
抽象化 — 余計な情報をそぎ落とす
抽象化とは、伝えたい本質だけを残して余計な詳細を取り除くことです。代表例がピクトグラム(絵文字・図記号)です。非常口のマークは、人間の顔や服装の詳細を捨て、「走って外に出る人」という本質だけを残すことで、言語や年齢を問わず一瞬で意味が伝わります。地図も抽象化の好例で、路線図は実際の距離や地形を無視して駅のつながりだけを表現することで、乗り換えという目的に特化しています。
可視化 — 見えないものを見えるようにする
可視化とは、数値やことばだけでは把握しにくい情報を、図やグラフなどの視覚的な表現に変換することです。データの可視化では、目的に応じたグラフの選択が重要です。棒グラフは量の比較、折れ線グラフは時間による変化、円グラフは全体に占める割合、散布図は2つの量の関係(相関)を表すのに適しています。数量データを図で表現したインフォグラフィックスは、統計を直感的に伝える手法として報道や広報で広く使われています。ただし、グラフの軸を途中から始めるなどの操作で印象を誇張できてしまうため、作る側にも読む側にも注意が必要です。
構造化 — 情報に構造を与える
構造化とは、情報同士の関係を整理して配置することです。基本の型は3つあります。①順序(手順書のように時系列・段階で並べる)、②階層(樹形)(大分類→中分類→小分類と枝分かれさせる。Webサイトのメニューが典型)、③並列(対等な項目を並べる。比較表など)。文章でも「見出しを付ける」「箇条書きにする」「重要な語を強調する」ことは構造化の実践です。読み手は構造を手がかりに、全体像と詳細を行き来しながら理解を組み立てます。
- 情報デザインの目的は装飾ではなく「相手に正しく伝わること」。
- 抽象化=本質だけ残して詳細を捨てる(ピクトグラム・路線図)。
- 可視化=視覚表現への変換。グラフは目的で使い分ける(比較=棒、変化=折れ線、割合=円、相関=散布図)。
- 構造化=順序・階層・並列の3つの型で情報の関係を整理する。
- 受け手と目的によって最適なデザインは変わる。「誰に・何を・どう伝えるか」を最初に考える。
練習問題
- 情報デザインにおける「抽象化」とは何か、ピクトグラムを例に説明しなさい。
- 次のデータを可視化するのに最も適したグラフをそれぞれ選び、理由を述べなさい。(a)1年間の月別平均気温の変化(b)クラスの通学手段の内訳(c)勉強時間とテストの点数の関係
- 「構造化」の3つの基本の型を挙げ、学校のWebサイトのメニューがどの型にあたるか答えなさい。
解答・解説
- 解答:抽象化とは、伝えたい本質的な情報だけを残し、余計な詳細を取り除いて表現すること。例えば非常口のピクトグラムは、人物の顔・服装・年齢などの詳細を捨て、「走って出口へ向かう人の形」という本質だけを残すことで、言語や文化を問わず誰にでも瞬時に意味が伝わる。
解説:「詳細を捨てる」ことと「本質を残す」ことの両面を書く。捨てるからこそ速く・広く伝わる、という因果関係が核心。 - 解答:(a)折れ線グラフ——時間の経過による変化を表すのに適しているから。(b)円グラフ——全体に占める各項目の割合を表すのに適しているから。(c)散布図——2つの量の間の関係(相関)を表すのに適しているから。
解説:「変化=折れ線、割合=円、相関=散布図、比較=棒」の対応を理由付きで答えられるように。(b)は帯グラフも正解。 - 解答:3つの型は順序・階層(樹形)・並列。学校のWebサイトのメニュー(例:「学校案内」の下に「沿革」「校長挨拶」が並ぶ)は、大分類から小分類へ枝分かれする「階層」構造にあたる。
解説:Webサイトのナビゲーションは階層構造の典型例。パンくずリスト(トップ > 学校案内 > 沿革)は階層のどこにいるかを示す工夫。