SimpleBoxes

アイコンの効用

グラフィカルなユーザーインタフェースでは、コンピュータに限らず、アイコンが重要な役割を果たすことは言うまでもないでしょう。

アイコンは「絵」という形で、対象、状態や動作を抽象化します。文字に頼らないので、ユニバーサルデザインにも繋がります。

「アイコン」をインタフェースに利用するのは、何もコンピュータやゲームだけに限りません。道路の標識も一種のアイコンと言えますし、多くの家電でも多用されています。

公衆トイレに利用されるシンボルなども「アイコン」と言ってもよいでしょう。

実装面では、文字に頼らないことから (翻訳の必要性が抑えられることで) 多言語対応が容易になったり、限られたスペースでデザイン (レイアウト) を崩すことなく表現できるという点で、やはり重要です。

ただ、「アイコン」=「分かりやすい」という訳ではありません。むしろ余計に難解になってしまう可能性もあります。

実例 1 : オーブン

[図] オーブンパネル

うちにあるオーブンのフロントパネルは、アイコンを多用しています。それぞれのアイコンがどういう意味を持っているか分かるでしょうか。

実例 2 : 食器洗い機

[図] 食器洗い機パネル

同じくうちにある食器洗い機のフロントパネルです。

中央にある数字付きのアイコンには、それぞれのアイコンの下部に文字も併記されています。もしこの文字がなかったら、それぞれのアイコンがどんな機能を示すか分かるでしょうか。

また、左側にもアイコンが並んでいます。それぞれのアイコンの意味が分かるでしょうか。

実例 3 : お天気アイコン in Yahoo! Weather

[図] Yahoo! Weather ウィジット

こちらはたまたま見かけた Yahoo! Weather という Yahoo!ウィジットのウィンドウです。

中央下部に見えるアイコン、私は (ニュージーランドはちょうど秋口というのもあって)「紅葉の到来」を示すアイコンだとばっかり……。もっとも「紅葉の到来」は「天気」じゃないんですが。

内容によって「アイコン」という形で抽象化しづらい場合もあります。そういう場合は、文字を併記して、アイコンは視覚的アクセントとして利用すると割り切った方がいいのかもしれません。

蛇足ですが、日本語は文字列の長さに対してかなり柔軟な言語という印象を持っています。

例えば、「テンプレート」という言葉に対して、「ひな形」や「雛形」という形で短い単語に置き換えることができるように、長さを調節可能な単語を見つけやすい印象があります。

一方、英語やフランス語などはひとつひとつの単語に対しての柔軟性があまりない印象があって、例えば、ソフトウェアのインタフェースに利用されているテキスト群を翻訳して適用したときに、元のデザインを維持するのは結構「手間」がかかります。

解答編 1 : オーブン

[図] アイコン群 1 ・オーブンパネル

付属マニュアルの早見表より。左から。

  • アラームブザー (Alarm Buzzer)
  • クッキングタイム設定 (Cooking Time)
  • クッキング終了時間設定 (Cooking Finish Time)
  • 手動・自動切り替え (Manual/Automatic Operation)
  • 時刻調整 (Clock Control)

「手」のアイコンは「(動作などを)止める」ようなニュアンスなのかと思いましたが、違いました。

[図] アイコン群 2 ・オーブンパネル

  • 熱循環式オーブン (Circotherm Oven)
  • グリル (Grill)
  • 通常オーブン (Conventional Oven)
解答編 2 : 食器洗い機

[図] アイコン群・食器洗い機パネル

付属マニュアルより。左から。

  • すすぎ準備中 (Pre-rinse)
  • 洗い中 (Wash)
  • すすぎ中 (Rinse)
  • 乾燥中 (Drying)
  • 要柔軟剤 (Slat Warning)

「要柔軟剤」というのは、「すすぎ補助用洗剤を補充する必要があります」という意味のインジケータです。

解答編 3 : お天気アイコン in Yahoo! Weather

[図] Yahoo! Weather ウィジット・アイコン

「紅葉到来」ではなく「強風」という意味でした。季節によってアイコンは変わるのかもしれません。

スポンサーリンク

<< リノベーションは楽じゃない :: 男子厨房に入る >>