Lec 3 可学习性（TD）

目标导向学习

这个对话框出现在一个用于打印自定义奖状的程序中，它的任务是让用户选择一份奖状模板。这个界面看起来显然是图形化的：它通过鼠标操作——不需要记忆或输入复杂命令。它甚至还是所见即所得（WYSIWYG）的——用户可以看到将要生成的奖状预览。

那么，为什么它却不好用呢？

第一个提示是左侧那段很长的帮助信息。一个简单的选择任务为什么需要这么多帮助？因为这个界面非常怪异！

第二，这里用“滚动条”来选择奖状模板。 滚动条上的每一个位置都对应一个模板，移动滚动条就会改变当前显示的模板。这虽然是一个有趣的设计，但对滚动条来说却是糟糕的用法。注意，这个滚动条上没有任何刻度标记。那么一共有多少个模板？它们是如何排序的？要移动多少距离才能切换到下一个模板？从这个界面中你根本无法判断。

下面是一种可能的重新设计方案。在这个设计中，模板现在被放在左侧的列表框中；选择某个模板后，会在右侧显示其预览。

这个界面没有之前那个设计中的任何问题：列表框对新用户或不常使用的用户来说，很明显就是用来进行选择的；而对于频繁使用的用户来说，随机访问某个项目也非常简单。并且，这个界面甚至不需要任何帮助提示信息。

定义

初始可学习性定义：

• 系统应该对其目标用户群体来说易于学习。 —— Michelsen，1980
• 指典型用户能够以预先设定的熟练程度完成一组任务所需的努力。——Santos & Badre
• 让用户能够快速开始使用系统进行工作。 ——Holzinger

扩展的可学习性定义：

• 新用户开始有效交互并达到最大性能的容易程度 ——Dix et al.
• 无需正式培训也能达到最基本的有用程度，并且应该能够掌握该软件。 ——Riemann

学习 = 发现（能够做什么） + 理解（达到什么效果） + 记忆（下次还能做到）

给设计者的启发

用户通常不会先去学习，而是会直接尝试做自己想做的事情，并在使用界面过程中摸索如何完成目标。这种方式通常被称为“边做边学”

它意味着：

• 用户一开始就带着明确的目标进入系统；
• 他们更关心的是实现这个目标，而不是学习界面本身（因此过程中发生的学习只是次要的）；
• 因此，用户界面的责任在于清晰地传达如何使用，并同时帮助用户完成他们的第一个任务

用户进入时带着一个目标—— “把我照片里的红眼去掉”。随后他们会在界面中探索，看是否能找到实现这个目标的方法，他们并不关心学习这个界面，除非它能帮助他们达成目标。

关键点是：下一步操作应该是可发现的，最好是显而易见的，并且系统需要提供反馈，让用户看到自己的进展。

当用户遇到问题时，他们才会去寻求帮助：

• 他们到达帮助系统时已经遇到了具体障碍；
• 他们在寻找的是可执行的、具体的解决方案；
• 他们并不关心系统的设计理念或“哲学”等长篇大论。

用户通过“实际使用界面来学习”的事实，对我们如何设计界面有一些重要启示。

首先，我们需要了解用户的真实目标是什么——收集这些信息是以用户为中心过程中的一个关键部分；其次，用户界面本身应该成为最主要的老师，界面必须尽可能清晰地传达它的使用方式，让用户能够将自己的目标与系统中的操作正确匹配。第三，当用户确实需要寻求帮助时，这种帮助应该是可搜索的，并且以目标为导向的。提供一个30分钟的视频教程，对那些“边做边学”的用户来说通常并没有帮助

对设计者的启示：

• 在设计时要了解用户的目标
• 用户界面本身应该清楚地表达它的工作方式以及使用方法
• 通往目标的下一步操作必须始终是可发现的
• 帮助系统必须是可搜索的，并且围绕用户目标组织

通过界面学习

我们学习如何使用用户界面的另一种方式，是通过观察别人如何使用它。例如，当我们第一次使用陌生的地铁系统时，这通常就是主要的学习方式。

不幸的是，我们的大多数软件——无论是桌面、笔记本、平板还是智能手机上的应用——都是为单人使用设计的，因此你很少会和其他人一起使用它，这也减少了“通过观察他人学习”的机会。然而，有些功能其实是看别人用一遍才可能学会的，因为它们本身是不可见的。

比如，你可能知道如何使用 Alt-Tab 在窗口之间切换。你是怎么学会的？用户界面本身其实并没有清晰地告诉你这个功能。智能手机和平板上的“捏合缩放（pinch-zoom）”也是类似的情况，不过它可能借助了大众媒体的广告传播，让我们学会了如何使用它。

社交计算正在一定程度上改变这种情况。我们之后会看 Twitter，并看到即使人们不坐在你旁边，你也仍然可以通过他人来学习一些东西。

信息架构

这个问题——如何支持一个“以目标为导向的用户”——即使在静态网站中也非常重要。例如，在2019年，我想在 DAPER 预订一些私人健身训练课程。

目标： 在 DAPER 预订一些私人训练课程

下面看这个用户旅程

结果发现，私人训练的订购页面被放在“账户信息”下面的“Buy Series Sales”（本身就让人困惑的一个名字）里。 这完全没有逻辑

所谓信息架构（Information Architecture），是为网站、应用或者其他项目定义结果的过程。其作用是，帮助用户理解自己当前所在的位置，以及接下来可以去哪里。如果信息架构设计不好，用户就会迷失方向。

信息架构通常通过以下方式来实现

• 网站地图
• 分类体系
• 元数据

常见的组织机制包括：

• 层级结构
• 分类 / 标签 / 筛选

菜单本身也是信息架构的一种体现， 菜单的层级结构帮助用户导航到相关的功能或条目。没有用户会喜欢那种内容杂乱、难以导航的网站。因为寻找所需信息非常耗时，人们往往宁愿直接离开网站，也不愿花时间去搜索自己想要的内容，即使这些内容本身可能很有价值，用户界面也设计得很好。

信息觅食理论

用户依赖可见的线索来判断如何以最小的努力实现自己的目标。对于信息获取任务，比如在网页上搜索信息，这种行为实际上可以被类比为动物在自然环境中觅食。

在自然环境中觅食的动物会提出类似的问题：

• 我应该在哪里觅食？
• 我应该吃什么（是难以捕捉但更大的兔子，还是更容易捕捉但不太能填饱肚子的小兔子）？
• 这个地方的食物是否已经被吃完、变得难以获取？我是否应该转移到一个更“有价值”的区域？

信息觅食理论认为，当我们在收集信息时，也会提出类似的问题：

• 我应该在哪里搜索？
• 哪些文章或段落值得阅读？
• 我是否已经从这个信息源获取到了足够的价值，是否应该转向下一个搜索结果或不同的搜索方式

信息觅食中的一个重要决策是：是否值得点击一个超链接——也就是这个“信息看起来是否足够“好吃”（值得继续探索）？

用户在做这个判断时，通常只依赖很少的信息——有时只是链接本身的文字，有时会结合一些上下文，例如：

• Google 搜索结果中的摘要文本
• 网站的域名
• 页面长度等

这些线索被称为“信息气味”（information scent）。 对于用户来说，获取“信息气味”的线索是一个逐步进行的过程，并且每一步的成本都在不断增加。有些属性可以通过“扫一眼界面”就迅速获得，例如：

• 识别界面中的可供性（affordances）（比如设计良好的按钮或超链接）
• 识别图标（例如放大镜代表搜索）
• 识别非常醒目且简短的文字（比如大号加粗的“Search”）

当需要更多努力时，用户会进入阅读阶段， 阅读显然比扫一眼更昂贵，因为它需要专注和思考。

• 长标签
• 帮助文本
• 搜索结果摘要

信息气味好的例子可以在经过精心设计的 Windows 控制面板（XP 风格）中看到。例如“Printers and Other Hardware（打印机和其他硬件）”。你可以思考一个问题：为什么“打印机”会被单独列出来？

很可能是因为任务分析（以及用户数据）显示，打印机配置是用户访问控制面板时最常见的原因之一。因此，把“打印机”直接放进标签中，可以显著增强这个入口对“寻找打印机设置”的用户的信息气味。

下面是一些例子，

第一个例子展示了网页设计中一个非常常见的问题：“click here（点击这里）”链接。超链接通常是页面中非常醒目、很容易被一眼识别的元素，因此它们应该清晰传达点击后会发生什么操作的具体信息气味。而“click here”这个词几乎什么都没有说明。

用户不会逐字阅读网页，他们通常只是快速扫描。 信息气味的质量取决于用户的具体目标。 对于一组目标来说信息气味很好的设计，可能对另一组目标就完全不适用。

例如，如果一个购物网站有“音乐”和“电影”分类，那么如果你要找“电影原声带”，你会去哪里？一种解决办法是：把它同时放在两个分类中，或者在每个分类中提供“相关内容”链接，让用户可以在层级结构之间横向跳转

信息觅食与信息气味

指示物与可供性

可供性（affordance）指的是一个事物的真实属性，主要是那些决定它“可以如何被使用”的属性。比如椅子具有适合坐的物理特性。

而“指示符”（signifier）指的是人们感知到的、用来提示某种可供性的特征。比如门把手的形状和大小暗示“可以用手抓住并旋转”；按钮的外观暗示“可以用手指按下”；滚动条则暗示“有一个你无法完全看到的内容区域可以被滚动或拖动”。指示符就是界面用来进行非语言沟通的方式，告诉你如何操作它。

指示符通常不是天生就能理解的，而是通过经验学习得到的。我们之所以知道椅子可以坐，是因为长期与椅子互动的经验。我们之所以知道列表框可以选择，是因为我们见过并使用过很多类似控件。

需要注意的是，指示符有时可能“误导”可供性。例如，一个用纸糊做的椅子外观上暗示“可以坐”，但实际上并不能承重——它会塌掉。相反，一个消防栓没有任何“可以坐”的视觉提示，因为它没有平坦、适合人坐的水平面，但实际上人仍然可以坐上去，虽然不舒服。

再比如闹钟界面中的文本框：它的提示（“在这里输入时间”）暗示可以输入文本，但实际上用户不能输入，只能通过“设置时间”按钮来修改时间。又比如 Norman 门把手：它的外观明显暗示“拉”，但门上的文字却写着“推”，也就是它实际支持的操作。一个好的用户界面应该让“指示符”和“真实可供性”保持一致。

最初在心理学中，“可供性”只指真实存在的物理属性。但当这个概念被引入人机交互（HCI）领域后，“被感知到的属性”也变得很重要。仅仅“客观上可以做某事”，但用户完全感知不到这种可能性，是一种不好的设计状态——严格来说，这甚至不能算是一个好的“可供性”。

比如想象一个房间，墙壁完全光滑，没有任何出口的痕迹：没有门的轮廓、把手、铰链或缝隙。但实际上墙里隐藏着一扇门，只要按对位置就能打开。从用户界面设计角度来看，这个房间“没有出口的可供性”，因为它没有向用户传达任何可以离开的信息。但从心理学或工程学角度来看，它确实“有出口可供性”，因为物理上是可以出去的，只是用户不知道。

Don Norman 是最早将“affordance（可供性）”引入设计与人机交互领域的人，他通过《设计心理学》推广了这个概念。但后来他也意识到，这个词同时表示“实际可用性”和“感知可用性”会造成混淆，因此他提出用“signifier（指示符）”专门表示“被感知到的可用性”，而把 affordance 保留给心理学中“真实存在的可供性”（Norman, 2008）。

反馈

易记忆性

识别 vs 回忆

重要的一点是要区分两种记忆方式：识别（recognition）和回忆（recall）。

识别是指在外界提示的帮助下进行记忆（也叫“外部世界中的知识” knowledge in the world）；而回忆则是在没有任何外部提示的情况下记住信息（也叫“头脑中的知识” knowledge in the head）。相比之下，识别要容易得多，甚至容易很多。

心理学实验已经表明，人类的记忆系统在“识别”方面强得惊人。在一项研究中，参与者快速浏览了 540 个单词，然后进行测试：他们需要从两组单词中判断哪个出现在之前的 540 个列表中。结果平均准确率达到了 88%！类似地，在另一项包含 612 个短句的实验中，参与者的平均正确识别率达到了 89%。

需要注意的是，由于这些实验涉及大量项目，它们显然已经超出了短时记忆的范围，即使没有刻意复述也能取得这样的效果。其他研究还通过延长学习与测试之间的时间间隔来验证这一点。

例如，在一项实验中，参与者快速观看了 2,560 张图片，然后在一年后进行测试——他们仍然能够以 63% 的准确率判断哪些图片曾经见过，这明显高于随机水平。还有一项实验：参与者学习一种人工语言 15 分钟，两年后进行测试，他们的表现仍然优于随机猜测。

概念模型

无论交互方式如何，学习一个新系统都要求用户建立一个关于该系统如何工作的“心智模型”（mental model）。而可学习性很大程度上取决于用户在构建这个模型时是否遇到困难。

在用户界面设计中，实际上需要关注不止一种“模型”：

• 系统模型（system model，有时也叫实现模型 implementation model）：系统真实的工作方式。
• 界面模型（interface model，也叫显式模型 manifest model）：系统通过用户界面呈现给用户的工作方式。
• 用户模型（user model，也叫概念模型 conceptual model）：用户自己理解系统是如何工作的方式。

例如，一部手机在用户看来提供了与传统有线电话相同的简单界面模型，尽管它的系统模型要复杂得多。当用户在移动时，通话可能会在不同的基站之间切换，但这些系统层面的细节对用户是隐藏的。

作为软件工程师，你对这个概念应该并不陌生：模块的接口向调用者提供一种操作模型，但其内部实现可能完全不同。

在软件工程中，这种“接口与实现的分离”被认为是管理复杂性和适应变化的重要手段。而在用户界面设计中，这种分离的价值更多体现在：界面模型应该更简单，并且尽量贴近用户对任务本身的理解模型。

需要注意的是，这里所说的“模型”比你在 MVC（模型-视图-控制器）模式中听到的“model”更抽象。在 MVC 中，model 是一个具体的软件组件（例如一个类或一组类），用于存储数据并实现应用行为。而这里的 model 是对系统工作方式的抽象描述。

在这个框架下：

• 系统模型可能描述 MVC 中 model 类的内部行为（比如用“行列表”存储文本）。
• 界面模型可能描述 view 类如何呈现这些数据（比如允许把换行符当作字符一样删除）。
• 用户模型则完全存在于用户的脑海中，并不是软件的一部分。

一致性

一个易学性的通用原则：一致性。它的基本意思是：不要让用户因为某个命令或界面的工作方式而感到意外。 意味着：

• 相似的事物应该外观和行为相同，不同的事物应该外观不同
• 能帮助用户轻松地将现有知识迁移到新的用户界面
• 他们可以根据过去的经验预测将会发生什么
• 便于发现和记住

一致性的种类可分为：

• 内部一致性
• 外部一致性
• 隐喻

隐喻一致

隐喻的一致性的优点是，能够融入用户的心理模型，恰当的话，学习起来非常容易；但是缺点是，设计师往往难以发现、可能具备误导和局限，最终失效。

上图是我们所熟知的，几个隐喻，桌面、回收箱等。

另一个重要的可学习性原则是：功能与控制之间要有良好的映射关系。主要分两种：

• 直接映射：控制布局 = 功能布局 比如灯的排列和开关的排列一一对应。
• 自然映射：不完全一致，但人可以用直觉/心理模型理解 比如汽车转向灯拨杆和转向方向之间的关系。

用词的内部一致

另一个经常被忽视的重要一致性类型是“用词一致性”。在用户界面中，应当始终使用相同的术语。

用词的外部一致

界面中的用词还需要“外部一致性”，也就是尽量使用用户自己的语言，而不是强迫用户学习一套新的“计算机语言”（术语太多的 Geek 语言）。技术术语应该尽量避免，因为它会让系统模型不必要地渗透到用户界面中。

这类似于系统设计原则：输入要宽松，输出要严格。