飛躍し過ぎかと思われそうですが、アプリUI開発はインフォグラフィックスに通じます。 「長文の説明文を読ませたくない。」「間違えやすいミスを防ぎたい」これらの考えを解決するのがインフォグラフィックスはとても得意です。
インフォグラフィックスの魅力は情報整理術にあります。膨大な量、バラバラの要素、地理情報に、細かい数値。これらを文字情報で理解するには、時間を要することが多いです。 より早く理解するために作られたインフォグラフィックスの工夫は、アプリUI開発に多くのヒントをもたらしてくれます。
機能性のインフォグラフィックス
インターフェイスとして、地図やマニュアルにおいてユーザーへの指示や状況を説明する、機能性をもつインフォグラフィックスから、見せ方を考えてみます。
(1) アイコンで見せる
インフォグラフィックスは概念を表す言葉のため、表現方法を広く含みます。言語に頼らないピクトグラムもその一つです。
文字が読めない外国人や、小さな子供でも瞬時に理解できるように使われているアイコンをピクトグラムとも呼びます。非常口のピクトグラムは1987年に国際規格ISOに組み込まれて国際標準になっています。制作したのは日本人の太田幸夫氏です。世界で使われていると思うと嬉しいですね。
Webサイトやアプリケーションではアイコンと呼ばれる事が多いですが、絵によって初心者にも使いやすいように用いられています。iPhoneのデフォルトアプリのミュージックではメニューボタンにアイコンが利用されています。
サービスが想定できるように、アイコンが補足情報となっています。画面の小さいスマートフォンは文字が読みにくくても情報の判別がつく、重要な役割を担っています。誰でもわかりやすいアイコンを身近な所から探してみると大きなヒントになるかもしれません。
(2) 色で見せる
人は、色が持つ印象を無意識に抱いていると言われています。 では、問題です。赤色、黄色、青色に対してどのような印象を持っていますか？
心理学における色の印象を利用している物が多くあります。信号機は良い例です。
（UX&UI設計講座のスライドより参照）
iOS 7でも、赤い色は注意するべきこと（少ない充電、マイナス要素、アップデートの必要性等）を知らせ、青（緑）は、許可すること（承認ボタン、プラス要素、ログイン状態）を知らせています。
UIの話に偏っているようですが、多くのインフォグラフィックスでは色を有効的に利用していることが多いです。いかにビジュアルから早く情報を伝えることができるのか？誤った操作を行わないためにはどのように利用すれば良いのか？を考えるヒントになります。
(3) 地図で見せる
イギリスの石炭輸出量を表すインフォグラフィックです。1870年に死去したCharles Joseph Minardの作品です。この時代は手描きかと思われますが、美しいですね。 地図との組み合わせで細かな説明文が読めませんが、輸出量と各地への輸出が図から読み取れます。
SwapSkillsのイベントDoubbble10に登壇される櫻田さんのビジュアルシンキングの記事で紹介されているサービスを見てみます。
PeekAnalyticsはTweetを解析して、話題に挙がっているハンバーガーチェーンをアメリカ地図上にマッピングされています。 Most Popular Burger Joins on Twitter（記事より引用）
2つの例にはおよそ150年の差がありますが、どちらも地図上に情報を可視化することで、文字情報を読むよりも大まかな情報を瞬時に理解することができます。スマートフォンのジオロケーションを利用したアプリケーションも数多く存在します。一見、機能ありきのように見えますが、どうして地図の上に情報があるとわかりやすいのか？今一度、振り返ると面白いですね。
(4) 量で見せる
同じくCharles Joseph Minardのナポレオンのロシア遠征の作品を見てみます。彼はサンキー・ダイアグラムという工程間の流量を表現する図表の先駆者でもありました。（wikipadeia参照）
量を可視化することは、Webサービスでも多く見られます。以下、Googleの天気予報では、選択した温度・降水確率・風力がグラフになって見ることができます。
Google Analyticsでも瞬時に、情報をグラフによって量を可視化します。
「わかりやすい」は「利用する」に繋がります。これらのツールが全てテキストの情報で抽出された場合、このツールを利用されるでしょうか？
最後に
アプリ開発に限りませんが、モバイルファーストの考え方が浸透した今、この小さな画面でどのように情報を伝えるべきか？は大きな課題です。あらゆる情報がWebサイトで氾濫し、より直感的に使用されるスマートフォンなどのデバイス。より、楽しく利用するためにもわかりやすく伝えるにはどうすればいいのか？これらのヒントがインフォグラフィックスには多く詰まっています。
普遍的な情報の読解、整理、そして表現を学ぶ事は、今もこれからも重要なヒントを与えてくれると思います。
SwapSkillsでは、インフォグラフィックスのセミナーイベントを予定しています。
SwapSkillsDoubbbleで「インフォグラフィックス」をテーマに開催
- 【イベント名】：SwapSkillsDoubbble(10)「「伝える」を掘り下げる インフォグラフィックス」
- 【日時】：8月18日（土）13:00 ～ 17:00
- 【参加費】：6,800円～7,800円
- （詳細／お申し込み） http://swapskills.info/doubbble/10.html
