Glossary

border

アフォーダンス

アフォーダンスとは

アフォーダンスとは、物や環境、画面がユーザーに対して示す**「行動の可能性」**のことです。

UIデザインでは、画面上の要素がユーザーに「押せそう」「入力できそう」「選べそう」「動かせそう」と感じさせる性質を指して使われることが多くあります。

たとえば、立体的に見えるボタンを見ると、多くの人は「押せるものだ」と感じます。
入力欄のような枠を見ると、「ここに文字を入力できる」と理解します。

このように、ユーザーが画面を見たときに自然に操作の可能性を感じ取れることが、UIにおけるアフォーダンスの考え方です。


UIデザインにおけるアフォーダンスの例

UIデザインでは、さまざまな要素がアフォーダンスを生み出します。

UI要素 ユーザーが感じること
ボタン 押せそう
入力欄 文字を入力できそう
チェックボックス 選択できそう
スライダー 左右に動かせそう
カード タップして詳細を見られそう
下線付きテキスト リンクとして開けそう
つまみのあるUI ドラッグできそう

アフォーダンスが適切に働いているUIでは、ユーザーは説明を読まなくても、ある程度自然に操作を理解できます。

一方で、押せるように見えないボタンや、押せないのに押せそうに見える装飾は、ユーザーの混乱を招きます。


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

アフォーダンスとシグニファイアは、UIデザインでセットで考えたい概念です。

アフォーダンスは、画面や要素が持つ行動の可能性です。
シグニファイアは、その行動の可能性をユーザーに伝える手がかりです。

たとえば、ボタンには「押せる」というアフォーダンスがあります。
しかし、そのボタンが単なる文字のように見えていたら、ユーザーは押せると気づけないかもしれません。

そこで、角丸の形、色、ラベル、影、余白などによって、押せることを伝えます。
この伝える要素がシグニファイアです。

つまり、アフォーダンスは「できること」、シグニファイアは「できることを伝えるもの」と整理できます。


アフォーダンスが弱いUIの問題

アフォーダンスが弱いUIでは、ユーザーは次のような迷いを感じます。

  • どこを押せばよいかわからない
  • どの要素が操作できるのかわからない
  • 入力欄なのか表示項目なのかわからない
  • 重要なボタンに気づけない
  • 押してよいのか不安になる
  • 操作した結果が予測できない

こうした迷いは、ユーザーの認知負荷を高めます。

特に、初めて使うサービスや、緊張する場面で利用するアプリでは、アフォーダンスが弱いだけで離脱や誤操作につながることがあります。


医療ヘルスケア領域でアフォーダンスが重要な理由

医療ヘルスケア領域のUIでは、ユーザーが安心して操作できることが非常に重要です。

患者向けアプリやPHRアプリ、薬局・医療機関向けシステムでは、操作の対象が健康情報、服薬情報、検査結果、予約、相談、家族情報など、生活や医療に深く関わる情報になることがあります。

そのため、ユーザーは「間違えて押したらどうなるのか」「この情報を送信してよいのか」「あとから変更できるのか」と不安を感じやすくなります。

アフォーダンスが適切に設計されていると、ユーザーは画面を見たときに次の行動を理解しやすくなります。

たとえば、次のような設計が考えられます。

  • 主要な操作ボタンを明確に表示する
  • 取消や戻る操作をわかりやすくする
  • 入力欄と表示項目の見た目を分ける
  • 重要な送信操作では確認画面を設ける
  • 操作できない状態のボタンは非活性として見せる
  • カードや一覧はタップできる範囲をわかりやすくする

医療ヘルスケア領域では、単に「押せそう」に見せるだけでなく、「安心して押せる」状態を設計することが求められます。


アフォーダンス設計で注意すべきこと

アフォーダンスを高めるために、すべての要素を目立たせればよいわけではありません。

画面内に押せそうな要素が多すぎると、ユーザーはどれを選べばよいのかわからなくなります。
また、装飾として使った影や色が、操作可能な要素のように見えてしまうこともあります。

アフォーダンス設計では、次の点に注意が必要です。

  • 操作できる要素と操作できない要素を明確に分ける
  • 主要な操作と補助的な操作の優先順位をつける
  • 見た目だけでなく、文言でも操作内容を補足する
  • アイコンだけに頼らず、必要に応じてラベルをつける
  • 色や影を使いすぎない
  • ユーザーが不安になる操作では確認や説明を入れる

アフォーダンスは、ユーザーの行動を自然に導くための考え方です。
そのためには、画面単位ではなく、サービス全体の流れの中で設計することが大切です。


まとめ

アフォーダンスとは、物や画面がユーザーに対して示す「行動の可能性」です。

UIデザインでは、ボタン、入力欄、カード、リンク、スライダーなどが、ユーザーに「押せそう」「入力できそう」「選べそう」と感じさせることが重要です。

一方で、アフォーダンスだけでは十分ではありません。
ユーザーにその意味を正しく伝えるためには、ラベル、色、形、影、余白などのシグニファイアも必要です。

特に医療ヘルスケア領域では、ユーザーが不安を抱えながら操作する場面もあります。
そのため、アフォーダンスは単なる見た目の問題ではなく、安心して行動できる体験を支える重要なUI設計の考え方です。


アフォーダンスは、ユーザーが「押せそう」「入力できそう」「選べそう」と自然に理解できるUIを設計するうえで重要な考え方です。
医療ヘルスケア領域のUI/UXデザインでは、操作のしやすさだけでなく、患者さんや生活者が不安なく次の行動に進める体験設計が求められます。

関連する解説

医療ヘルスケア領域におけるUI/UXデザインの考え方については、以下のページでも詳しく紹介しています。

医療ヘルスケア領域のUI/UXデザイン

UI/UXデザインのご相談

メディエイドでは、医療ヘルスケア領域のアプリやWebサービスにおいて、ユーザーが迷わず安心して操作できるUI設計を支援しています。
患者向けアプリ、PHRアプリ、医療従事者向けシステムなどのUI/UX改善や新規サービス設計については、以下よりご相談ください。

医療ヘルスケア領域のUI/UXデザイン支援コンサル

Recruit

一緒に働きませんか?

メディエイドでは、
医療ヘルスケア社会基盤を一緒に創出していく仲間を探しています。
医療ヘルスケア・プラットフォームを、
そして様々なサービスを一緒に創っていきましょう!

人材採用について

Hi, Nyansuke!

CHECK OUR PROFILE