模式是一个经常被误解的UI概念:它们经常与相同数据的不同视觉表示或位于应用程序的单独部分的特性相混淆。即使用户体验实践者知道什么模式是正确的,他们也会和许多著名的用户体验者争论它们的正确使用提倡非模态接口.然而,如果执行得仔细和周到,模式可能是有益的和有帮助的。

定义

定义:模式是系统对用户输入的不同解释,取决于激活的状态。相同的输入,不同的结果。

模式最经典的例子是使用大写锁定典型键盘上的键大写锁定关闭键,按下字母的键一个在文本编辑器中将显示小写字母一个.与大写锁定在,相同的操作将导致大写一个.因此,Key是一个模式切换器。

一个全大写文本的文本编辑器窗口
模式的一个例子:在Mac TextEdit,大写锁定键将相同的用户输入转换为不同的输出。

一个系统是非模态的如果相同的用户输入总是有相同的结果,而不管系统状态如何。

模式为什么有用

当我们想要提供给用户太多不同的选择,而没有足够的输入类型来容纳所有的选择时(以一种可用的、可发现的和明智的方式),模式就变得有用了。

例如,在像Photoshop这样的图像编辑应用程序中,让标准的鼠标点击具有许多不同的功能是很有用的,因为能够指向图像的特定部分对于这些功能是至关重要的——其他输入类型(如键盘命令)是不合理的。因此,使用模式切换工具(如字幕、钢笔、魔棒、橡皮擦和所有其他工具栏图标)来改变鼠标左键单击的结果。

两个photoshop窗口,在不同的工具模式下显示不同的光标外观
在Photoshop中,工具(顶部)和快速选择工具(底部)是不同的模式:如果时,单击鼠标左键将一个彩色补丁添加到屏幕上;如果快速选择激活时,系统会选择它认为是照片中的物体(例如,这个截图中的天空)。Photoshop通过几种方式显示激活模式:光标图标改变,与激活模式相对应的工具栏图标变暗,窗口顶部的上下文面板显示与激活模式相关的选项。

常见模式错误和可用性问题

模式会导致一系列可用性问题,包括模式滑倒(当用户不知道当前的活动模式时发生)和可发现性低使用模式特定的特性。

模式滑移的发生是因为系统不清楚表明其状态对用户来说,违反第一条10个可用性启发式.模式错误是我们学科中一个长期存在的问题,特别是在复杂的系统中,可能会产生致命的后果。众所周知,1991年,由于模式错误,一架飞机撞山了在不同的模式下,同样的控制可以用于下降的程度或速度,但目前还不清楚哪个模式是有效的。不幸的是,飞行员想要的3.3度下降角度被系统解释为负垂直下降速度3300英尺/分钟——这都是因为输入这些数字是用了相同的控制,仪表盘上没有清晰的模式指示器。

另一个更常见的模式错误涉及电子邮件,不幸的是,在我遇到的每一个电子邮件应用程序中仍然存在:可怕的模式错误回复所有人而不是回复发送方。自电子邮件发明以来,这种模式就一直存在,但至今仍未得到解决,尽管它给各地的用户带来了尴尬(并激发了建议文章)如何处理这一灾难性的失误).如果你想做真正有影响力的用户体验工作,那就想出一个解决问题的设计回复所有人彻底的错误。你将为人类节省数十亿小时的寿命。

通过以下几个关键的设计考虑,可以减少模式卡瓦:

  • 清除当前活动模式的可见性。使用强烈的视觉信号,如不同的背景,强调活动模式指示器(如高对比度高亮或边框),或改变光标以表明哪个模式是活动的。冗余指标是一个明智的想法:我们强烈建议至少两个视觉指标(如突出的组合mode-selector控制结合光标变化)的模式是活跃的,以确保用户意识到当前活动模式,即使他们并不是完全集中注意力。
  • 指示模式的效果。明确命名的模式、模式选择器图标的文本标签,以及帮助确定模式激活时会发生什么的工具提示,这些都有助于用户理解模式的作用。
  • 当模式滑脱可能产生不安全的后果时,完全避免模式(如意外丢失工作、删除数据、尴尬,或物理安全后果)。即使两个功能在概念上是相似的(比如前面提到的飞机的下降控制),如果不小心把它们混在一起会造成真正的伤害,那就选择其他的设计方案——比如两个独立的控制。
  • 建设性的错误消息当您可以推断某个用户操作最有可能用于不同的模式而不是当前活动的模式时。一个典型的例子是输入密码大写锁定是活跃的:用户可以输入全部大写字母的密码而没有意识到它在系统面具密码输入.然而,系统知道在文本输入期间,大写和小写字符被交换了,并可以警告用户停用大写锁定然后再试一次(或者通过显示一个符号来防止错误发生)大写锁定键是活动的同时打字)。
  • 确认对话框这清楚地解释了计算机将要做什么,同时可能提到了当前模式。和往常一样,应该谨慎使用确认,否则它们不会有任何好处,因为用户会不假思索地回答是的如果你让他们确认太多次。但是当可用性测试、分析或其他数据表明人们可能会忘记他们所处的模式时,确认对话框可能是拯救用户的最后机会。
具有在编辑模式下的行的表,可以清楚地以可视方式表示
Telerik在该表中使用几个清晰模式指示器以冗余方式显示所包含的行编辑模式:行的背景有不同的颜色,数据表示为表单字段,操作按钮改变位置和颜色。

模式的另一种选择是弹簧模式(也称为准模);这些模式只有在修饰符被激活时才会被激活。例如,按住转变键盘上的键相当于弹簧大写锁定密钥-准模式只有当转变正在按键。准模式可以防止模式滑脱,但使用户不太可能发现与这些模式相关的特征。(当然,当用户希望在扩展的操作集中保持模式时,弹簧加载模式的效率也较低。也就是说,有多少次你真的想输入一个全大写的文本句子,这是主要的情况下大写锁定比弹簧加载的效率更高吗转变关键。)

可发现性问题和模式

模式也让新用户很难找到和记住某些功能或命令的位置。如果一个特性或命令只在一种模式下对用户可用,那么用户自然地遇到它的可能性(称为可发现性)或者以后能够找到它(称为可寻性)比始终可用的功能要低得多。

例如,我有一副蓝牙耳机,当我戴着它的时候,它可以屏蔽大部分外界的声音。它们有一个有用的切换,允许我有选择地通过一些当我需要的时候,比如当我走在繁忙的街道上的时候,我就会听到外面的声音。当我在听音乐时,我通过双击耳机上的按钮来切换这种模式,它会关闭或打开耳机,并发出一声很短的“哔”声作为听觉反馈。

这种环境感知功能也可以在打电话时派上用场,因为它减少了说话时听到自己声音很模糊的奇怪感觉。然而,当我打电话时周围有很大的噪音(我住在纽约,那里经常有很大的噪音),我经常想要关闭这个功能。不幸的是,当你处于电话呼叫模式时,双击控制不起作用——在这种情况下,双击按钮除了发出声音反馈的哔哔声外没有任何作用。当我分心时(我的注意力集中在对话上,而不是耳机的UI上),我花了很长时间才弄明白发生了什么——我遇到了一个与耳机模式相关的重大搜索问题。

情态动词:情态动词的一种特殊情况

模态窗口是一种特定类型的模式;它们以弹出窗口或滑过面板的形式呈现,并且它们限制了用户与模态背后的内容交互的能力,即使这些内容仍然是可见的(通常是变暗的)。模态窗口或对话框要求用户在返回之前所做的任何事情之前与它们进行交互。模态将用户输入限制在其窗口内,直到它被取消。如果用户点击或点击模态背后的背景(试图与内容交互),模态可能会被忽略或什么都不会发生。因此,模态窗口将界面移动到一种特殊的模式,在这种模式下,相同的输入(在后台单击链接)根据模态是否激活产生不同的结果。

一个网站与模态弹出覆盖内容背后
Wired.com显示了一个经典的模态窗口——用户仍然可以看到,但不能与弹出窗口下方的内容交互。点击变暗的背景区域没有效果(并且不会关闭模态窗口)。

重要的是,并不是所有的弹出窗口都是模态的——如果用户仍然可以与下面的内容进行交互,那么窗口就不是模态的(很多)GDPR-遵从性弹出窗口是非模态的,这至少让它们稍微不那么烦人)。情态模态是一种重量级的设计选择,只适用于真正的用户必须与他们交互以继续当前的任务。

一个非模态弹出在一个网站
TheNextWeb.com有一个非模式的符合gdp的弹出窗口(“有一个cookie”),因为当弹出窗口仍然可见时,用户仍然可以与背景内容进行交互。

什么模式不

不是数据空间的不同视图

模式并不是看待相同数据的不同方式。例如,在Mac Finder中,列表视图和图标视图采用相同的数据(存储在计算机上的文件和文件夹),但以不同的方式显示它们,列表视图显示图标视图中没有的额外元数据。然而,相同的用户输入在这两种情况下具有相同的效果:单击一个对象突出显示它,双击它打开它。在这两种情况下,相同的输入具有相同的效果,因此图标和列表视图不应被视为不同的模式,而应视为数据空间的不同视图。

两个Mac Finder窗口在两个不同的视图(不是模式)中运行相同的文件夹结构
Mac Finder中相同数据的两个视图是不同的模式,即使图标视图(顶部)没有显示列表视图(底部)中可见的所有元数据。相同的用户输入(单击其中一个项)在两个视图中产生相同的效果:选择并突出显示该项。

然而,即使是这个简单的接口也包括对模式的访问。通常情况下,在任意一个视图中键入字母都会根据它们的名称突出显示其他项目。但是,如果您单击文本标签一次,在项目已经选中并高亮显示之后,项目的名称将切换到编辑模式。此时,输入将更改项目的名称。因此,即使图标和列表视图本身不是模式(只是数据的不同视图),它们都包括对其他模式的访问(分别导航和编辑)。

总结

模式对于管理大量特性非常有用,这些特性都可以从使用相同的输入控制中受益。如果输入控件的总数是有限的,如在物理设备有限数量的按钮,或者几个行动最好由相同的输入信号(例如,滚动和画都表示通过拖动手指在触摸屏),使用模式将是一个适当的设计选择。然而,必须清楚地指出当前的活动模式,具有强烈的视觉差异,模式不应该在模式错误可能产生灾难性后果的关键场景中使用。

在我们的全天学习更多必威手机app下载Web和桌面应用程序设计课程。

参考文献

人性化的界面,杰夫拉斯金,2000

Asaf Degani。”人机系统建模:模式、错误和交互模式。乔治亚理工学院工业与系统工程学院博士论文,1996。