図表現による情報の構造表現に関する研究- 色彩とインフォグラフィックスによるサイン計画 -

A study on structural description of information using graphic representation.

- Tags System by color and information graphics -

1W090530-8 指導教員宮本　諒

MIYAMOTO Ryo

長 幾朗 教授

Prof. CHOH Ikuro

概要：　本論文は、インフォグラフィックスによる情報の図表現と色彩の関係に注目し、情報過多に落ち入ったメディ

アを、色彩によって情報の構造化を行うシステムを構築するための研究を述べたものである。脳に送られる情報の

うち90％が視覚情報であると言われ、表面情報は誰もが分かるように整理、表示することが必要とされ、綿密なサ

イン計画が必要となっている。インフォグラフィックスは、情報を視覚的な要素を用いて、わかりやすく図表現し

たものであり、膨大にある情報や数値を視覚的に瞬時に伝え、「魅力さ」と「わかりやすさ」を提供してきた。イン

フォグラフィックス要素の一つである色彩は、物体の表面情報そして視覚的特徴として挙げられ、我々の感情にあ

る種の働きかけ、あるいは心理的作用を及ぼすと考えられている。本研究ではインフォグラフィックスの表面情報

である色彩が、情報の構造化においてどのように機能するかを検討する。

キーワード：色彩、インフォグラフィックス、情報過多、構造表現

Keywords: color, information graphic, information overload, structural description

1. 本研究の背景　近年、メディアやコンテンツの発達とともに選択

出来る情報量が急増し、消費可能情報量を上回る情

報過多の時代に落ち入っている。つまり情報を素早

く機能的に得ることが重要になり、「わかりやすく」

「魅力的」である情報構造が求められている。視覚

表現における色彩は、文字より早く認知するという

報告もされており、色彩を適正に配置表現していく

ことで、送り手側の意思を効果的に伝えることが予

想出来る。またグラフィックス分野において情報を

静的、動的なグラフィックでわかりやすく伝えるイ

ンフォグラフィックスが注目されており、複雑な内

容でも魅力的に短時間で理解出来るようになった。

この二つの共通要素である「わかりやすく」「魅力的」

であることが情報過多の時代において必要なものに

なっている。

2. 情報デザインにおける色彩の役割　色彩は、歴史の中で振り返っていくと、様々な形

で使われてきた。人を区別し、階級や地位を表すよ

うな現実的な使われ方や色彩から連想されるイメー

ジを表す感情的な使われ方など実に様々である。こ

れらは多様な色の効果が期待出来る。

　情報伝達に色彩が果たす役割は、情報内容を早く

正確に伝え、わかりやすく、記憶されやすくするこ

とである。視認性、誘目性、識別性など、色の見え

やすさに関する諸特性が、情報伝達の機能を発揮す

るよう、適切な活用がなされることが望ましい。ま

た、その他の色彩知覚に関する心理的要因も、情報

伝達機能と深い関わりを持つ。情報デザインにおけ

る色の役割は「伝達を助ける力」「記憶に訴える力」

「識別させる力」「区別させる力」「階層化する力」

があり、役割に沿った配色を施すことでスムーズに

情報が伝達できることが期待される。

3. インフォグラフィックス　インフォグラフィックスとは、あるひとまとまり

の情報を視覚的な要素を用いて受け手にわかりやす

く伝えることを目的とした図表現の総称のことであ

る。インフォメーションとグラフィックスを合成し

た言葉で「インフォグラフィックス」、または「イ

ンフォメーション・グラフィックス」と呼ばれてい

る。膨大にある情報や数値を、「魅力的に」伝える

デザインを追求し、機能的で間違えさせない情報デ

ザインにもなってきており、今まで見えていなかっ

た情報を分かりやすく視覚化する働きがある。イ

ンフォグラフィックスは、コミュニケーションを

意識した情報表現の枠組みの中で、「ダイアグラム」

「チャート」「グラフ」「マップ」「ピクトグラム」と

1

図 1 街中にあるインフォグラフィックス ( 木村 ,2010)

いう5つの種類に分類できる。また「色彩」「サイ

ズ」「位置」「形」「つながり」の5つの要素を組み

合わせて情報を視覚化しており、組み合わせ方を変

えることによって、様々な機能を持ったインフォグ

ラフィックスを生み出している。

4. 情報の構造化　情報デザインは情報を分解し、再度構造化するこ

とである。構造化していくためのステップは大きく

分けて以下の4つである。「1.目的と対象の理解」

「2.素材データの収集」「3.情報の分類・整理・組

織化」「4.モデルの構築」の段階で情報の構造化が

進んでいく。このような情報の構造化において、図

の場合は、文章より多様性を持たせることが出来る

ため、2次元の空間を使って流れや方向性などの多

様な意味を表現することが可能となる。直線的に理

解する文章では表しにくい構造も多いため、図の長

所を活かした構造の表し方を身につけることで、伝

達の効率を上げることが出来る。図の長所を活かす

ことで、初めての機器に接するときの操作手順や、

よく知らない場所を把握しながら移動する際の仲介

役として、スピーディに理解してもらうためのイン

タフェースの役割としてもインフォグラフィックス

による情報構造化は有効である。

5. インタフェースの提案　今回提案するグラフィカルユーザインタフェー

ス（Graphical User Interface, GUI）である「Color

Infographics Interface」は、情報過多のメディア

に埋もれた本当に知りたい情報を自動的に収集し、

それに合ったインフォグラフィックスを自動的に作

成し、情報を色彩で階層化・分類するインタフェー

スである。色彩とインフォグラフィックスでデータ

を分類、構造化し、情報をわかりやすく魅力的に表

すコンセプトをもとに情報を掲示する。各情報帯を

色相で区別・グループ化し、階層化することで情報

の構造性と識別性を高め、またインフォグラフィッ

クスによりインタラクティブにわかりやすく情報を

掲示している。

6. 結論と考察　本研究では、インフォグラフィックスによる情

報の図表現と色彩の関係に注目し、情報過多に落ち

入ったメディアを、色彩とインフォグラフィックス

によって情報の構造化を行うシステムを構築するた

めの研究を述べてきた。情報過多のメディアが増え

る社会の流れの中で、「わかりやすく」「魅力的な」

情報掲示は必要なシステムであると感じた。

　インタフェースの仕様を検討していく上で、イン

フォグラフィックスを実際に作ってみようとする

と、どのようなデザインにすれば良いのか悩んでし

まう。一般人にとって、配色やレイアウトは思った

より敷居が高いもののように感じた。情報過多のメ

ディアをインフォグラフィックスと色彩で簡潔に整

理することは実際には簡単にできることではない

が、その二つを用いることでいつも以上に印象に残

り、記憶に残りやすい。また一目で情報が瞬時に分

かることができることは色彩の大きなメリットの一

つである。美しく、わかりやすい、データの可視化

を行う方法を教えてくれるインタフェースになれる

ようにするためには多くの地道な知覚実験を行う必

要があると感じた。

図 2 Color Infographic Interface 使用イメージ ( 宮本 ,2013)

1)「インフォグラフィックス―情報をデザインする視

点と表現」(木村博之 .2010)

2)「色の百科事典」(日本色彩研究所 .2005)

3)「図解世界の色彩感情事典」(千々岩英彰 .1999)

4)「www における色彩を用いたメタデータの作成方法

に関する研究」(戸塚はる奈 .2009)

5)「感性スケールによる色彩構成手法による研究」(延

本篤人 .2004)

6)「情報デザインの教室」 ( 情報デザインフォーラ

ム .2010)

図 1. インフォグラフィックス―情報をデザインする

視点と表現」(木村博之 .2010)

図 2. 宮本 (2013)

2