一枚の絵は、千の言葉に匹敵する価値がある。この格言は、アイコンについて語るとき、より大きな意味を持ちます。「保存」「開く」「印刷する」などの言葉を聞けば、すぐにそれらのアイコンを思い浮かべられるでしょう。「ハンバーガーアイコン（メニューを示す三本線のアイコンを、ハンバーガーに見立ててこう呼ぶ）」も、ハンバーガーそのものほど有名ではありませんが、最近よく見るようになったアイコンの一つです。ところが、UXデザイナーのJames Foster氏はA/Bテストを行ったところ、ハンバーガーアイコンは、"menu"という言葉だけを記した場合と比較すると、分かりにくいということに気づきました。
このことに興味を持ったJamesは次に、ハンバーガー+"menu"は、ハンバーガーの三本線のみより分かりやすいのではないかと考え、A/Bテストを行いました。結果は予想通りでした。そして最後に、ハンバーガー+"menu"とただ"menu"という言葉に縁取りをつけたものを比較し、後者のほうが実に12.9%も分かりやすいという結果を得ました。つまり、ハンバーガーアイコンは、アイテムの名前を囲っただけの四角いボタンに比べると、まだ一般的に理解されてはいないということが分かったのです。
すべてのアイコンと言葉について、その組み合わせをA/Bテストにかける時間は私たちにはありません。たとえそれができたとしても、それだけではっきりした答えは得られないでしょう。多くのデザイナーや開発者たちが、アイコンと文字とではどちらが良いのかの答えを見つけるために奮闘してきましたが、明確な結論は出ていません。この記事では、こうした研究の成果を何とかまとめて、どのような時にアイコンが良くて、どのような時に文字が良いのかについてまとめてみようという、かなり難しいチャレンジをしてみようと思います。
スペースの狭さからアイコンを使う
デザイナーがテキストではなくアイコンを選択するのは、なによりアイコンによってスペースが節約できるからです。端末やその画面サイズが小さくなり、より直感的なデザインが必要になったため、デザイナーたちはアイコンを使用することが多くなってきたのです。
Googleは、最近のアプリケーションアップデートでアイコンを多用してきた企業の代表格です。彼らはその理由を開発者ガイドの中で説明しています。アイコンこそが、「動作、ステータス、アプリそのものを素早く、直感的に表現するのにぴったりだからです」と述べています。Googleはまた、これまであらゆる端末で使われてきたベクター画像や、広大なキャンバスを使ってデザインされてきた細かなイメージをシンプルなアイコンで置き換えるように勧めています。彼らがシンプルなアイコンを支持する理由ははっきりしています。シンプルなアイコンは直感的で、さらに小さなサイズで済みます。これらの特徴が、これからどんどん増えていく携帯端末の小さな画面で使用するのに非常に大事になってくる、というものです。
Googleが作った数多くのアプリは世界中で使われており、Googleはこうしたアプリにシンプルなアイコンを一貫して採用することで、より早く人々がアイコンの意味を理解できるようにしています。とても専門的な分野だと、複雑な意味を持つアイコンが必要になることもありますが、そうしたものは理解するのには時間がかかるものです。Microsoftのように、初心者を含む多くのユーザーに広く使ってもらうアプリケーションを開発している会社では、アイコンの意味をより分かりやすくするために、アイコンにテキストを加えています。一方、自社のみで使う専用のアプリケーションを持っている会社などでは、他では見ることのない特殊なアイコンの意味を理解させるために時間をかけてトレーニングをしています。専門性の高い分野では、その作業の意味を学習するのに時間がかかるのは当然のことで、限られたスペースに複雑なアイコン群を配置するのも、ある程度仕方がないというわけです。
こうしたことを念頭に置くと、アイコンは以下のような場合に使うのがベストだと言えます。
・アイコンの意味を社員に教育するのに十分な時間を持てる会社で使う場合
・国際的に使われるアプリケーションで、言語の壁があるためにテキストを使えない場合
・タブレット端末などを、まだ言葉が理解できない小さな子どもに使ってもらう場合
・小さな画面に、複数のややこしいボタンを配置しなければならない場合
単純化するために文字を使う
手頃な大きさで作成していたとしても、アイコンが必ずしもコミュニケーションを取るのにベストな方法ではない場合がある、ということに多くのデザイナーが気づいています。とりわけ、文化が違う場合だとアイコンの意味も違ったものになったり、ときにはまったく意味をなさないこともあるのです。これはユーザビリティにおける重大な問題です。UXの迷信に「アイコンはユーザビリティを向上させる」というものがあります。それによると、
アイコンのみのUIでは記憶に残りにくく、非効率な場合が多いということを多くの研究者が証明しています。MicrosoftのOutlookのツールバーが良い例です。昔のアイコンだけのツールバーはユーザビリティが低く、アイコンそのものや位置を変えても大して改善されませんでした。しかしアイコンの横に文字ラベルを付けると状況は好転しました。ユーザビリティの問題はすぐに改善され、ツールバーのユーザーも増えたのです。― 【UXの迷信】アイコンがあればユーザビリティは向上する？
アイコンの問題点の一つは、私たちが新しいものを作り出していくスピードにアイコンがついていけないということです。よく使われてきたアイコンが時代遅れになったり、その絵柄の持つ意味が次第に変わってきたりすることがあります。これに加えて、世界はどんどん狭くなってきています。文化が違うとアイコンの持つ意味がまったく違ったものになってしまうのです。チェックマークのようなごくシンプルなものにしても、イギリスでは「正解」という意味である一方、スウェーデンでは「間違い」という意味になります。アメリカでは赤いチェックマークは良くない意味に使われることが多く、学校のテストなどでは「間違い」という意味です。ところが、緑や黒のチェックマークは、フォーム1040（所得税申告書）で使われるときのように、とくに善悪どちらの意味も持たない場合もあります。一方、"X"はアメリカではよく間違いという意味で使われますが、完了や選択など、ちょうどチェックマークと同じような意味で使うこともあります。アメリカに商品を持ち込む際の関税申告書では、署名をするところに"X"マークが付いています。
要は、どのような場面で使うかによって変わるのです。例えば国際的に使われるアプリケーションでは、テキストだと明らかに言語の壁にぶつかるので、テキストが必ずしもアイコンよりも良いとは言えません。しかし単一の文化圏の中で、技術レベルの違う様々な年齢層のユーザーに使ってもらうアプリケーションなら、テキストがベストな選択肢になり得るでしょう。例えば今日のコンピューターでは基本的な機能にすべてアイコンを用いていますが、年配のユーザーのために、アイコンにマウスカーソルを乗せると説明の文字が表示されるようになっています。また多くのアプリケーションでは、重要な５〜10個くらいの機能にはアイコンの代わりにテキストを配置したボタンを使っています。
こうしたことを念頭に置くと、テキストのみ、もしくはテキストとアイコンを併用することは、以下のような場合に良いということになります。
・アイコンの持つ意味が異なる複数の文化圏で使用されるアプリケーションの場合
・年配の人や、技術的に未熟なユーザーに使ってもらうアプリケーションの場合
・わずかな数の重要な機能だけで成立しているアプリケーションの場合
・意味をできるだけ早く理解してもらう必要があるアプリケーションの場合
参考になる資料
適切な調査や研究をしなければ良いデザインは生まれませんが、以下の資料に目を通しておくことは、直感的に使えるアイコンを作るための複雑な仕組みを理解する良い足がかりになるでしょう。
こちらの記事の執筆者であるEdward Sanchez氏は、アイコンを具体的なもの、抽象的なもの、その中間のものの３つのカテゴリーに分けました。この記事で彼は、いつ、どのカテゴリーのアイコンを使うと良いかについて重要な検討を行い、アイコン・テキスト問題に関するいくつかの議論を深く掘り下げています。加えて、それぞれのカテゴリーのアイコンが最も効果を発揮している具体例を徹底的に調べあげています。つまり、私の記事があなたのお役に立つようなら、Edwardの記事を読むことで、より詳細に役に立つ情報が手に入れられるでしょう。
Jeff Sauro氏は、アイコンが効果的かどうかを決める一つの重要な判断基準を見つけました。すなわちそれは、そのアイコンが持っている意味をどれだけうまく伝えられているか、です。この記事で、彼はアイコンが効果的かどうかを判断するための７つのテスト方法を提案しています。その方法は、ある場面で使われているアイコンを被験者に見せて、その意味について言葉で説明してもらうといった簡単なものから、被験者がアイコンをよく理解していないとゴールにたどりつけないようなユーザビリティテストをさせる、といった複雑なものまであります。
Kelsey Campbell-Dollaghan氏はこの記事で、ハンバーガーアイコンの良し悪しについての答えを書いているわけではありません。しかし、ハンバーガーアイコンがどこからやって来たのかについて少しでも不思議に思ったことがある人は必ず読んでおくべき記事です。KelseyはNorm Cox氏という人物に、どうして三本の線が四角い枠の中にあるとメニューという意味になるのか？ という誰もが持つ疑問を投げかけています。
コンピューターアイコンの略史Tutsplusの著者でもあるLoungeKat氏が、アイコンがなぜ、どうやってコンピューターで使われるようになったかについて詳しく説明しています。この記事にはパート２：今風なアイコンのデザインという続編もあるのですが、そちらはすでに４年前のものなので今風とは言えなくなっています。しかし歴史は歴史ですから、特にこのパート１は、 過去の歴史を学んで将来優れたアイコン作りに活かしたい人にとってはうってつけの記事です。
AIGA(Symbol Signs The American Institute of Graphic Arts)は、国際的に意味が理解されているアイコン集の完全なライブラリをまとめています。これらのアイコンはすべてNoun projectから自由にダウンロードすることが可能 （Noun projectにあるアイコンがすべて国際的に理解されているものではありませんが ）です。
The International Organization for Standardizationも、こうした国際的に理解されているアイコンについて、PDFファイルで、マンガやイラストを用いて説明しています。しかし、ISOはアイコンのライブラリを提供しているわけではなく、このPDFは教育、啓蒙に使ってもらうことが主な目的です。
アイコンをどう使うかは、UXデザイナーたちの最大の関心事とも言えます。インターフェースのユーザビリティを活かすも殺すもアイコン次第です。そのため、アイコンはその必要性にのっとって使われなければなりません。UXデザインにおける他の分野と同じく、アイコンはターゲットとなるユーザー層が一番使いやすいものである必要があります。ターゲットのユーザー層を正確に捉え、アイコンを最大限活用できるかどうかは、コミュニケーター、デザイナー、クリエイターである私たちにかかっています。
