インフォグラフィック作成のアイデアとセオリー

Webサイト制作
Webデザイン
2017.06.17

インフォグラフィックスという言葉をご存知ですか?
ここ数年で聞くようになった言葉ではありますが、
実は道路標識や、天気予報のアイコンなどもインフォグラフィックスのひとつです。天気予報など各局工夫しており、おそらくみなさん見やすくてお気に入りの天気予報があるのではないでしょうか!
インフォグラフィックスは、ビジュアライゼーションと比べ、より、イラストや図が中心であり、視覚化に徹しているという印象ですが、イラストが書けないと作れないのかな?など思っている方も多いと思います。
そこで今回はインフォグラフィックスの作成に活かせるようなセオリーやアイデアをいくつかご紹介していきたいと思います。

改めてインフォグラフィックとは?

インフォグラフィック(英語: infographics)は、情報、データ、知識を視覚的に表現したものである。インフォグラフィックは情報を素早く簡単に表現したい場面で用いられ、標識、地図、報道、技術文書、教育などの形で使われている。

https://ja.wikipedia.org/wiki/インフォグラフィック

何故インフォグラフィックスが注目されているのか

特許庁が公文書にインフォグラフィックスを採用するとなり話題にもなりましたね。
インフォグラフィックスはデータ・情報・知識の視覚化
数字が羅列している統計書、小さな文字で書かれた規約、それが難しい内容であればある程、それは多くの人に読んでもらえるものではなくなってしまいます。
政府が発行する公文書での使用は初めてのようで、このようなものこそわかりやすく伝える責任があると思うので、とても良い流れではないかと思います!

セオリー別にみるインフォグラフィックス

それでは早速、制作に活かせるようなものをいくつかピックアップしていきます。

可視化の定番!ピクトグラム使い

一般社団法人 Open Knowledge Japan「税金はどこへ行った?」

ピクトグラムは視覚化の大定番ですね。今は無料のピトグラム作成ツールも充実しているので、インフォグラフィックス作成時にも、もってこいのセオリーだと思います。

円グラフに要素をプラス?マイナス?

http://acskk.com/?page_id=9783

円グラフに矢印をプラスするだけで、値上率の上下を表現しています。とてもシンプルでわかりやすいですね。


https://www.kaplaninternational.com/jp/blog/how-to-teach-english

こちらはいっその事いらない部分を全カットしたパターンです。
カットするとただの円じゃん!?となりますが、でも何故かグラフに見えてしまうのが、うまいなと思います。

棒グラフにモチーフをプラスする事で一度により多くの情報を表現

https://public.tableau.com/profile/amorrison5122#!/vizhome/Medianpay-blog_2/Searchbysalary___

男女の賃金比較です。「男女」を区別するだけなら棒グラフを赤を青に分ければ…とも思いますが、ひとつひとつにピクトグラムを使用するという点がクールだなと思います。


https://infogra.me/ja/infographics/10133

うまい棒好きじゃないとピンとこないかもしれませんが..w 棒グラフ自体がモチーフになるパターンです。
メーカーや民間企業のアンケート調査などではインフォグラフィックスの活用は、もう言うまでもないですね。

効果的なモチーフ使いのインフォグラフィックス

http://infographic.jp/gallery/multidevice/

棒グラフの背景に各デバイスのイラストが入っています。
操作する様子もフレームアウトした指で表現されていてわかりやすく、グッと目を惹きつけるデザインだと思います。


 

http://infographic.jp/gallery/multidevice/

黄色と黒の配色でミツバチと危機感を表現し、さらに「消える」という現象が一目瞭然でわかるデザインです。シンプルですが効果的なモチーフ使いですね!


https://infogra.me/ja/infographics/10074

文字を使わず、「数」をこんなにシンプルに表現しているセンスに脱帽です。円が一周つながる日には世界は平和になっているでしょうか…

地図を用いたインフォグラフィックス

http://47kyujin.com/column/infographic-working-mother

地図を塗り分ける方法は定番中の定番ですね。分布、比較、ランキングと様々な統計結果をわかりやすく表現する事ができます。


 

http://business.nikkeibp.co.jp/atclbdt/15/258689/113000006/

食べログの情報に紐付いているそうです。県域も指定する事ができ、これぞデータの可視化といえます。

まとめ

簡単ですがインフォグラフィックスについて紹介させていただきました。
国や自治体でのオープンデータ公開が広がってきており、インフォグラフィックスを使った情報の視覚化は今後もっと活用されるようになるでしょう。
ますます注目のインフォグラフィックス。デザイナーとしてアンテナを張って見ていきたいと思います。

SEOやWEB制作に関する情報を検索する

コラム

最新コラム

人気コラム

過去の記事

ご質問やご相談などお気軽にお問い合わせください。