如何将学术理论应用于以用户为中心的网页设计——完整手册

从雅各布定律中得到的设计启示

确保关键信任要素具有可预测性：
导航、搜索、认证等涉及用户重要利益的交互功能，必须遵循既定的设计规范。用户依赖这些常规的设计模式来保证操作的效率、信心和安全性——在这方面，雅各布定律绝对不容违背。

仅在低风险、高创造性的领域进行实验：
在那些以创造力或生产力为目标的区域——比如照片应用中的编辑工具——你可以安全地引入新的交互模式，例如 radial菜单、手势轮或能根据上下文自动选择工具的功能。这些领域适合进行探索，而且也能从提高效率的创新中受益。

总结来说： 在重要的地方遵循传统做法，在能够带来创新效果的地方大胆尝试新方法。

6.0 米勒定律

米勒定律源于乔治·A·米勒的经典论文《神奇的数字7，加减2》。该定律指出，普通人在任何时候的工作记忆中最多只能容纳大约7个（±2个）信息单元（Miller, 1956）。

关键在于，大脑并不会存储孤立的信息，而是会将它们组合成有意义的整体。由于工作记忆的能力非常有限，开发者必须以符合这一认知限制的方式来组织信息。

这一原则对界面设计有着直接的影响：冗长、连续的信息会让用户感到难以处理，而将信息分块呈现则会使用户更容易理解。

例如，将电话号码显示为1234567890，不如将其格式化为123-456-7890，这样十个数字就被分解成了三个易于处理的单元。导航设计也是如此：尽量设置5到9个主要菜单项，如果需要更多选项，就将其分类呈现。用户会将整个类别作为一个整体来记忆，而不会记住每一个单独的链接。

米勒定律还可以解释为什么长表格会让用户感到畏惧。当用户在一页上看到30个输入字段时，他们的大脑会认为这是一项极其复杂的任务——显然超出了7±2的信息处理范围。

分步填写的形式可以通过将表格拆分成每步包含5到7个字段的小模块来解决这个问题。这样既能减轻用户的认知负担，还能让他们感受到进展，从而显著降低放弃使用的概率。

这一原则同样适用于产品列表或搜索结果。要求用户一次性比较50个选项是不现实的。因此，应该提供强大的筛选工具，帮助用户将选项数量缩小到他们的工作记忆能够有效处理的范围内。

归根结底，米勒定律提醒开发者：人类并不是以整体形式来处理信息的，而是会将信息分解成结构化、有意义的单元来进行处理。

图6.0：分步填写表单的示例

在上面的例子中，界面同时使用了进度条和分步按钮来引导用户完成任务的各个阶段。当用户完成第一页的内容并选择“继续”后，系统会进入下一阶段，进度条也会相应地更新。这种设计能够让用户清楚地感受到自己的进展与成就。

通过将整个流程分解为更小的环节，界面设计可以有效避免用户出现认知负担过重的情况。如果所有信息都集中在一个页面上展示，用户可能会感到不知从何开始，或者被海量信息吓退。

分步进行的流程能将一项庞大的任务转化为一系列易于处理的步骤，从而提高完成任务的可能性。

来自米勒定律的设计启示

遵守7±2的工作记忆容量限制：用户一次只能记住大约七条信息。长篇连续的内容会让他们感到难以应对，而将信息分解成小块则能使其更容易被处理。

将信息整合成有意义的单元：大脑并不会存储孤立的信息，而是会将它们归类整理。因此，应将数据、菜单和设置等格式化为清晰、易于记忆的单元，而不是冗长平铺的列表。

^{保持导航选项数量在5到9个以内：如果需要展示超过9个选项，应将其分类呈现。用户会将整个类别作为一个整体来记住，而不会记得每一个单独的链接。}

将冗长的表格分解为更小的步骤：一个包含30个字段的表格会让用户觉得这是一项极其艰巨的任务。而如果将表格分为每步5到7个字段的形式，就能有效避免用户的认知负担过重，从而显著降低用户放弃使用该界面的可能性。

^{利用强大的筛选工具减少比较负担：要求用户同时对比50种产品是不现实的。应提供筛选工具，将可选选项的范围缩小到工作记忆能够处理的范围内。}

设计时应考虑用户的分块思考习惯，而非批量处理信息：人类并不会一次性处理大量信息，而是倾向于处理结构清晰、有意义的信息单元。遵循这一原则设计的界面会让人感觉更轻便、使用起来更快，也更加直观。

^{总结来说：分步进行的流程能将一项庞大的任务转化为一系列易于处理的步骤，从而提高完成任务的可能性。}

7.0 目标梯度假设

现在正是介绍目标梯度假设的绝佳时机。这一假设最初是由行为学家克拉克·赫尔在1932年提出的（Yablonski, 2022）。该假设认为，当人们越来越接近实现目标时，他们的动力会变得更强。换句话说，当用户感觉到自己即将完成任务时，他们会自然而然地加快速度去完成剩余的工作。

这一原则在用户体验设计中具有极其重要的作用，尤其是在进度跟踪、游戏化设计以及奖励机制的构建方面。

^{关键在于：由于用户在接近目标时动力更足，因此进度指示器应当醒目且富有意义。
百分比、进度条和步数计数器都能帮助用户保持前进的动力。而徽章、勾选标记或小奖励等机制，则能通过庆祝这些小小的成就来进一步提升用户的积极性。}

^{任务应该被分解成可衡量的里程碑，这样用户就能清楚地看到自己的进展情况。}

这就是为什么电子学习平台会显示诸如“你已经完成了10节课中的8节——距离目标已经很近了！”这样的提示，也是为什么健身应用会用“已经走了3公里，还剩2公里”之类的信息来突出用户的进步。这些提示利用了目标梯度效应，使用户保持参与热情、充满动力，并渴望完成剩余的任务。

通过将渐进式练习环节与清晰的进度反馈相结合，开发者设计出了更加鼓舞人心、更具激励作用的界面——这最终提升了任务的完成率以及用户的整体满意度。

但是，当目标没有实现时，会发生什么呢？为什么我们有时会感到不安，不愿意让事情半途而废呢？这种不安可以用另一个心理原理来解释，那就是蔡加尼克效应：人们往往会记得那些未完成的任务，并因此感到焦虑。接下来我们将详细探讨这一现象。

从目标梯度假设中得出的设计启示

让进度可视化以提升动力：根据目标梯度假设，当用户感觉到自己快要完成任务时，他们的行动速度会自然加快。醒目的进度条、百分比显示以及步骤计数器都能激发这种本能，帮助用户保持高积极性。

通过庆祝小成就来增强参与感：徽章、勾选标记、简单的奖励提示等机制能够表彰那些小小的进步。这些微小的奖励会进一步激发用户的动力，让漫长的任务看起来变得更容易完成。

将任务分解为可衡量的里程碑：当用户能够清楚地看到自己的进展时，他们就会保持动力。将复杂的任务分解成具体的步骤，会让进度显得更加明确、易于管理，从而减少用户的挫败感。

利用进度反馈推动任务完成：像“已经完成了10节课中的8节”或“已经走了3公里，还剩2公里”这样的提示，正是利用了目标梯度效应来激励用户继续前进的。

将渐进式练习与清晰反馈相结合以取得最佳效果：渐进式练习环节与直观的视觉反馈相结合，能够创造出既鼓舞人心又条理清晰的界面，从而显著提高任务的完成率。

视频8.0：解释目标梯度效应的视频

总结：当人们越来越接近实现目标时，他们的动力也会随之增强。

8.0 蔡加尼克效应

蔡加尼克效应是一种心理学原理，它指出：人们往往会对未完成或被中断的任务记得更加清楚（Cherry, 2024）。

记忆的形成始于感官输入，这些信息会被处理成短期记忆。未完成的任务会持续存在于我们的脑海中，从而引发主动回忆。这种持续的关注会使它们转化为长期记忆，进而提高我们回忆这些任务的能力，直到它们被真正完成。这样一来，用户的参与度会提高，完成任务的动力也会增强，记忆保留效果也会得到改善，最终有助于实现目标。

由于人们对于未完成的任务的记忆程度要高于已完成的任务（这就是所谓的“蔡加尼克效应”），因此开发者会使用进度提示来让用户意识到某些任务尚未完成，并激励他们去完成这些任务。

在你的设计中，可以将复杂的流程分解为多个步骤，以此鼓励用户完成任务；同时，展示任务的完成百分比（比如“已完成70%”）也能促使用户努力将其完成度提升到100%。

这就是为什么电子商务平台会发送购物车放弃提醒，目的是让用户回来完成购买操作；这也是为什么应用程序会使用连续完成任务的功能来鼓励用户养成每日使用的习惯，而学习平台则会显示课程完成进度条，以激励用户完成各个学习模块。

从蔡加尼克效应中得到的设计启示

未完成的任务会在记忆中持续存在——利用这一点来推动用户完成任务：
由于未完成的任务会留在工作记忆中（这就是蔡加尼克效应），用户自然会不断思考那些尚未完成的事情。这种心理状态会增强他们的回忆能力、参与度，以及完成这些任务的动力。

通过进度提示让未完成的状态显而易见：
进度条、百分比和步骤计数器可以提醒用户某些任务还处于未完成状态。这种温和的心理压力会激励他们继续努力，直到任务完成。

将复杂的流程分解为多个步骤：
过长的填写流程会让用户感到不知所措，但将其分解成若干个小步骤就能帮助用户顺利完成任务。显示“已完成70%”这样的信息也能鼓励用户完成剩余的部分。

利用提醒功能重新激发用户未完成的意愿：
购物车放弃提醒、连续完成任务提示等功能之所以有效，是因为这些未完成的任务早已存在于用户的脑海中。提醒功能只是将他们重新拉回到完成任务的轨道上而已。

通过庆祝任务完成来闭合认知循环：
勾选标记、确认信息以及完成徽章都能让用户感受到任务的完成，从而缓解因未完成任务而产生的心理压力，并强化这种积极的行为习惯。

总结来说：未完成的任务会持续存在于我们的脑海中，从而引发主动回忆。

9.0 特斯勒定律:

这条定律是由劳伦斯·特斯勒提出的。他是一位致力于人机交互研究的计算机科学家，为提升软件的用户友好性做出了重要贡献，尤其是在复制、粘贴等功能的设计上。

这条定律也被称为“复杂度守恒定律”。其核心观点是：任何流程都存在一定的“固有复杂度”，这种复杂度是无法被消除的。我们只能决定由用户还是系统来处理这些复杂度。

这些固有复杂性的一些例子可能包括：

• 将用户的操作转化为后台的正确处理流程；

• 处理不可靠或速度缓慢的网络连接；

• 与第三方API、服务或旧系统进行交互；

• 快速排序大型数据集；

• 执行复杂的搜索操作；

• 管理版本变更及兼容性问题；

• 在不会让用户感到困惑的情况下，处理状态变化、交互逻辑及动画效果。

所有这些环节本质上都可能充满复杂性，但解决这些复杂问题正是开发者的职责所在。

作为开发者，你应该尽可能地将这些复杂性交给系统来处理。例如，不要让用户手动输入完整的地址，而是使用自动完成功能——谷歌的Places和Map功能在这方面非常实用。虽然查找和验证地址的过程仍然存在复杂性，但软件会替用户完成这些工作。

举个具体的例子：假设你正在设计一个学生平台，要求用户输入自己就读的大学的名称。一种可行的做法是在代码中存储英国所有大学的名单（这正是特斯拉所提到的那个“困难环节”）。

当用户开始输入信息时，他们不需要完全输入完整的大学名称，系统会根据他们已输入的内容自动显示正确的全称。比如，如果他们打算输入“University of Sheffield”，那么只需输入“Sheff”，系统就会显示出完整名称供他们选择。

在Dart语言中，你可以使用像fuzzysearch这样的库来实现这种智能匹配功能。

这种方法的优点远比表面上看到的要大。它能够提高数据的一致性，因为用户往往会用不同的方式来输入相同的信息。例如，有些人可能会输入“Uni of Sheff”，有些人会写成“Sheffield University”，但它们实际上都指的是同一所大学。

正是这种混乱的数据生成方式，使得数据分析师需要花费大量时间来进行数据清洗。难怪数据分析师会有多达70%的时间用于处理这些工作。

如果开发者能花更多时间来规范数据的收集方式，确保数据的一致性，那么数据分析人员后续的工作量就会大大减少。我们在收集日期、时间等其他信息时，也应该遵循同样的原则。

因此，除了用户的姓名和电子邮件地址之外，你应该尽可能地标准化应用程序所收集的数据。可以使用日期和时间选择器、步进控件、输入框掩码、复选框、下拉菜单、单选按钮以及切换开关等等工具来帮助实现这一目标。

减少用户面临的复杂性，不仅有助于提升用户体验，还能确保收集到的数据是标准化、结构化且具有一致性的。

从特斯拉定律中得到的设计启示

将复杂性留给系统，而非用户：
任何流程都不可避免地存在复杂性。你的职责就是在幕后处理这些复杂性，从而使用户能够享受到最简单、最便捷的交互体验。自动化那些用户本不必费心去考虑的任务：
利用自动完成、模糊搜索、智能默认设置以及验证接口等工具，消除人工操作带来的麻烦。虽然这些任务本身仍然存在复杂性，但系统会承担这些复杂度，而不是让用户来处理它们。

规范输入方式以避免数据混乱：
用户常常以截然不同的方式输入相同的信息。通过使用下拉菜单、输入框掩码、单选按钮等元素，可以确保数据的收集过程保持一致性与条理性。

内部处理那些固有的技术复杂性：
网络问题、API的特殊用法、大规模数据集的排序、搜索优化、状态管理以及动画逻辑等等，这些都属于开发者的职责范围。用户根本不应该感受到这些复杂性的存在。

总结来说： 每个流程都不可避免地会包含复杂性。作为开发者，你的任务就是将这些复杂性隐藏在幕后，让用户能够体验到最简单、最便捷的交互过程。

10.0 顶点-终点法则:

一个负面的结局往往会掩盖原本良好的体验，因此要格外注意避免那些令人沮丧的环节，比如意外的费用或令人困惑的确认流程。

情感的强度会极大地影响人们对记忆的留存方式，正因如此，许多应用程序会在关键节点加入庆祝动画、奖励或成功提示，以此留下积极的印象。

从“峰终法则”中得到的设计启示

人们评价体验时，关注的是体验的高潮部分和结局——而不是整个过程持续的时间：
用户不会记住每一个细节，他们只会记得最紧张的环节以及体验是如何结束的。一个稍微更好的结局，就足以彻底改变人们对整个互动过程的记忆。

在用户体验的设计中，要重点打造积极、圆满的结局：
流畅的最终步骤、清晰的确认信息或令人满意的成功提示，都会留下深刻的印象；而糟糕的结局却会掩盖原本美好的体验。

在关键节点设计能够引发情感高潮的元素：
庆祝动画、奖励、勾选标记和成功提示，这些都能创造出值得铭记的情感高峰，帮助用户将这段体验牢牢地记在心中。

不必试图让每一个环节都完美无缺——只要重点优化那些关键的节点即可：
优化体验的高潮部分和结局，这两个环节决定了用户对整个互动过程的记忆。

要避免在最后阶段出现负面的意外：
意外的费用、令人困惑的确认流程，或者最后的麻烦步骤，都可能破坏人们对整个体验的美好回忆。因此，一定要仔细保护体验的结局部分。

总结来说：人们评价体验时，主要关注的是其中最紧张的环节以及体验是如何结束的，而不是整个过程持续了多久。

11.0 波斯特尔法则:

乔恩·波特尔提出的这一著名原则——“在发送内容时保持保守，在接收内容时则要开放”——体现了软件设计中的一种人文关怀。这一原则的核心在于：系统在接受用户输入时应该表现得宽容，但在输出结果时则必须严谨且可预测。

当开发者遵循这一原则进行开发时，用户会感受到被支持和理解；而如果他们没有这样做，用户就会觉得自己在使用这些系统时受到了不公平的对待。

用户的输入往往并不完美。人们打字时会犯错，会按照自己的习惯操作，也会使用自己熟悉的格式。一个优秀的系统能够接受这种不完美的输入，并将其转化为规范、清晰的数据。

现实生活中的人们并不会严格按照某种固定的格式来行事。他们会用在学校里学到的方式来书写日期，会按照自己说话的方式来输入电话号码，也会以自己觉得最自然的方式来填写姓名和地址。

一个僵化的系统会拒绝任何不符合其严格要求的输入，而一个优秀的系统则会适应用户的需求，做出相应的调整。

以日期为例来说，某些系统可能会要求输入格式必须为“月/日/年”，否则就会拒绝接受其他任何格式。而更人性化的系统则会允许用户使用多种格式来输入日期，比如“2024年5月1日”、“2024-05-01”或“05/01/24”等，然后这些日期会被自动转换成系统内部统一使用的标准格式。正是这种复杂的处理机制，体现了特斯拉定律所倡导的理念——将处理复杂任务的负担转移到系统中，而不是让用户来承担。

电话号码的格式都是相同的。人们可能会输入“(555) 123 4567”、”555-123-4567”、“5551234567”或“+1 555 123 4567”。一个脆弱的系统会因此出现错误，而一个稳健的系统则会利用像libphonenumber这样的库来解析这些格式，并继续正常运行。

地址的格式也同样多种多样。“221B Baker St”、“221-B Baker Street”以及“221 Baker St., Apt B”其实都指的是同一个地方。一个宽容的系统会将这些不同的格式进行标准化处理，而不会拒绝接受它们。

甚至名字也可能显得非常复杂。连字符、撇号、多个单词以及头衔都是真实人物身份的一部分。拒绝接受“O’Connor”、“Jean-Luc”或“Dr. Sarah Lee”这样的名字，不仅在技术上是不正确的，而且也是对用户的不尊重。

搜索栏也是一个很好的例子。一个严格的搜索栏要求用户输入完全正确的拼写和准确的表达方式；而一个稳健的搜索栏则能够处理拼写错误、“restaurant”这种部分匹配的关键词、同义词“food places”，以及像“我在附近哪里可以吃饭”这样的自然语言查询。它能够根据用户的实际需求来提供帮助，而不是强迫用户按照机器的方式思考。

货币格式也应该被标准化，例如应统一显示为“GBP 5.00”，无论用户输入的是“£5”、“5 pounds”还是“5 GBP”。

文件上传也同样可以从标准化中受益：无论用户上传的是.jpeg、.jpg、.JPG还是.JPEG格式的文件，系统都应该将其保存为 jpg 格式。

错误信息的呈现方式也应该遵循同样的原则。像“密码无效”这样的模糊反馈只会让用户感到困惑和沮丧。而一条清晰、明确的提示信息，比如“密码不正确，请重新输入”，才能真正尊重用户的宝贵时间。此外，系统应该提前说明密码的格式要求：至少八个字符，其中必须包含一个大写字母和至少一个数字。

可预测性能够减少使用过程中的麻烦和障碍。

由于用户难免会犯错或以意想不到的方式输入数据，因此开发者应该设计出具有容错能力的输入字段。这意味着要接受各种灵活的格式，提供自动纠错功能或智能解析机制，并采用宽容的验证规则，这些规则应该能够理解用户的真实意图，而不是拒绝他们的努力。

在用户提交信息之前，应该提供清晰的说明、工具提示以及明确的要求，这样用户就可以无需通过反复尝试就能明白系统期望什么。

当错误发生时，界面应该以温和的方式处理这些问题——既不能导致系统崩溃，也不能强迫用户重新开始操作。

即使是像在电话号码中添加空格、破折号或括号这样的简单变化，也应该被接受，并在系统内部进行标准化处理。

通过允许输入格式的灵活性，并确保输出结果的规范性，开发者就能创造出既人性化又具备强大适应能力的系统，这些系统真正能够反映真实人类的使用习惯。

从Postel定律中得到的设计启示

接受人类输入中的各种不规范之处，输出规范结构化的数据：
用户输入日期、姓名、电话号码和地址的方式往往是不可预测的。一个人性化的系统会接受这种多样性，并将其默默地转化为一种统一的内部格式。严格的界面会因为用户是普通人这一事实而惩罚他们；而完善的界面则能够理解用户的意图——无论是处理拼写错误、部分匹配的情况，还是使用同义词或自然语言输入，它们都能毫无怨言地完成这些任务。
同时，系统还应该能够接受间距、标点符号、大小写以及结构上的各种变化。让用户能够以自然的方式输入信息——系统应该负责处理这些复杂性，而不是让用户自己去应对。
对输入要灵活，对输出要严格：
这就是“Postel法则”的核心所在。让用户能够以自然的方式表达信息，但确保系统能够以一种可预测、标准化的形式来存储和显示这些信息。
利用智能解析和自动纠错功能减少错误：
像libphonenumber这样的库、模糊搜索技术以及自然语言解析器，能够让系统接受多种多样的输入格式，同时仍然生成清晰、可靠的数据结果。
在幕后对所有数据进行标准化处理：
日期、电话号码、货币单位、文件扩展名以及地址等信息都应该在系统内部被统一标准化。这样就能避免出现混乱的数据，从而减少后续的处理工作量。
提供清晰、可预测的反馈：
错误信息应该具体且具有帮助性；各项功能要求也应当在一开始就明确展示给用户。用户不应该感到意外、困惑，也不应该被迫重新开始操作。
将Postel法则与Tesler法则结合起来：
把复杂性留给系统去处理。通过智能地处理那些复杂的输入数据，可以减轻用户的认知负担，提高系统的可用性，并确保数据的质量始终如一。
总结来说：严格的系统会拒绝任何不符合其狭隘期望的输入；而完善的系统则会适应用户的需求。