Photo by Harpal Singh on Unsplash
UIを実装していくときに、定期的に湧いてくる「このアイコンって、本当にここに必要なものなの？」っていう疑問に対して、自問自答みたいな感じでとりとめもなく纏めていったポエムです。
これが正解という気はさらさらなく、只々取り留めなく考えをまとめたマジでただのポエムです。（大事なことなので2回言いました）
アイコンってそもそもなに？
アイコンというのはなにかを図に起こした図形情報…って自分は理解しています。 わかりやすく例えると、保存の機能を持ったUIには、一昔前であれば「フロッピー」のアイコンが使われていました。
誰がどこで使い出したのかまでわかりませんが、私が人生で初めて貯金を叩いて買ったiMacでMicrosoft OfficeのWordとかExcelを使ったときにはすでにそういう実装になっていました。
インターネット黎明期を通ってきたひとは「プロッピーのアイコン」＝「入力した内容を保存する」って認識するのが一般的だと思います。（最近の若人は「フロッピーって何？」というらしいです……時代の進化よ…というとインターネット老害に片足突っ込んでるかもれない…と思ってしまう鬱の気が活発な私です）
UIにおいては「ユーザーが何かしらの操作をするときに、その操作出来るUIをわかりやすくするための図」がアイコンなんだと思っています。
アイコンの元ネタって、ピクトグラムなんでは
正直ちゃんと調べてないんで根拠はありませんが、上記の「何かしらの情報を図に示した」ものってアイコン以外にはピクトグラムかなと思っています。
ピクトグラムは昔からあるもので、今話題のオリンピックの時期になると、ちょこちょこ新しい競技に合わせてその競技のピクトグラムがデザインされると話題に上がったりします。
最近の競技ピクトグラムは動くんですよ……すごくない？！？！？！１１１
個人的にオリンピックはそこだけ楽しみです。コロナで開催するかどうかがわからなくなってますが。
ピクトグラムは日本では前回のオリンピック開催時に、外国語によるコミュニケーションが難しい当時の日本人と外国人とのコミュニケーションを補助のために開発されたのが始まりのようです。（Wikipedia参照）
今でも空港や鉄道などの公共交通機関などでよく見かけます。最近では海外の宗教事情に配慮した「祈祷室」なる施設のピクトグラムがあります。
「祈祷室」と定義されている設備は、概ね小浄設備のあるムスリム用の礼拝場所です。しかし「祈祷」は「礼拝」と異なる筈でして、あえて前者で呼ぶ事情次第ではピクトグラムの設計にも影響します。正座様のものは海外でも例が多いようですが、逆に日本では座敷（和室）や懲罰房に見えるかもしれません。 pic.twitter.com/Be07zYwYVc
— 株式会社石井マーク (@ishiimark_sign) September 29, 2016
日本語が読めないための海外渡航客のために絵で表すのはユニバーサルデザインと言えるのではないでしょうか。
自分はまだ人生で一度も海外に行ったことないですから、英語はまだしもシンハラ語が公用語のスリランカに行こうものなら、文字が全くわからずトイレ行くのにも大冒険しそうな予感がします。
そういう時に馴染み深いトイレのピクトグラムの表札があれば「やった！トイレや！」ってなって大冒険の大惨事……なんてことにはならなさそうです。
ピクトグラムってすごい。絵ってすごい。
UIにアイコンは必要なのか
結論からいうと、私個人は「必要」と思っています。
日本人の殆どは字の読み書きができて、絵で情報を表現する必要性が出るケースは少ないのでは？と感じる一方で、どうしても文字数の制約上の理由で、文字情報をつけることが出来ないUIっていうのが存在すると思っているからです。
例えばウェアラブルデバイス。AppleWatchが一番わかり易い例だと思いますが、画面の表示領域がかなり制限されています。
そんな限られた画面面積で「電話をかける」とか「チャットを送信」「音楽を再生」なんていう言語ベースのUIが表示されるところを想像してみてください。
「え、めっちゃ使いづらい」 「なんなら音声で全部操作できてほしい」
言語ベースUIに不向きなデバイスが登場したときに活躍するのが、アイコンだと思っています。
紙飛行機マークのアイコンだったら「メッセージを送信」とか、時計マークのアイコンだったら「タイマーをスタート/ストップ」とか。アイコン一つでUIが持つ機能を表現出来るとしたら、非常に有用だと思っています。
なので、アイコンはUIをデザインする上で大事な一要素をになっていると自分は考えます。
アイコンを使うとコンバージョンが上がるというのは幻想かもしれない
ラベル付きのアイコンの場合、ユーザーは88％の時間アイコンをタップするとどうなるかを正しく予測できることがわかりました
ラベルのないアイコンの場合、この数は60％に低下しました。また、アプリに固有のラベルのないアイコンについては、ユーザーがアイコンをタップしたときに34％の時間で何が起こるかを正しく予測していました。
原文が英語なので、なかなか理解が飲み込めてない部分もあると思うんですが、つまり、「アイコンだけのUIより、ラベル付きのアイコンUIの方が正しく理解させる」っていうことなのかな…と読み解いています。
（英語苦手だから間違ってたら誰かおしえてくれ。私が都合のいいように解釈してるかもしれない…。）
裏を返せば、アイコンにラベルを付けたらわかりやすくなる。 でも、もともとラベルだけのUIにアイコンを追加しても、多分わかりやすさは変わらない……って言うことなんじゃないかと思いました。
まぁでも……見た目的に、例えばテキストリンクに注目させたくて何かしらのアイコンを付けたいっていう気持ちが全くわからんかっていわれると……まぁそんなときあるよねぇってなります。
ずらっと並んでいるテキストの画面に、例えば「▶詳しくはこちらのページを御覧ください」って書かれてたら、ちょっと目が引かれますよね。
さらに、テキストリンクだったら「▶詳しくはこちらのページを御覧ください」となっていると、「お、ここのページ見ればわかるんやな！」ってなりますよね。
一定の理解はするものの、無理やりテキストと関連付けようとしてよくわかんないアイコン選ぶこともないのでは……と思うこともよくあります。（UIにもシズル感って必要だと思う）
なので、個人の考え方としては、ポイントとして使うのも有用なときはあるけど、「アイコン付けておけばわかりやすくなる！」という盲信はしたくないなぁと思うのでした。
最後に
こういう記事ってポエムでも「頓珍漢なこと書いてないかな…」なんて日和ったりするので、放流前に読んでくれた友人に感謝です🙏 ありがてぇありがてぇ
追記（2020年6月27日）
この本に、私がアイコンに対して思ってることが書かれてたので、ぜひ読んでほしい……
インタフェースデザインのお約束 ―優れたUXを実現するための101のルール
- 作者:Will Grant
- 発売日: 2019/11/09
- メディア: 単行本（ソフトカバー）
