1. 前回は今年流行の”フラットデザイン”のお話しでした。
↑これね、コレコレ。
20130628
ohnishi

2. で、これを見た時、
「それって、アイコンじゃね～の」
って思った人多いんじゃないですか？
いや、私のことなんですけどね。

3. 立体感の演出を放棄して平面的な仕上げにしていくと、
どうしても“アイコン的”に見えますね。
ところで皆さんが日ごろ何気なく口にする｢アイコン」ですが、
これ正確には「ピクトグラム」と言います。
↑ピクトグラム↑ アイコン

4. 「どこが違うねん？」
って思ったでしょ。尾崎君。
そんな尾崎君に今日はちょっとお勉強してもらうことにしたよ。
そもそも「ピクトグラム」や「アイコン」ちゅーのは、
「情報デザイン」という範囲の中で誕生したもんです。
「情報デザイン」ちゅーのは
“情報を目に見える形にすること、
情報の関係を形にすること ”
なんです。
その手段として「ピクトグラム」や「アイコン」が生み出されました。

5. ◆そもそも「デザイン」ってナニ？
19世紀のヨーロッパにおいて工業化が進む中、
大量生産のための原形を作る人やその職種が生まれたのだが、
当時それを指す言葉がなかったらしい。
そこで、「素描」を意味するイタリア語の「disegno」や
フランス語の「dessin」を語源とする
「デザイン」という言葉がようやく誕生したのだー。
その後、デザインという言葉とその指す内容は
少しづつ明確化していき、一般化していった。
そしてその過渡期の段階で、
すでに情報デザインなる捉え方も生じ始めていた。

6. ◆情報デザインの誕生
情報デザインが必要とされる要因は、
情報が膨大になったことが大きいが、
他にも現代の社会や人々の意識が大きく変わってきたこともあげ
られる。
交通機関の発達に伴い、経済を中心とした人間の活動範囲が急速
に拡大した。
その結果、言語や風習の異なる者同士の交流が活発化したのさ。
となると、非言語的なコミュニケーション手段が必要ってことに
なったんだよね。

7. ◆ピクトグラムの誕生
第一次世界大戦後のヨーロッパでは戦争の反省から、言葉が異な
ることが大きな問題であり、容易にコミュニケーションができる
方法を検討する動きが生じた。
そうした時期に、オーストリアの哲学者・教育者であるオッ
トー・ノイラートは1925年に「アイソタイプ」（ISOTYPE：
International System of Typographic Picture Education）を
「国際絵ことば」として考案した。
ウィーン市の社会・経済博物館の開設に関わったノイラートは、
そこで数多くの展示パネルをデザインした。
数値データを分かりやすく表示するため
「ピクトグラム」（絵文字）
を用いて視覚化したアイソタイプは、年齢や教育程度に左右され
ない理解しやすい表現として注目が集まった。

8. ◆ピクトグラムとアイコン
PCの発達の中でのひとつのエポックが“GUI”の発明です。
Macintoshはデスクトップにフォルダとゴミ箱を象徴とする概念
を提示したよね、あれがまぁ代表的なGUI。
でもってこのフォルダとゴミ箱がアイコンなんだ。
正確に言うと、日常生活の中で標識などに使用する
絵文字を「ピクトグラム」と呼び、コンピュータ操作で
使用しているグラフィックシンボルは「アイコン」と
呼ぶ。

9. ◆何で呼び方を分けるのか？
アイコンとは、ギリシャ語で図像の意味をもつ「イコン」を英語
読みしたもの。
イコンとは元来、キリスト教の宗教画に表現された聖人や聖母、
キリスト像などの偶像を指した言葉で、中世の美術用語であった。
20世紀でも現代美術やポップアートでの美術評論で「類似記号」
という意味合いで使用されている。
コンピュータ処理という別世界を把握するために、コンピュータ
のデスクトップ上に日常の概念を擬似的に置き換えることから、
ピクトグラムではなくアイコンと呼んだと一般的には言われてい
るんだな。

10. ◆結論
アイコンもピクトグラムも共にグラフィック・シンボルであり絵文字なんだけど、
使う場所によって異なる呼び方をするんですね。
↑ピクトグラム↑ アイコン
屋外・屋内の標識・サインや、紙媒体
電波媒体などで使用する際の呼称。
PCやwebサイトなどで使用する際の呼
称。ケータイやスマホの場合の呼称は
未定着。ま多分こっちだろうね。

11. ◆ちなみに
このピクトグラムのように、
ある環境や空間での行動にともなう判断を手助けする情報を「サイン」という。
人と物と情報のコミュニケーションを図るデザイン ですね。
上のピクトグラムは、1974年にアメリカ運輸省が34種類の案内用ピクトグラムを国
家規格として制定したものの一部。
著作権が開放されているので、日本でも使用されておなじみですね。
これが「情報デザイン」と呼ばれるものの基本です。

12. 実はこっからが
今回の本題。

13. 「情報デザイン」ちゅーのは
“情報を目に見える形にすること、情報の関係を形にすること ”
ってお話ししましたね。尾崎君覚えてるかな？
ここから派生的に生まれたものとして、
“インフォグラフィックス”ちゅーのがありんす。
ウィキ的定義によると、
◆情報デザイン（じょうほうデザイン、英: information design）は、人間とモノ
や環境との関係性にかたちを与える方法論、生活の中にあふれる無数の情報をわか
りやすく提示する手法、あるいは、それらの考え方。
◆インフォグラフィック（英語: infographics）は、情報、データ、知識を視覚的
に表現したものである。概念的情報を分かりやすく表現するツールとしてよく用い
られる。
ってなってマス。
＜見えにくい情報＞を＜わかりやすい形＞にするデザインがインフォグラフィックス。
言葉では伝わりにくいものでも、絵や図で説明されると簡単に理解できることが
たくさんありますよね。面積○○万平米って言われてもピンと来ないけど、東京ドーム
の絵が2個あれば、なんとなく想像できる。あの感じです。

14. インフォグラフィックスはもともと新聞やニュース系雑誌などがモノの説明、
事件・事故など出来事の様子を伝えるための手段として発達しました。
表現形態でみると、以下の6種類に分類されます。
＜ダイアグラム＞
主にイラストを用いて図解説明する
＜チャート＞
図形・線・イラストなどで相互の関
係を整理する
＜表＞
情報をある基準で区分して縦軸・横
軸上に整理する
＜グラフ＞
数値で比較や変化を表す
＜地図＞
一定の地域における位置関係を表示
する
＜ピクトグラム＞
文字を使わずに絵で物事を直感的に
伝える

15. インフォグラフィックス サンプル：世界で最も交わされている挨拶は？
日本語を公用語にしているのは日本だけだと思われがちですが、パラオのアンガウル州でも日本語を公用語としています。
1914年から1945年までは日本がパラオを統治しており、その間、日本人の教師が日本語で授業を教えていたからです。

16. インフォグラフィックス サンプル：ウェブの進化
LINK

17. インフォグラフィックス サンプル：A Guide to When Fruits and Vegetables Are in Season

18. インフォグラフィックス サンプル：履歴書

19. インフォグラフィックス サンプル：Nuclear Weapons 101

20. インフォグラフィックス サンプル：World's Largest Aircraft

21. webならではのインフォグラフィックスもたくさんあるよ！

22. インフォグラフィックス サンプル：輝かしきカーシェアリングの未来
LINK

23. インフォグラフィックス サンプル：1993年と2013年を比べてみたよ
LINK

24. インフォグラフィックス サンプル：ウェブの進化
LINK

25. 当然僕らの仕事にも
使えるよね～

26. LINK
インフォグラフィックス サンプル：中古住宅とリフォームが今選ばれている理由
LPに転用できそうな
コンテンツだよね～

27. ということで、
僕らの仕事は純然たるデザインというよりも、
情報をデザインするってことのほうが多いよね、
ってお話しでした。
おしまい