12个改善用户体验的交互设计法则（附案例）

在交互设计中有许多经典的交互定律，这些定律基于心理学和人机交互的研究，为设计师提供了指导，使产品的交互更贴合用户心理和行为习惯。特别是 AI 时代对这些法则的应用，让设计更加智能化、贴心化。以下以国内产品为例，结合 12 条经典设计法则，为你揭秘如何通过科学设计改善用户体验。

更多法则：

一、菲茨法则（Fitts’s Law）

定义： 用户选择目标的时间由目标的距离和大小决定，目标越近、越大，操作效率越高。

设计应用：

1. 增大点击区域： 确保按钮、链接的大小足够，减少误触概率，尤其是主功能按钮。
2. 优化目标位置： 将高频功能放置在容易触达的位置（如屏幕底部或页面显眼区域）。

案例：

1. 手机键盘的空格键： 比其他按键更大，降低误触风险，同时提升打字效率。
2. 微信底部导航栏： 将“聊天”“发现”“我”等高频功能按钮设计为大图标，并放置在屏幕底部，方便单手操作。

二、希克法则（Hick’s Law）

定义： 用户在选择时，所需时间随着选项数量的增加而增加。选项越多，决策时间越长。

设计应用：

1. 减少一次性选项： 不要一次展示过多选择，避免让用户陷入“选择困难”。
2. 分步交互： 将复杂任务分解为简单的步骤，引导用户一步步完成。

案例：

1. 淘宝结算流程： 用户需要先“选择地址”，再“选择支付方式”，最后“确认订单”。通过分步骤设计，每一步的选择都清晰明确，避免用户因信息量过大而感到困惑。
2. 外卖 App 的菜品分类： 将菜单分为“主食”“饮品”“小吃”等几类，每类内的菜品数量也控制在合理范围内，方便用户快速定位。

三、米勒定律（Miller’s Law）

定义： 人类短期记忆的容量有限，通常只能记住 7±2 个信息块。

设计应用：

1. 信息分块： 将内容拆分为更小的部分，减少用户一次性处理的信息量。
2. 视觉层级： 利用标题、分组等设计，帮助用户快速理解页面信息。

案例：

1. 电话号码分组： 电话号码通常以“123-456-7890”形式分组，方便记忆和输入。
2. 饿了么商家列表： 首页显示少量精选商家，并以“热销”“新品”分块，帮助用户更快找到想要的餐厅或菜品。

四、雅各布法则（Jakob’s Law）

定义： 用户会更倾向于选择与他们熟悉的其他产品类似的设计。

设计应用：

1. 遵循行业规范： 使用用户熟悉的图标、布局和交互模式，减少学习成本。
2. 避免过度创新： 创新要有度，不应违背用户的预期操作习惯。

案例：

1. 放大镜搜索图标： 在淘宝、京东等电商 App 中，“搜索”图标无一例外都是放大镜，因为用户已习惯这种符号。
2. 抖音的上下滑动切换视频： 用户可以直接套用“切换内容=滑动”的认知，无需学习新的操作逻辑。

五、多特法则（Doherty Threshold）

定义： 如果系统的响应时间低于 400 毫秒，用户会感到操作流畅，并保持专注。

设计应用：

1. 优化响应速度： 加快系统反应时间，提升流畅性。
2. 提供反馈： 对耗时的任务（如加载）显示进度条或占位符，缓解用户的焦虑。

案例：

1. 抖音即时加载： 滑动时快速呈现新视频，几乎无延迟，让用户体验流畅。
2. 京东商品加载： 在网络较慢时，展示占位图标，提示“加载中”，让用户知道系统正在工作。

六、帕累托原则（Pareto Principle）

定义：80%的结果来源于 20%的关键操作或功能。

设计应用：

1. 突出核心功能： 在界面设计中优先突出关键功能。
2. 优化关键路径： 将用户最常用的操作路径设计得更顺畅。

案例：

1. 美团首页设计： 首页突出“外卖”“团购”“打车”等高频功能，次要功能如“酒店”“机票”放置在次级菜单中。
2. 支付宝核心功能： 直接在首页展示“支付”“转账”“收款”等功能按钮，方便用户快速操作。

七、特斯勒定律（Tesler’s Law）

定义： 每个系统都有其固有的复杂性，设计的目标是简化用户的感知复杂性，而不是转移问题。

设计应用：

1. 隐藏技术复杂性： 让复杂逻辑在后台运转，用户只看到简单的界面。
2. 提供自动化功能： 减少用户的手动操作或输入。

案例：

1. 高德地图的路径规划： 用户只需输入起点和终点，系统会自动规划最优路线，而无需用户手动选择。
2. 滴滴出行的“一键叫车”： 通过 GPS 自动定位用户位置，用户只需确认目的地即可完成操作。

八、峰终定律（Peak-End Rule）

定义： 用户对体验的整体印象由“高峰时刻”和“结束时刻”决定，而不是整个过程的平均水平。

设计应用：

1. 设计高光时刻： 在用户流程中设置让人印象深刻的正向体验。
2. 优化结束阶段： 确保流程最后一个环节流畅且愉快。

案例：

1. 微信支付成功动画： 支付完成后，系统会播放一个简单的动画，并显示“支付成功”，让用户感到满足。
2. 淘宝的收货评价提醒： 确保用户收到货物后，会看到“感谢购物”提示，营造积极的情感连接。

九、盖斯特法则（Law of Prägnanz）

定义： 用户倾向于以最简单的方式理解界面和内容。

设计应用：

1. 简洁设计： 界面中避免不必要的装饰，突出核心信息。
2. 直观表达： 使用清晰的图标、标题和分隔线，减少用户理解难度。

案例：

1. 微信聊天界面： 界面设计简洁，只包含头像、消息内容和必要的操作按钮，避免视觉干扰。
2. 美团商品列表： 每个商家卡片清晰展示评分、销量和配送信息，便于用户快速决策。

十、库克定律（Krug’s Law of Usability）

定义： “Don’t make me think”——好的设计让用户无需思考如何使用，而是自然地理解操作方式。

设计应用：

1. 清晰导航： 使用直白的文案和功能按钮提示。
2. 简化操作： 避免隐藏重要功能，减少用户的认知负担。

案例：

1. 淘宝购物车的“去结算”按钮： 设计醒目、文案直白，用户不需要额外思考下一步如何操作。
2. 支付宝的“扫一扫”功能： 放置在首页最显眼的位置，方便用户快速找到。

十一、奥卡姆剃刀原则（Occam’s Razor）

定义： 在多个解决方案中，选择最简单且有效的方案。

设计应用：

1. 避免复杂设计： 删除多余的功能或步骤，简化交互流程。
2. 聚焦核心任务： 将资源集中于最重要的功能上。

案例：

1. 微信登录页面： 只保留“手机号”“密码”两项输入，避免复杂的注册过程。
2. 抖音的主界面： 界面直接呈现视频内容，不需要额外的点击或导航。

十二、社会证明效应（Social Proof）

定义： 用户倾向于依赖他人的行为或评价来做决策。

设计应用：

1. 展示用户评价： 提供用户评论、评分和购买人数等信息。
2. 强化社交证明： 使用案例、推荐或榜单增强信任感。

案例：

1. 小红书商品笔记： 用户在购买前可以查看他人分享的使用经验和评论。
2. 京东商品页面： 显示“已有 5000+人购买”的提示，增加可信度和吸引力。