为什么你的UI设计总被说“不好用”？为什么用户就是点不到那个按钮？为什么明明功能齐全，用户却一脸懵圈？
别急着改稿，先看看这篇内容。我花了三天时间，把散落在各个角落的交互设计原则，用“道、法、术”的框架重新梳理了一遍。
看完你会发现：原来那些大神级的设计，背后都有同一套逻辑。
写在前面
“道法术”出自老子《道德经》，后来被广泛应用于战略管理、个人成长等领域。简单来说：
- 道：是根本规律，就像万有引力，谁也逃不掉。
- 法：是策略原则，像交通规则，指导你怎么开车。
- 术：是具体技巧，像方向盘打法，细节决定成败。
交互设计也是一样。如果我们只学“术”，比如按钮要做多大、间距要留多少，遇到新场景就会抓瞎；如果只懂“道”，比如人类注意力有限，却不知道怎么落地，那也只是空中楼阁。
今天，我们就用这个框架，把50条交互设计原则一次性讲透。建议先收藏，再细读。
第一部分：道 · 设计的底层逻辑
道层面的原则，来自心理学、生理学、物理学，是不可改变的人性规律。违背它们，用户就会本能地觉得“难用”。
1. 菲茨定律（Fitts’ Law）
目标越大、越近，越容易点中。
这条定律是交互设计的基石。鼠标或手指从起点移动到目标的时间，取决于目标的大小和距离。
设计启示：重要按钮要足够大，放在容易够到的地方，比如移动端的拇指热区。
2. 席克定律（Hick’s Law）
选择越多，决策越慢。
一个人面临的选择每增加一个，做出决定的时间就会相应增加。
设计启示：别把用户逼成选择困难症。需要快速决策的场景，选项最好控制在3-5个。
3. 神奇数字7±2法则
人的工作记忆容量只有5-9个信息块。
超过这个数量，大脑就会开始“死机”。
设计启示：导航栏选项卡不要超过5个；多步骤操作，每步只给3-4个选项。
4. 格式塔原则（完整版）
这是视觉感知的底层法则，包含多个子原则：
- 接近法则
离得近的元素，会被认为是一组的。 - 相似法则
长得像的元素，会被归为一类。 - 闭合法则
大脑会自动补全不完整的图形。 - 连续法则
倾向把分散的点看成一条线。 - 简单法则
对称、规则的图形更易被感知为整体。 - 主体/背景原则
通过对比突出主体，比如弹窗的蒙层。
设计启示：利用这些原则组织界面，能让用户“一眼看懂”。
5. 转向定律（Steering Law）
沿路径移动时，路径越窄、角度越刁，越难操作。
研究发现，120°方向最难控制，宽度低于14像素的触控点体验最差。
设计启示：滑动条要够宽，关键控件避开难操作的角度。
6. 帕累托定律（80/20原则）
80%的效果来自20%的关键变量。
在产品里，用户80%的时间，只花在20%的功能上。
设计启示：把80%的精力用来打磨那20%的核心功能，别平均用力。
7. 峰终定律（Peak-End Rule）
人们对体验的记忆，由两个时刻决定：峰值（最好或最坏的瞬间）和结束时的感觉。
设计启示：不必追求每一步完美，但关键节点（如支付成功）要给足惊喜；结束时的反馈要温暖。
8. 心智模型
用户基于过往经验，对产品有一套固定的“预期”。
比如，购物车就该能装东西，“返回”就该回到上一步。
设计启示：别轻易挑战用户的认知惯性，除非你的创新能带来巨大价值。
9. 本能反应
用户第一眼看到产品时的感受，先于理性分析。
干净漂亮的界面让人想亲近，杂乱无章的界面让人想逃离。
设计启示：情感设计不是锦上添花，而是第一道门槛。
第二部分：法 · 设计的策略框架
法层面的原则，是在“道”的指导下总结出的设计准则和检查清单，它们告诉你“应该怎么做”。
10. 泰思勒定律（复杂性守恒定律）
每个过程都有固有的复杂性，无法消除，只能转移。
比如，收件人地址必须用户输入，但发件人地址可以通过客户端自动填写。
设计启示：别妄想简化一切，把复杂性转移到后台或用户可接受的地方。
11. 奥卡姆剃刀原理（简单有效原理）
如无必要，勿增实体。
两个功能相等的设计，选最简单的那个。
设计启示：删掉多余装饰、冗余文案、非必要步骤。
12. 尼尔森十大可用性原则
这是人机交互的“十诫”，必须烂熟于心：
- 系统状态可见性
告诉用户现在在哪儿、在干嘛，比如加载进度条。 - 贴近场景
用用户的话说人话，别用专业术语。 - 用户可控性
随时能“撤销”“退出”。 - 一致性与标准化
同一功能在不同页面长一样。 - 识别而非回忆
把选项摆出来，别让用户记忆。 - 灵活高效
允许快捷键、个性化设置。 - 审美与简约
对话中不含无关信息。 - 容错与恢复
错误提示要友好，并给出解决方案。 - 人性化帮助
必要时刻提供帮助文档。 - 防错
详见下一条。
13. 防错原则
设计应预防错误发生，而不是等出错了再补救。
源自工业管理，比如USB插槽防反插，在交互设计里随处可见：
条件不满足时按钮置灰 不可逆操作前二次确认 输入时实时校验格式
14. 接近法则（作为设计策略）
利用“离得近表示相关”的视觉规律，组织界面元素。
设计启示：按钮紧挨着对应的文本框；不相关的功能保持距离。
15. 可发现性
功能需要被用户看见，才能被使用。
设计策略：
核心控件始终可见 新功能要有引导 不要过度隐藏，比如汉堡菜单里的核心功能
16. 莱斯托夫效应
与众不同的元素最容易被记住。
设计策略：用颜色、大小、形状突出核心操作，让它在相似项中“跳出来”。
第三部分：术 · 设计的落地技巧
术层面的技巧，是具体场景下的执行细节，像素级的操作指南。
17. 菲茨定律的应用技巧
重要按钮放在拇指热区，也就是移动端屏幕下半部 边缘停靠，比如Mac的菜单栏放在屏幕顶部，鼠标一甩就到 增大可点击区域，比如把文字链的点击区域扩大到整行
18. 席克定律的应用技巧
分步引导：复杂流程拆成几步，每步只给少量选项 渐进呈现：先展示核心功能，高级功能默认隐藏 分类聚合：将相似选项分组，减少信息块数量
19. 转向定律的量化建议
触控点宽度 ≥ 14像素 避免在120°方向路径上，放置需要精确操作的小控件 滑动条要有足够的宽度，至少44像素
20. 防错原则的落地技巧
危险操作前弹窗确认，且默认选项为“取消” 输入框实时校验，比如密码强度提示 表单提交失败后，自动滚动到错误项并高亮 不可逆操作提供“撤销”功能
21. 帕累托定律的落地技巧
通过数据分析找出高频功能，优先优化 用帕累托图可视化哪些功能贡献了80%的使用量 砍掉那20%无用的功能，给核心功能让路
22. 可发现性的具体手法
新功能用“红点”或气泡提示 按钮添加微动效吸引注意 核心功能放在常驻区域，比如底部导航 新手引导遮罩，一步步教用户探索
23. 峰终定律的应用技巧
完成关键任务后，放个庆祝动画，比如支付成功撒花 退出时显示“期待再次见到你”等情感化文案 错误页面也要有趣，别扔个冷冰冰的404
24. 心智模型的匹配技巧
使用用户熟悉的图标，比如“购物车”“设置齿轮” 遵循平台规范，iOS和Android的导航逻辑不同 如果必须创新，提供充分的引导和过渡
25. 格式塔原则的落地技巧
卡片化设计利用闭合法则 同类信息用相同颜色区分，契合相似法则 弹窗用蒙层突出主体，契合主体/背景原则 列表间距体现分组关系，契合接近法则
26. 尼尔森原则的细节实现
加载时显示进度条或骨架屏，保障状态可见性 错误提示说“密码太短”而不是“输入错误”，贴合用户场景 多步骤操作提供“上一步”和“保存草稿”，保障用户可控性 所有删除按钮样式一致，保障一致性 下拉选项直接展示，不用记忆输入，实现识别而非回忆
尾声：道法术三者合一
看到这里，你可能会问：这么多原则，怎么记得住？
其实很简单：
- 道
是心法：理解人性，尊重规律。 - 法
是招式：遵循准则，少走弯路。 - 术
是细节：打磨体验，赢在毫厘。
真正的高手，不会生搬硬套某一条原则，而是融会贯通——用“道”洞察本质，用“法”构建框架，用“术”雕琢体验。
下次做设计时，不妨问自己三个问题：
如果你能把这些原则内化成肌肉记忆，你的设计说服力，绝对能碾压99%的同行。
收藏 ≠ 学会，转发给团队一起讨论，下次评审会你就是最懂设计的那个人。
优网科技秉承"专业团队、品质服务" 的经营理念，诚信务实的服务了近万家客户，成为众多世界500强、集团和上市公司的长期合作伙伴！
优网科技成立于2001年，擅长网站建设、网站与各类业务系统深度整合，致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设（品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、微信小程序定制开发、移动端应用（手机站、APP开发）、微信定制开发（微信官网、微信商城、企业微信）等一系列互联网应用服务。
公安局备案号：
专属顾问
