Entries

UI考 – ざっと見る、じっと見る

英文の速読術には、スキミング・スキャニングと呼ばれる技法がある。

スキミングとは「ざっと一覧して、全体を把握する」こと。各章のタイトルや、パラグラフの一文目、最終のまとめなど、要所要所だけをかいつまんでいく読み方だ。

一方、スキャニングは「特定の部分を熟読する」こと。こちらは一転して、一単語ずつ精査していく読み方である。

まず最初に全体をざっと見て(スキミング)、自分に必要な内容があるかをチェックする。その後に、必要な部分だけを選別してじっと見て(スキャニング)いく。英文速読では、この2つの読み方をペアにして扱う。つまり速読術とは全文を素早く読むことではない。細部を無視して、要点だけを拾い上げていく技法なのである。



この英文速読術の技法、スキミングとスキャニングは、画面の情報設計の大きなヒントとなる。情報を効率良く読むテクニックが確立されているのなら、それをロジック化すればよい。ロジックを画面デザインとして落とし込むことで、すべてのユーザーに擬似的に速読術を提供することができる。

アプリやサイトの画面設計をするとき、まず情報をすべて洗い出す。
そして情報を、「ざっと見る(スキミング)情報」と「じっと見る(スキャニング)情報」の2つに分類する。

「ざっとみる情報」は、大見出しや、アイキャッチとなる画像・アイコン、リストのタイトルなどが該当する。まず「ざっと見る情報」をチェックするだけで、「これは何か?」と「自分にとって必要なものか?」の判断を、ユーザーが判断できなければならない。「ざっと見る情報」は、一目瞭然性(グランサビリティ)が重要なので、大きく高コントラストにし、余白を広めに取っていく。

一方の「じっと見る情報」はユーザーが、コンテンツに興味を持った後に意識して読む情報のことだ。カテゴリ名や日付、作者、注意書きなどが該当する。「じっと見る情報」は、普段は目に留まらなず、空気のように透明であることが重要となる。情報を俯瞰する段階では気にならず、ユーザーが意図的に読もうとしたときにはじめて、目に入ってくるのが望ましい。このため「じっとみる情報」では、相対的に小さい文字や、薄い色などを用いる。


下図はApple Newsの画面である。色分けで赤くしたところが「ざっと見る情報」。黄色くしたところが「じっと見る情報」だ。まずユーザーは「ざっと見る情報」で、コンテンツが自分にとって必要かどうかを判断する。その次に、「じっと見る情報」で、内容を評価したり、付随情報を確認していく。



このように情報のプライオリティを設計することで、全てのユーザーに擬似的な速読術を提供することができると考える。逆にゴチャゴチャしたリストやタイムラインなどは、この情報の分類ができていないものが多い。

銀行のATMなどは、この「ざっと見る」と「じっと見る」を分類できてない典型例だ。


http://blogs.yahoo.co.jp/pxgkh605/2712243.htmlより引用

すべての文字を大きくしたり、赤くすることは無意味である。なぜならば、画面内のすべての文字を大きくすると、「ざっとみる情報」と「じっと見る情報」が区別がなくなってしまう。結果、ユーザーは画面全体を見渡し、すべての文字に目を通さなければならなくなる。

可読性において重要なのは、単純な文字の大きさではない。プライオリティと用途の設定である。「ざっとみる情報」と「じっとみる情報」を正しく分類し、「ざっとみる情報」を正しく強調することで、可読性やユーザビリティを大きく高めることができる。

デザインにおいて、情報のプライオリティ付けやグルーピング、階層化などは当たり前の事と考えられている。だが「なぜそれが必要か?」が、あまり言語化されて周知されていないように思える。多くの場合、説明は、「そのほうが見やすいから」あるいは「そのほうが美しいから」という説明で終わってしまう。しかし「美しさ」という尺度は、エンジニアやビジネス層からみると定性的すぎて判断がつきにくい。「ざっと見る」と「じっと見る」という概念で説明し、ロジカルな観点と利便性から説明したほうが、デザイナと外部の共通理解を得られやすいのではないかと思う。