ux-psychology
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseUX Psychology
UX Psychology
UI設計に心理学効果を適用するためのスキル。
A skill for applying psychological effects to UI design.
適用パターン
Application Patterns
ランディングページ
Landing Page
| セクション | 適用効果 | 実装例 |
|---|---|---|
| ヒーロー | フレーミング効果 | ポジティブなアウトカムを強調 |
| 社会的証明 | 権威バイアス | 著名な顧客ロゴ、メディア掲載 |
| CTA | 損失回避 | 「チャンスを逃さないでください」 |
| 価格表 | アンカー効果 | 高価格プランを最初に表示 |
| Section | Applied Effect | Implementation Example |
|---|---|---|
| Hero | Framing Effect | Emphasize positive outcomes |
| Social Proof | Authority Bias | Display well-known customer logos, media features |
| CTA | Loss Aversion | "Don't miss this opportunity" |
| Pricing Table | Anchoring Effect | Display the high-priced plan first |
オンボーディング
Onboarding
| ステップ | 効果 | 実装例 |
|---|---|---|
| 初回 | 段階的開示 | 1画面1コンセプト |
| 進行中 | 目標勾配効果 | プログレスバー表示 |
| 完了 | ピーク・エンドの法則 | 祝福アニメーション |
| Step | Effect | Implementation Example |
|---|---|---|
| First Launch | Progressive Disclosure | One concept per screen |
| In-Progress | Goal Gradient Effect | Display progress bar |
| Completion | Peak-End Rule | Celebration animation |
価格表
Pricing Table
| 効果 | 実装 |
|---|---|
| アンカー効果 | Pro（高価格）を最初に表示 |
| おとり効果 | 中間プランを最も魅力的に |
| 社会的証明 | 「最も人気」バッジ |
| 損失回避 | 「年払いで2ヶ月分お得」 |
| Effect | Implementation |
|---|---|
| Anchoring Effect | Display Pro (high-priced) plan first |
| Decoy Effect | Make the middle plan the most attractive |
| Social Proof | "Most Popular" badge |
| Loss Aversion | "Save 2 months with annual billing" |
主要な心理学効果
Key Psychological Effects
認知負荷に関する効果
Effects Related to Cognitive Load
ヒックの法則
選択肢が増えると意思決定時間が増加する。
→ 選択肢を3-5個に限定
認知負荷理論
人間のワーキングメモリには限界がある。
→ 1画面1アクション、チャンク分け
ミラーの法則
7±2個が記憶容量の限界。
→ メニュー項目、ステップ数を制限
Hick's Law
Increasing the number of options increases decision-making time.
→ Limit options to 3-5
Cognitive Load Theory
Human working memory has limits.
→ One action per screen, chunk information
Miller's Law
7±2 is the limit of memory capacity.
→ Limit menu items and number of steps
行動促進に関する効果
Effects Related to Behavior Promotion
目標勾配効果
ゴールに近づくほどモチベーションが上がる。
→ プログレスバー、「あと○ステップ」
ツァイガルニク効果
未完了のタスクは記憶に残りやすい。
→ 「○%完了」の表示
段階的コミットメント
小さなコミットメントから始めると大きなコミットメントに繋がる。
→ マイクロコンバージョン
Goal Gradient Effect
Motivation increases as you approach the goal.
→ Progress bar, "Only X steps left"
Zeigarnik Effect
Uncompleted tasks are more likely to be remembered.
→ Display "X% completed"
Gradual Commitment
Starting with small commitments leads to larger ones.
→ Micro-conversions
信頼構築に関する効果
Effects Related to Trust Building
社会的証明
他者の行動を参考にする傾向。
→ 利用者数、レビュー、ロゴ
権威バイアス
専門家の意見を信頼する傾向。
→ メディア掲載、資格、受賞歴
単純接触効果
繰り返し見るものに好意を持つ。
→ 一貫したブランディング
Social Proof
Tendency to reference others' behaviors.
→ Number of users, reviews, logos
Authority Bias
Tendency to trust experts' opinions.
→ Media features, qualifications, awards
Mere Exposure Effect
Tendency to develop a preference for things seen repeatedly.
→ Consistent branding
意思決定に関する効果
Effects Related to Decision-Making
フレーミング効果
同じ情報でも提示方法で印象が変わる。
→ 「90%成功」vs「10%失敗」
アンカー効果
最初に見た数字が基準になる。
→ 高価格プランを先に表示
損失回避
利得より損失を重く感じる。
→ 「逃さないでください」
現状維持バイアス
変化を避ける傾向。
→ デフォルト設定を推奨オプションに
Framing Effect
The same information can create different impressions depending on presentation.
→ "90% success" vs "10% failure"
Anchoring Effect
The first number seen becomes the reference point.
→ Display high-priced plans first
Loss Aversion
Losses are felt more strongly than gains.
→ "Don't miss out"
Status Quo Bias
Tendency to avoid change.
→ Set recommended options as default
ダークパターン禁止
Dark Patterns Prohibited
以下は絶対に避ける:
- 偽の希少性（「残り3枠」等の嘘）
- 強制的継続課金の隠蔽
- 意図的な混乱（紛らわしいボタン）
- 過度な通知
- 罪悪感を煽るコピー
- 退会の複雑化
Absolutely avoid the following:
- False scarcity (e.g., lies like "Only 3 spots left")
- Concealment of mandatory recurring charges
- Intentional confusion (misleading buttons)
- Excessive notifications
- Copy that incites guilt
- Complicated cancellation processes
適用チェックリスト
Application Checklist
- 認知負荷を最小化（1画面1アクション）
- 美的ユーザビリティ効果を意識
- 社会的証明を適切に配置
- CTAに損失回避を適用
- プログレス表示で目標勾配効果
- ダークパターン排除を確認
- Minimize cognitive load (one action per screen)
- Be aware of the aesthetic-usability effect
- Properly place social proof elements
- Apply loss aversion to CTAs
- Use progress displays to leverage the goal gradient effect
- Confirm elimination of dark patterns
関連スキル
Related Skills
- ui-ux-pro-max: 視覚的実装
- lp-optimizer: ページ最適化
- marketing-psychology: マーケティング視点の心理学
- copywriting: コピーへの心理学適用
- ui-ux-pro-max: Visual implementation
- lp-optimizer: Page optimization
- marketing-psychology: Psychology from a marketing perspective
- copywriting: Applying psychology to copy