- メニュー項目ごとにアイコンをデフォルトで入れるデザイン慣行が拡大しており、不要な視覚的ノイズを引き起こしている
- Google Sheets と macOS Tahoe バージョンのメニューシステム が代表的な事例で、ほぼすべてのメニュー項目にアイコンが追加されている
- 一部のメニューでは アイコンの有無の基準が不明確 で、トグル表示と重なり整列が乱れる
- 一方、Finder のウィンドウ整列メニューのように 視覚的理解を助けるアイコン は有用で、アイコン使用の文脈的判断が重要
- Apple が過去 自社インターフェースガイドラインで「不要なアイコン使用を避けよ」としていた原則を捨てた点が問題
メニューアイコン乱用への批判
- すべてのメニュー項目にアイコンを付ける方法がデフォルトとして広がり、インターフェースが過度に複雑化する現象が起きている
- Google Sheets の「File」「Edit」「View」メニューのように、すべての項目にアイコンが付く
- このアプローチは「空間を埋めるためのアイコン」を作る習慣につながる
- 各メニューの文脈と 認知的負荷（cognitive load） を考慮しない、単純なテンプレート化にすぎない
- アイコン使用は 文脈に応じて慎重に選択されるべき
- アイコンが実際に使いやすさを高めるのか、それとも混乱を招くのかを判断する必要がある
- 単に「すべてのメニューにアイコンを入れよう」というアプローチは 思考の欠如
macOS Tahoe の変化
- macOS は長らくこの方式から距離を置いていたが、macOS Tahoe でメニュー全般にアイコンが導入 された
- Apple メニュー、Safari の「Safari」「File」「View」メニューなどで一部項目のみアイコンが表示される
- 「Settings」にはアイコンがあるが「Privacy Report」にはないなど、一貫性の欠如が見られる
- Safari の File メニューでは 一部のグループだけアイコンとインデントが適用され、他のグループにはそうでない
- 「View」メニューでは チェック表示（トグル） とアイコンが同時に存在し、整列が崩れる
- Mail アプリの「View」メニューでも、テキスト、トグル、アイコンが混在して複雑な視覚構造を形成
- アイコンの存在理由や選択基準が明確でない
アイコンが有用な例外事例
- Finder の ウィンドウ整列メニュー のように、シンボルで瞬時に空間配置を理解できる場合 はアイコンが大きな効率を提供する
- 「Top Left」「Bottom & Top」「Quarters」などのテキストよりも、視覚的配置アイコン が即時理解を与える
- こうした場合、アイコンは 認知効率を高める有効な使用例 である
- つまり、アイコンは「デフォルト」ではなく 状況に応じた選択 であるべき
Apple のガイドラインとの矛盾
- Apple の 1992・2005・2020 年 Human Interface Guidelines では「任意のアイコンをメニューに使うな」と明記
- 「視覚的な混乱を引き起こし、ユーザーを困惑させる可能性がある」という警告が含まれる
- 当時のガイドラインの「してはならない例」が現在の macOS Tahoe メニューと似通っている
- Apple が 自社の原則を自ら違反 したことになる
結論
- メニューのいたるところに現れる 過剰なアイコン が視覚的ノイズを生む
- Apple が「すべてのメニューにアイコンを入れる」方向へシフトしたことで、アイコン最小化の説得が難しくなった
- 「正当な理由がないなら、デフォルトはアイコンなしであるべき」
- 現在は アイコンがメニューを覆う時代 であり、皮肉を込めて 「助けて」 と表現
3件のコメント
言語に依存しない情報だから良い気もする一方で..
AIが作り出す文章のような感じもして..
むしろ、よく使うアプリケーションほど、テキストよりも図や色を探すようになります。画面サイズによって併記するかアイコンだけにするかは変わるでしょうが、全体としてはあったほうがよいと思います。
Hacker Newsの意見
アクセシビリティとローカライズの観点から見ると、アイコン+テキストの組み合わせが最も理想的
単にスペースを埋めるためのアイコン使用は問題だが、アイコンとテキストが一致しないと、かえって認知負荷が高まる
テキストを隠した実験でも、アイコン+テキストの組み合わせが最も効果的だった
アイコンを一貫して使うことは、視覚優位のユーザーにも言語優位のユーザーにも有利で、ビューポートが狭い環境でも役立つ
結局のところ問題は、「デザイナーにコストをかける意思があるかどうか」だと思う
テキストを読むのが難しいとき、アイコンは大きな助けになる
米国人口の約20%が非識字で、こうした人たちはアイコンやボタンの位置を記憶して技術を使っている
アイコンだけだと意味の把握が難しいが、両方あると脳全体が働く感じがする
メニューにアイコンがある理由は、ツールバーの同じ機能との視覚的マッチングのためだと思う
メニューにアイコンがないと、ツールバーにもないというシグナルとして働く
メニューとツールバーのどちらもカスタマイズ可能で、各項目はアイコン+ラベルで構成されていた
最近はアイコンパック(Font Awesome, Material Icons など) が多すぎて、開発者が「まだ近い」アイコンを選ぶ傾向がある
私たちのチームもたまにカスタムアイコンを作るが、コストが高いため、たいていはGoogleの膨大なライブラリから適当なものを探す程度だ
「アイコンを追加する理由がないなら、デフォルトで入れないようにしよう」という主張については、視覚的記憶が強いユーザーはよく使うメニューのアイコンを記憶して、より速く見つけられると思う
私は個人的にはショートカットを覚えるタイプなので、アイコンよりホットキーの衝突のほうが気になる
昔のGmailではリンクと添付ファイルのアイコンがほとんど同じでよく混乱したが、最近は紙クリップ型に変わってずっと良くなった
例の中でいちばん気になったのは、メニューセクションごとのインデントの不一致だった
ある項目にだけアイコンがあるとその行だけインデントされ、ないとされないのに、チェックマークがあると全体がインデントされるというアンバランスさがある
Appleならこういう部分をもっと洗練して処理してくれると期待していたので残念
以前フォローしていた漫画家がシルエットデザインの重要性を強調していたが、今のアイコンも同じ問題を抱えている
AWSダッシュボードはアイコン同士の区別がつかず、視覚的ノイズばかりがあふれている
一方で、カードゲームのように色と形を両方区別して、色覚異常のユーザーでも認識できるようにしたデザインは素晴らしい
Google Sheetsはこの点でうまくやっているが、ほかの例はそうではない
関連記事, デザインガイドラインの崩壊, アイコンを元に戻す方法 参照
そのせいでmacOSのユーザビリティが大きく下がったと感じる
ブラウザタブが全部同じに見えて、どのタブがどの作業なのか区別できない
Google Docsのアイコンの例は気に入っている
テキストを読まなくても、追加/削除のようなアクション種別をすばやく見つけられる
アイコンでだいたいの位置を探し、テキストで細かい機能を確認する
そのおかげでメニュー探索時間が減り、認知負荷が下がる
おそらく「アイコン改善」チケットがどこかに埋もれているのだろう
Google Docsの例では、「Insert Link」よりリンクアイコンを探すほうがずっと速い
インデントや整列のような機能も、標準化されたアイコンのおかげで簡単に見つけられる
また、非英語圏のユーザーにも役立つ
たとえば日本語が得意でないユーザーでも、アイコンのおかげで目的の機能をより簡単に見つけられる
私はほぼすべてのメニュー項目にアイコンを入れる派だ
その結果、精神的疲労の軽減と素早い選択が可能になった
複雑なメニューほど、色を追加して感覚を多面的に使うのも良いと思う
ただし、アイコンは必ず意味のある形でなければならない
たとえ意味がなくても、同じアイコンセットの「2番目の項目」を見つけるほうが、テキストを読むよりずっと速い
一部の項目にだけアイコンがあると、それらが特別な、あるいはよく使う機能のように見える
すべての項目にアイコンがある場合より、ずっと有用だと感じる
いわば逆ツールチップのように機能する
ただし、特定の項目だけを強調したいなら、アイコンより一貫した視覚的区別や並び順のほうが効果的だと思う
あまり使わない項目は、ゆっくりスキャンしても構わない