01

視覚的階層

VISUAL HIERARCHY
注意・知覚

人は大きさ・濃さ・余白の差を「重要度の差」として読む。差がなければ、何も伝わっていないのと同じ。

✕全部が同じ強さ
プロプラン
月額 4,800円
チーム無制限/サポート付き
いますぐ申し込む
○3段階の差をつける
プロプラン
¥4,800/月
チーム無制限/サポート付き
いますぐ申し込む
解説を見る
効く点
価格だけを2.5倍の級数に。1画面に「主・従・補足」の3層だけを作ると迷いが消える。
使う
LPのファーストビュー、料金表、ダッシュボードの主要指標。
注意
強調を4つ以上作ると階層が壊れ、結局どれも目立たなくなる。
02

フォン・レストルフ効果

VON RESTORFF EFFECT
注意・知覚

似たものが並ぶ中で1つだけ異質なものは、記憶にも選択にも残りやすい。

プランを選択年払いで2ヶ月無料
Free
¥0
1人
おすすめ
¥4,800
無制限
Biz
¥12,000
SSO付
解説を見る
効く点
中央だけ枠色・ラベル・影を変える。「違う」という信号は、文字での説得より速く届く。
使う
料金プラン、設定の推奨値、一覧内の新着・限定表示。
注意
異質さは1画面に1つ。2つ以上あると「どちらも普通」に戻る。
03

近接の法則

LAW OF PROXIMITY
注意・知覚

近くにあるものは同じ仲間だと認識される。線や色を足す前に、まず余白で意味を作る。

✕間隔が均等
姓
山田
名
太郎
○ラベルを入力欄に寄せる
姓
山田
名
太郎
解説を見る
効く点
ラベルと入力欄の距離を4px、次の項目までを16pxに。罫線を1本も足さずに、余白だけでグループが成立する。
使う
フォーム、設定画面、カード内の情報整理。
注意
ラベルが上下どちらの欄のものか曖昧な余白は、入力ミスの直接原因になる。
04

バナー・ブラインドネス

BANNER BLINDNESS
注意・知覚

人は「広告の形」をしたものを無意識に視界から外す。派手にするほど無視される。

✕広告の見た目
PR
▶ 無料体験はこちら
○本文と同じ書式で置く
この続きは実務チェックリストで
記事内で紹介した手順をPDFにまとめました
解説を見る
効く点
本文と同じ書体・幅・行間にして「読み物の続き」として提示する。囲み枠と“PR感”を外すのが要点。
使う
記事内の資料誘導、アプリ内のお知らせ、機能紹介。
注意
広告や宣伝であることを隠すのは別問題。表示義務と誠実さは必ず守る。
05

美的ユーザビリティ効果

AESTHETIC-USABILITY EFFECT
注意・知覚

見た目が整っているUIは、実際より使いやすいと感じられ、小さな不具合も許されやすい。

✕機能は同じ/整っていない
送金する
10000
OK
※手数料かかります
○同じ機能を整えた
送金額
¥10,000
手数料¥110
送金を確認する
解説を見る
効く点
情報量は同じ。余白・整列・書体の統一だけで、同じ処理が「安全そう」に見える。
使う
初回接触画面、決済・金融など信頼が要る操作。
注意
美しさは本質的な使いにくさを隠してしまう。ユーザーテストの結果を美観で上書きしない。
06

ヒックの法則

HICK'S LAW
操作・認知負荷

選択肢が増えるほど決定にかかる時間は対数的に伸びる。速さは、減らすことでしか買えない。

✕11項目を並列
ダッシュボード
レポート
分析
顧客
商品
在庫
請求
連携
権限
ログ
設定
○4+その他に畳む
ダッシュボード
顧客
商品
請求
その他 ▸ 7項目
解説を見る
効く点
使用頻度上位4つだけを一次階層に残す。削除ではなく「畳む」ので機能は失われない。
使う
グローバルナビ、初回設定、絞り込みフィルタ。
注意
階層を深くしすぎると総所要時間は逆に増える。1階層下げる価値があるか検証する。
07

フィッツの法則

FITTS'S LAW
操作・認知負荷

目標に到達する時間は距離が遠いほど・面積が小さいほど長くなる。主要動作は大きく、近くに。

✕右上に小さく配置
9:41保存
↑ 親指が届かない
○親指圏に大きく配置
9:41▲
保存する
解説を見る
効く点
画面下部の親指到達圏(斜線部)に、高さ44px以上の主ボタンを置く。画面端はカーソルが止まるので実質無限大の面積になる。
使う
モバイルの主CTA、頻繁に押すツールバー、右クリックメニュー。
注意
削除など不可逆な操作は、あえて近く・大きくしない(→ 12 意図的な壁)。
08

認知負荷

COGNITIVE LOAD
操作・認知負荷

同時に処理できる情報量には上限がある。越えた瞬間に離脱が起きる。

✕登録に9項目
メールアドレス
パスワード
パスワード(確認)
氏名
フリガナ
電話番号
郵便番号
住所
生年月日
○いま必要な2項目だけ
メールアドレス
パスワード
無料で始める
住所などは利用開始後に入力できます
解説を見る
効く点
「今この瞬間の目的に不要な項目」を後工程へ移す。項目数そのものが心理的コストになっている。
使う
会員登録、問い合わせ、初回オンボーディング。
注意
減らしすぎて後工程に負担が集中していないか、全体の完了率で測る。
09

ミラーの法則

MILLER'S LAW
操作・認知負荷

短期記憶に保てるのは4±1のかたまり。長い情報は意味の単位で区切る。

✕16桁を連続表示
カード番号
4539148803436467
確認しづらく、打ち間違いに気づけない
○4桁ごとに区切る
カード番号
4539 1488 0343 6467
4つのかたまりとして一度に把握できる
解説を見る
効く点
入力欄側で自動的に空白を挿入する。ユーザーに区切りを覚えさせず、UIが代わりにチャンク化する。
使う
カード番号、電話番号、認証コード、長いID表示。
注意
「メニューは7個まで」は誤用。個数の根拠にはヒックの法則を使う。
10

段階的開示

PROGRESSIVE DISCLOSURE
操作・認知負荷

まず大多数が使う機能だけを見せ、必要な人にだけ奥を開かせる。

公開設定
公開範囲全員に公開 ▾
コメント許可する ▾
▸ 詳細設定(SEO・カスタムURL・埋め込み許可・API)7項目
公開する
解説を見る
効く点
上級者向け7項目を1行に畳む。存在は見せて到達可能にしつつ、初期状態の判断量は3つに保つ。
使う
設定画面、投稿フォーム、絞り込み条件、上級者向け機能。
注意
畳んだ中に必須項目を入れない。入力漏れの温床になる。
11

ドハティの閾値

DOHERTY THRESHOLD
操作・認知負荷

応答が400ミリ秒を超えると集中が切れる。速くできないなら「進んでいる形」を先に返す。

✕白画面+回転アイコン
読み込み中…
○即座に骨格を表示
解説を見る
効く点
最終レイアウトと同じ形のスケルトンを0.1秒以内に描画。待ち時間は同じでも、体感待ち時間は約半分になる。
使う
一覧の初回読み込み、検索結果、画像の多い画面。
注意
1秒未満で終わる処理にスケルトンを出すと、逆に遅く見えてちらつく。
12

意図的な壁

INTENTIONAL FRICTION
操作・認知負荷

取り返しのつかない操作にはあえて手間を足す。摩擦は常に悪ではない。

✕1タップで消える
プロジェクトA
メンバー12人・ファイル340件
削除
○名前の入力を求める
この操作は取り消せません
確認のため プロジェクトA と入力
プロジェクトA
戻る
削除する
解説を見る
効く点
「はい/いいえ」ではなく対象名の手入力を要求。惰性で押せない設計にすることが目的。
使う
削除、退会、送金、公開、権限変更。
注意
解約だけを極端に難しくするのはダークパターン。摩擦は「誤操作防止」に限る。
13

ヤコブの法則

JAKOB'S LAW
記憶・期待

ユーザーは他のサイトで過ごした時間のほうが長い。だから、そこでの慣習どおりに動くことを期待する。

✕独自配置
shop.example
🛒 3SHOP
検索ログイン
○慣習どおり
shop.example
SHOP🔍  👤  🛒 3
新着セール
解説を見る
効く点
ロゴは左上、カートは右上。この一致だけで「探す」という作業がゼロになる。
使う
EC、ログイン導線、フォーム、アイコンの意味。
注意
独自性はレイアウトの位置ではなく、内容・言葉・ビジュアルで出す。
14

系列位置効果

SERIAL POSITION EFFECT
記憶・期待

並んだ項目のうち最初と最後が最も記憶に残り、中央は忘れられる。

ホーム 機能事例会社概要 無料で試す
↑ 各位置の想起されやすさ
解説を見る
効く点
両端という“記憶の一等地”に、ホームと主要CTAを配置。埋もれてよい項目だけを中央に置く。
使う
グローバルナビ、モバイルのタブバー、機能一覧の並び順。
注意
重要項目を全部端に寄せると端が渋滞する。端は2つしかないと考える。
15

ピーク・エンドの法則

PEAK-END RULE
記憶・期待

体験の評価は感情が最も動いた瞬間と、終わり方でほぼ決まる。平均値ではない。

✕そっけない終わり
注文番号 #82013
完了しました。
○山と締めを作る
🎉
ご注文ありがとうございます
明日 10:00〜12:00 にお届けします
配送状況はこの画面から追えます
追跡する
解説を見る
効く点
完了画面に「安心(到着時刻)+次の行動」を置く。ここが体験全体の記憶を代表する。
使う
購入完了、初回セットアップ完了、解約・エラーからの復帰。
注意
「エンド」は良い場面だけではない。エラー画面こそ記憶に残るので同じ密度で設計する。
16

ツァイガルニク効果

ZEIGARNIK EFFECT
記憶・期待

片づけ終えていない作業だけが頭に居座り続ける。済んだ作業は、きれいに忘れる。

プロフィールの完成度60%
✓氏名を登録
✓写真を追加
✓職種を選択
○スキルを3つ追加 (+20%)
○自己紹介を書く (+20%)
解説を見る
効く点
「あと何をすれば埋まるか」を残り2件だけ明示。空白のバーが心理的な引っかかりとして残り続ける。
使う
プロフィール入力、学習コース、初期設定チェックリスト。
注意
永遠に100%にならない設計は不快感に変わる。到達可能な満点を必ず用意する。
17

労働の錯覚

LABOR ILLUSION
記憶・期待

裏側の仕事を見せたほうが、結果の価値が高く感じられる。速すぎる回答は雑に見える。

✕何をしているか不明
検索中…
○工程を実況する
✓1,204軒のホテルを検索
✓空室状況を確認
◍38サイトの価格を比較中…
解説を見る
効く点
件数という具体的な数字で作業量を可視化。同じ待ち時間でも「調べてもらった」という納得が残る。
使う
比較検索、AI生成、審査・与信、レコメンド生成。
注意
実際にはしていない処理を演出するのは虚偽。表示する工程は必ず実在させる。
18

アンカー効果

ANCHORING EFFECT
判断・バイアス

最初に見た数字がその後の判断の基準になる。高い/安いは常に相対評価。

✕価格だけを提示
ワイヤレスイヤホン
¥12,800
カートに入れる
○基準値を先に見せる
ワイヤレスイヤホン
通常価格 ¥19,800
¥12,800 35%OFF
カートに入れる
解説を見る
効く点
参照価格を先に読ませてから実売価格を出す。同じ12,800円が「7,000円の得」に変わる。
使う
料金表、割引訴求、寄付額の選択肢、見積の松竹梅。
注意
実売実績のない「通常価格」表示は二重価格表示として景表法上の問題になる。
19

おとり効果

DECOY EFFECT
判断・バイアス

明らかに不利な第3の選択肢を置くと、狙った選択肢が「お得」に見える。

定期購読プラン
Web版
¥600
/月
紙版のみ
¥1,200
/月
← おとり
紙+Web
¥1,200
/月
同額で両方
解説を見る
効く点
中央の「紙のみ ¥1,200」は誰も選ばない。だが右の同額プランを圧倒的に有利に見せるためだけに存在する。
使う
3プラン構成、オプション販売、容量・数量の選択。
注意
本当に価値のない選択肢で埋めると不信を生む。おとりにも成立する理屈を持たせる。
20

デフォルト効果

DEFAULT BIAS
判断・バイアス

人は初期値をそのまま受け入れる。何を初期値にするかは、最も強い設計判断。

お届け方法を選択
◉まとめて配送
1回で届く/梱包資材60%削減
無料
○できるだけ早く分割配送
最大3便に分かれます
無料
解説を見る
効く点
推奨したい選択肢を初期選択済みにする。変更は1タップで可能なので、選択の自由は損なわれない。
使う
配送方法、通知設定、プライバシー設定、支払い方法。
注意
有料オプションや広告メールを初期ONにするのはダークパターン。初期値は「ユーザーの利益」で選ぶ。
21

損失回避

LOSS AVERSION
判断・バイアス

得る喜びより失う痛みのほうが約2倍強い。同じ事実でも「失う」側から書くと動く。

✕得られるものを説明
解約手続き
続けると、無制限ストレージと共有機能が使えます。
解約する
○失うものを具体化
解約すると次が削除されます
保存中のファイル1,842件
共有中のリンク37件
チームの履歴2年分
解約する
続ける
解説を見る
効く点
抽象的な機能名ではなく、自分が積み上げた実データの件数を見せる。損失が自分ごとになる。
使う
解約引き止め、カート放棄防止、無料期間の終了通知。
注意
恐怖を煽る表現や、解約導線を隠す使い方は逆効果かつ不誠実。
22

フレーミング効果

FRAMING EFFECT
判断・バイアス

同じ事実でも言い方を変えるだけで受け取り方が逆になる。

✕失敗側から書く
5%
が手数料として引かれます
売上 ¥100,000 のとき
−¥5,000
○取り分から書く
95%
があなたの取り分です
売上 ¥100,000 のとき
受取 ¥95,000
解説を見る
効く点
数字も条件も完全に同一。主語を「引かれる額」から「受け取る額」に変えただけ。
使う
料金説明、成功率の提示、エラー文言、通知の文面。
注意
不利な条件を隠す言い換えは虚偽表示。両方の数字に到達できる形を保つ。
23

希少性

SCARCITY
判断・バイアス

手に入りにくいものほど価値が高く見え、判断が早くなる。

10/24(金)19:00 の回スタジオA
予約済み 5席 空席 残り 3席
この回を予約する
解説を見る
効く点
数字だけでなく座席図で埋まり具合を見せる。「残り3」の根拠が図として同時に伝わる。
使う
予約、在庫表示、期間限定オファー、先着特典。
注意
在庫や締切の偽装は最も信用を失う。実在庫と必ず連動させる。
24

決断疲れ

DECISION FATIGUE
判断・バイアス

判断を重ねるほど質が落ち、最後は「選ばない」を選ぶ。

✕24種を一覧表示
…あと8種類
○用途別に3つ提案
日報を書く使う
議事録をまとめる使う
企画書の骨子使う
すべてのテンプレート(24)を見る
解説を見る
効く点
「選ぶ」を「目的を答える」に置き換える。全件へのアクセスは残しつつ、初期提示は3つに抑える。
使う
テンプレート選択、商品一覧、設定ウィザード、プラン選択。
注意
推薦ロジックが的外れだと「選ばせてくれない」不満に変わる。根拠を一言添える。
25

目標勾配効果

GOAL-GRADIENT EFFECT
動機・習慣

ゴールが近づくほど行動が加速する。だから、スタート地点を前倒しして見せる。

✕0/8 から始まる
あと8回で1杯無料
0 / 8
○2個押した状態で配る
あと8回で1杯無料
★
★
✓
✓
✓
5 / 10 (★は入会特典)
解説を見る
効く点
必要回数は同じ8回。それでも「もう半分終わっている」状態から始めると継続率が上がる。
使う
ポイントカード、オンボーディング進捗、学習コース。
注意
ゴール直後にモチベーションが急落する。次の目標を即時に提示する。
26

変動型報酬

VARIABLE REWARD
動機・習慣

報酬がいつ・どれだけ来るか分からないとき、行動は最も強く反復される。

✕毎回同じ報酬
ログインボーナス
10 pt
毎日 10pt(固定)
→ 3日で飽きる
○期待値は同じで幅を持たせる
今日のボーナス
50 pt
51050100
1〜100pt のいずれか
解説を見る
効く点
結果を一拍おいて開示する演出。「次は何が出るか」という予測不能性が再訪の理由になる。
使う
ログインボーナス、フィード更新、レコメンドの発見体験。
注意
依存を意図した設計は倫理的に問題がある。射幸性・年齢・上限を必ず検討する。
27

サンクコスト効果

SUNK COST EFFECT
動機・習慣

すでに払った時間や労力があると、やめるほうが損に感じる。

UXリサーチ入門全18本
13本 視聴済み・累計 4時間20分 あと5本
▶ 第14回 インタビュー設計18:40
続きから再生
解説を見る
効く点
「累計4時間20分」という投下時間を明示。残り本数より、積み上げの大きさが継続を後押しする。
使う
学習サービス、長いフォームの途中復帰、下書きの保存表示。
注意
ユーザーに不利な継続を強いる使い方は搾取。「やめる自由」を常に同じ画面に置く。
28

社会的証明

SOCIAL PROOF
信頼・社会性

判断に迷ったとき、人は他人の行動を正解の代わりにする。

✕自称の訴求
業界No.1の使いやすさ
高機能・低価格・充実サポート
申し込む
○他者の実績を見せる
★★★★★4.8/ 1,204件
「移行が半日で終わった」— 制作会社 42名
導入 3,800社継続率 96%
この24時間で18社が登録
解説を見る
効く点
「多い」ではなく件数・比率・直近の動きという検証可能な数字を出す。似た属性の他者ほど効く。
使う
LP、商品詳細、料金ページ、申込直前の後押し。
注意
件数が少ない段階での水増しは致命傷。実数が弱いときは具体的な1件の声で代替する。
29

ハロー効果

HALO EFFECT
信頼・社会性

1つの目立つ長所が、関係ない部分の評価まで引き上げる。

佐藤 玲奈 / UIデザイナー
🏆 Good Design 2024 認証済
受賞歴を先頭に置くと、以降のポートフォリオ・価格・返信の速さまで「きっと良い」と評価されやすくなる。
解説を見る
効く点
最初に目に入る位置へ最強の実績を1つだけ置く。並べすぎると、どれも印象に残らない。
使う
プロフィール、企業サイトの冒頭、商品の受賞バッジ。
注意
逆ハロー効果もある。1つの雑な要素が全体の信頼を落とす(誤字・崩れた表示など)。
30

授かり効果

ENDOWMENT EFFECT
信頼・社会性

いったん自分のものだと感じた途端、その価値は跳ね上がり、手放したくなくなる。

✕他人事の案内
Proプランのご案内
機能一覧はこちらからご確認ください。
プランを見る
○先に持たせる
あなたのProプラン残り9日
作成したレポート12件
招待したメンバー4人
このまま使い続ける
解説を見る
効く点
体験期間中に「あなたの」と呼び、自分で作った成果物を蓄積させる。所有感は説明ではなく利用実績で生まれる。
使う
無料トライアル、カスタマイズ機能、マイリスト、下書き保存。
注意
体験終了時にデータを人質にしない。エクスポート手段を用意するのが誠実な設計。
該当する法則が見つかりません 検索語を変えるか、カテゴリを「すべて」に戻してください。
UIデザイン心理学辞典 — 全30項目 / 6カテゴリ 掲載する法則は一般に知られたUX心理学の知見に基づき、定義文・UI例はすべて独自に作成しています。 掲載画面はすべて解説用に作成した架空のモックアップです。企業名・数値は実在しません。