この記事の要点（UIXHERO視点） UIXHEROでは、アフォーダンスを「潜んでいる可能性」、シグニファイアを「それを教える合図」と定義し区別する。 多くの現場で使われる「アフォーダンスをつける」は誤用であり、正しくは「シグニファイアを付与する」である。

導入：「このボタン、押せるの？」の正体

「このドア、押すの？引くの？」 「このテキスト、リンクなの？ただの強調なの？」

Webサイトやアプリ、あるいは物理的な世界で、このような迷いを感じたことはないでしょうか。 これは、対象物が持つ「機能（何ができるか）」と、それが「どう見えるか」の間にズレがあるために起こります。

押せないボタンは、ユーザーのせいではない。設計の責任である。

この問題を解く鍵が、アフォーダンス（Affordance）とシグニファイア（Signifier）です。 これらはUXデザインにおいて最も重要かつ、最も混同されている概念ペアです。

アフォーダンスとシグニファイアの違い（定義）

用語データ

アフォーダンスは「行為の可能性」であり、シグニファイアは「その可能性を伝える信号」である。

語源と背景

元々「アフォーダンス」は心理学者ジェームズ・J・ギブソンが提唱した概念ですが、デザイン界の巨匠ドナルド・ノーマンが著書『誰のためのデザイン？』で紹介したことで広まりました。 しかし、ノーマン自身が後に「私が広めたアフォーダンスという言葉は、実はシグニファイアのことだった」と訂正し、この2つを明確に区別するようになりました。

研究からの引用: 「アフォーダンスは存在するものであり、デザインするものではない。デザイナーがデザインするのはシグニファイアである。」（Donald Norman）

なぜ重要なのか（心理的背景）

ユーザーは超能力者ではありません。どんなに素晴らしい機能（アフォーダンス）があっても、それが知覚できなければ（シグニファイアがなければ）、その機能は存在しないのと同じです。 脳の予測処理やヒューリスティック（経験則）を裏切るデザインは、ユーザーに不要な認知的負荷を与えます。

1. 知覚可能なアフォーダンス

この概念が両者の架け橋になります。アフォーダンス（座れる）があり、シグニファイア（座面に見える形状）があるとき、初めてユーザーは「座る」という行動を自然に選択できます。

2. 誤ったシグニファイア（偽のアフォーダンス / False Affordance）

逆に、シグニファイアがあるのにアフォーダンスがない状態（例：押せそうなのに押せないボタン）は、ユーザーにフラストレーションを与えます。

具体例（Before/After）

ケース1：フラットデザインのボタン

• アフォーダンス: プログラム上、その矩形領域はクリック可能である。
• シグニファイア（弱い）: 平坦な色面だけでは、ただの装飾に見えるかもしれない。
• シグニファイア（強い）: 影をつける、角を丸くする、ホバーで色を変えることで「押せる」と伝える。

ケース2：ドアの取っ手（ノーマン・ドア）

• アフォーダンス: ドアは「引く」ことも「押す」ことも物理的には可能かもしれない。
• シグニファイア: 「取っ手（Handle）」が付いていれば「引く」シグニファイア。「平らな板（Plate）」が付いていれば「押す」シグニファイア。
• エラー: 「押す」べきドアに「取っ手」が付いていると、ユーザーは誤って引いてしまう。

UXとしてなぜ区別すべきか

UIXHEROがこの2つを厳密に区別する理由は2つあります。

1. 議論の解像度を上げるため

「アフォーダンスがない」と指摘されたとき、それは「機能がない」のか「見つけられない」のか曖昧になります。「機能はあるがシグニファイアが不足している」と言語化することで、具体的な解決策（デザインの修正）が見えてきます。

2. 隠れたアフォーダンスの活用

スワイプ操作や長押しなど、視覚的な手がかり（シグニファイア）がなくても、学習によって発見されるアフォーダンスもあります（魔法のアフォーダンス）。これを意図的に使い分けるために、両者の違いを理解する必要があります。

改善のための設計原則と対策

具体的な改善策（OK/NG比較）

原則1：機能があるなら「音」を出せ

ここでの「音」は視覚的なシグナルのこと。クリックできるならクリックできそうな見た目に。スクロールできるならスクロールバーや見切れを表示する。沈黙した機能は死んでいるのと同じです。

• NG: クリック可能だが下線も色変化もないテキスト
• OK: ホバーで色が変わり、カーソルが指の形（pointer）になる

原則2：標準に従う（ヤコブの法則）

ユーザーは他のサイトで見た「シグニファイア」のルールを学習しています。青い文字はリンク、ボタンの形はボタン。この既存のルール（メンタルモデル）を利用することが、最も強力なシグニファイアになります。

良い改善例（After）

⭕ 良い例

• メッセージ: フォームの必須項目
• アクション: 必須マーク（*）を付けるだけでなく、「必須」と明記し、未入力時は赤枠で強調する。
• ポイント: 色、テキスト、アイコンの複数のシグニファイアを重ねることで、誰にでも伝わるようにする（アクセシビリティ）。

よくある質問 (FAQ)

Q1. アフォーダンスをデザインすることはできないのですか？

厳密な意味では、アフォーダンスは「関係性」なので、物理的な環境（画面やデバイス）を作った時点で発生します。デザイナーができるのは、そのアフォーダンスを「いかにわかりやすく伝えるか（シグニファイアの設計）」、あるいは「不要なアフォーダンスを隠すか（制約の設計）」です。

Q2. ミニマリズムとシグニファイアは矛盾しませんか？

良い質問です。過剰な装飾を削ぎ落とすミニマリズムは美しいですが、必要なシグニファイアまで削ぎ落とすと「使いにくい」UIになります（質素なUI）。優れたミニマリズムは、余白や配置自体をシグニファイアとして機能させ、少ない要素で多くを語ります。

UX倫理と長期価値

ユーザーに「迷い」を与えることは、ユーザーの脳のエネルギー（認知的負荷）を奪う行為です。 適切なシグニファイアを提供することは、ユーザーのエスコートであり、ホスピタリティです。 「説明しなくてもわかる」状態を目指し、沈黙の中でユーザーを導くことこそ、熟練したデザイナーの仕事です。

まとめ

• アフォーダンス: 何ができるか（Action Possibility）
• シグニファイア: 何ができるかを教えるサイン（Perceptible Signal）
• 使い分け: 機能を作るのがエンジニアリング、それを伝えるのがデザイン（シグニファイア）。