tikeda's blog

Flower, Plant, Travel, Design, My life stories

情報を表す要素

「情報を見せる」技術 (光文社新書)という本を読んでみました。より専門的な言葉を使えば「情報デザイン」「インフォメーショングラフィクス」の基礎本なのですが、本文でもデザインという言葉があまり使われてない感じで具体的トレーニング方法などを添え分かりやすく説明している本です。あえて、デザインという単語をタイトルに使わないのも、デザイナーや制作に関わるような人じゃなくても「情報を見せる」技術が必要となってる場面が増えてるからかもしれないです。(サブタイトルの「ビジュアルセンスがすぐに身につく」というのは疑問でしたが。)

「情報を見せる」技術 (光文社新書)

「情報を見せる」技術 (光文社新書)


中でもこの3つはその技術のベースともなる要素だと思います。

サイズ(形態)

大きい、小さいなどの形態変化による表現。変化はなるべく大きくして上げた方がより効果があがります。文書で「タイトル」「本文」「補足」に差を用いるのもそれです。「人力検索はてなのアンケート結果グラフ(投票数)」「はてなブックマークのtag(フィード数)」「はてなフォトライフのサムネールバー(マウスオン)」などがこれにより表現されています。

色による、比較や分類する機会は多々ある。色味の変化は個人差や環境差が大きいのであまり重要な物には採用しにくいですが、明度や彩度の変化を用いる事で効果的に情報の表現ができます。また色自体がもつ印象というのもその1つ。「はてなRSSのデフォルトカテゴリ」「はてなRSSの未読・既読」「はてなブックマークの被リンク数」など。

位置

マトリクスやグラフなど表で良く用いられますが、情報の位置関係により表現します。大きな意味レイアウトもそうですね。「はてなアンテナのサイトの順序」「はてなダイアリーの注目の日記の順序」
がそれにあたると思います。


デザイン全般でこの3つは視覚的な要素の基本ですし1つの情報を伝える上で、3つの要素から、2つ、3つの要素を組み合わせて使う事により、意味が強調されたりる事もありますし逆に、複雑化したり、他の情報を組み合わせにくくなるという問題もあります。

また、はてなでの分かりやすい例を上で上げましたが、それぞれ別の項目に置き換えて考え直しる事で、それぞれの効果が発揮しやすい場面が見えてくるはず。自分自身、もちろんこの辺を意識して最良な方法を考え続けられればと思う限りです。