UX心理学技能
为网页设计决策提供行为心理学建议层。在页面和组件设计过程中，触发相关的心理学原理。这是一个加权输入——它为决策提供信息，但不凌驾于审美判断、品牌形象或创意方向之上。
使用时机
在构建或设计页面、组件、流程之后调用。此技能最适合作为审查层——先构建，再运行心理学镜头来找出可能遗漏的地方：
- 落地页、定价页、引导流程
- 订阅/转化漏斗
- 仪表盘布局与数据展示
- 导航与信息架构
- 电商产品页面与结账流程
- 任何你希望用户执行特定操作的页面
决策流程
激活后，按以下顺序操作：
- 识别页面类型——落地页、定价页、引导页、仪表盘、结账页等。
- 提取3-5条最相关的原理，依据下方页面类型处方。
- 对每条原理说明： 它是什么 → 如何应用于这个特定页面 → 反模式长什么样。
- 权衡约束——品牌形象、可访问性和技术要求始终优先。
- 推荐具体、可实施的变更——而非抽象建议。指出在标记、布局或文案中需要修改的地方。如果可能，直接指向代码行。
如何加权
心理学原理是众多输入之一。加权层级如下：
- 品牌形象与创意愿景（最高——网站必须看起来和感觉正确）
- 可访问性与可用性（不可妥协——WCAG合规、触摸目标、对比度）
- 技术质量（性能、SEO、响应式设计）
- 心理学原理（本技能——微妙影响，而非强行操纵）
绝不能为了心理学技巧而牺牲美感或用户信任。如果某个原理与优秀设计冲突，优秀设计胜出。
本技能不是
- 不是黑暗模式手册——此处所有原理仅限道德应用
- 不是完整的设计系统——它对现有设计技能起辅助作用
- 不是用户研究的替代品——真实用户数据永远优于理论
- 不是僵化的检查清单——使用适合的原理，忽略不适用的
页面类型处方（内联）
每种页面类型最适用的原理，独立呈现以便快速参考。详细信息请参阅 knowledge/page-prescriptions.md。
首页 / 落地页
| 原理 | 应用 |
|---|---|
| 第一印象 | Hero区域在3秒内传递价值。50ms内形成——没有第二次机会。 |
| 锚定效应 | 以最强指标或声明开场。看到的第一个数字设定参考点。 |
| 社会认同 | 尽早展示真实数字（用户数、成果、业绩记录）。模糊声明无法转化。 |
| 信息线索 | 清晰的导航——用户确切知道下一步去哪里。 |
| 审美-可用性 | 视觉打磨在内容之前赢得信任。美观让人觉得好用。 |
定价 / 订阅
| 原理 | 应用 |
|---|---|
| 锚定效应 | 先展示优质套餐或使其在视觉上最突出。其他所有套餐都显得划算。 |
| 损失厌恶 | 围绕免费用户错过了什么来构建信息，而不仅仅是付费用户得到了什么。失去的痛苦是得到的两倍。 |
| 默认效应 | 预选推荐套餐。大多数用户从不改变默认选项。 |
| 承诺/一致性 | 已经使用过免费功能的用户更倾向于订阅——每一步都通向下一步。 |
引导 / 注册
| 原理 | 应用 |
|---|---|
| 渐进式承诺 | 先免费小操作，再账号，最后付款。 |
| 认知负荷 | 每屏一个问题优于长表单。移除所有非必要内容。 |
| 蔡格尼克效应 | 展示进度（第2步/共4步）。未完成的任务会让人惦记——用户会回来完成。 |
| 互惠原则 | 在要求信息之前先提供价值。免费工具访问、预览或示例结果。 |
仪表盘 / 数据显示
| 原理 | 应用 |
|---|---|
| 分块 | 按类别或优先级分组数据——而不是一个巨大的列表。 |
| 空间记忆 | 一致的布局，让回头用户能瞬间找到东西。不要移动它们。 |
| 满意原则 | 突出最重要的一个见解。用户会选择第一个可接受的选项。 |
| 识别优于回忆 | 展示完整上下文（标签、时间戳、图标）——不要让用户去记忆。 |
结账 / 支付
| 原理 | 应用 |
|---|---|
| 认知负荷 | 访客结账选项。最少表单字段。一次做一个决定。 |
| 透明度 | 在支付步骤之前展示所有费用。意外费用是弃购的头号原因。 |
| 损失厌恶 | 信任徽章和保证紧邻支付按钮，而不是放在页脚。 |
| 默认效应 | 预选标准配送。预勾选“保存信息”。减少决策。 |
关于 / 信任页
| 原理 | 应用 |
|---|---|
| 权威 | 方法论、数据来源、团队专业能力——证明你懂行。 |
| 信任层级 | 此页面服务于处于2-3级（兴趣→信心）的用户。不要在此处要求购买。 |
| 透明度 | 诚实说明局限性，而不仅仅是优点。坦诚建立信任。 |
代码级实现示例
锚定效应（定价页）
之前——所有套餐平等，无锚点：
<div class="plans">
<div class="plan">基础版 — 19美元/月</div>
<div class="plan">专业版 — 49美元/月</div>
<div class="plan">企业版 — 99美元/月</div>
</div>
之后——专业版作为视觉默认锚点：
<div class="plans">
<div class="plan">基础版 — 19美元/月</div>
<div class="plan featured"> <!-- 视觉上突出，预选 -->
<span class="badge">最受欢迎</span>
专业版 — 49美元/月
</div>
<div class="plan">企业版 — 99美元/月</div>
</div>
原因： 被突出的套餐成为锚点。基础版相比之下显得便宜。企业版的存在让专业版看起来合理。“最受欢迎”徽章增加了社会认同。
损失厌恶（订阅行动召唤）
之前——增益框架：
<button>获取高级访问权限</button>
<p>解锁所有功能和高级内容。</p>
之后——损失框架：
<button>保留我的高级访问权限</button>
<p>没有高级版，您将失去每日见解、
已保存的仪表盘和优先支持。</p>
原因： “您将失去访问权限”触发损失厌恶（强度约是等效收益的两倍）。行动召唤使用了“保留”——将其框架为保护他们已拥有的东西。
蔡格尼克效应（引导进度）
之前——无进度指示：
<form>
<h2>告诉我们您的信息</h2>
{/* 8个字段在同一页 */}
</form>
之后——分步并显示可见进度：
<div className="progress-bar">
<div className="step completed">个人资料</div>
<div className="step active">偏好设置</div> {/* 当前 */}
<div className="step">确认</div>
</div>
<form>
<h2>第2步，共3步 — 您的偏好设置</h2>
{/* 仅2-3个字段 */}
</form>
原因： 未完成的进度条会产生心理张力。用户会回来完成他们开始的事情。将8个字段拆分为每次2-3个字段的3个步骤，既减少了认知负荷，又产生了完成的驱动力。
认知负荷（结账）
之前——强制创建账号：
<h2>创建账号以继续</h2>
<input placeholder="邮箱" />
<input placeholder="密码" />
<input placeholder="确认密码" />
<button>创建账号并结账</button>
之后——访客结账，延后创建账号：
<h2>结账</h2>
<input placeholder="邮箱（用于收据）" />
<button>立即支付</button>
<p class="subtle">想保存信息下次使用？
<a href="/create-account">创建账号</a>可在结账后进行。</p>
原因： 每多一个字段就是一个导致弃购的决策点。先完成交易。在他们已经承诺（承诺/一致性原理）之后，创建账号就是一个小的后续请求。
原理类别（11个）
| 类别 | 数量 | 核心见解 |
|---|---|---|
| 注意力 | 4 | 用户看到的比你想象的少 |
| 格式塔 | 8 | 视觉分组驱动理解 |
| 记忆 | 10 | 识别优于回忆；分块一切 |
| 意义建构 | 3 | 心智模型塑造预期 |
| 决策 | 5 | 更少选择，更清晰结果 |
| 运动/交互 | 3 | 大目标，快速响应 |
| 动机 | 4 | 自主 + 胜任 + 归属 |
| 认知偏见 | 10 | 默认持续；第一印象定锚 |
| 说服 | 9 | 先建立信任再请求；先证明再承诺 |
| 情感 | 6 | 美观让人觉得好用；愉悦赢得忠诚 |
| 伦理 | 3 | 说服与操纵之间的明确界限 |
总计：65条原理——完整数据库请参阅 knowledge/principles.md，包含定义和设计影响。
反模式（绝不能做）
- 虚假稀缺计数器——如果不真实，不要展示
- 确认羞辱——“不，我不想省钱”是操纵行为
- 结账时隐藏费用——购物车弃购的头号原因
- 强制续订——难以取消的订阅会侵蚀所有信任
- 误导——通过视觉技巧强制错误点击
- 虚假社会认同——伪造的推荐或夸大的数字
- 黑暗默认——预勾选用户未要求的选项
- 蟑螂旅馆模式——容易进，难出来
来源
原理源自NN/g的用户体验心理学学习指南（11个类别112份资源），并改编为可操作的设计模式。学术基础：Kahneman（前景理论）、Norman（情感化设计）、Cialdini（影响力）、Hick、Fitts、Miller、Zeigarnik。