[译文]用户界面设计中的自然映射和刺激-响应兼容性

1/15/2019 ☼ UXUI自然映射刺激-反应兼容性译文

总结:为了更快速的传达用户输入和结果之间关系的设计,通常采用自然映射或具有高刺激-响应兼容性。

你可曾玩过那种反向控制的电子游戏?也就是那种左右对调的控制方式。如果你曾经玩过,你会知道那有多么困难。这就是一个刺激-响应不兼容的例子。

早在20世纪50年代,心理学家 Paul Fitts (在人机交互中以他的名字命名的费茨定律享有盛名)和 Charles Seeger 进行了一系列实验来证明这个概念。他们要求人们通过按下两个按钮来对出现在左侧或是右侧的刺激做出反应:

  1. 在一种情况下,刺激和响应位于同侧:当刺激出现在左边时,人们必须用左手按下左边的按钮(当刺激出现在右边时,人们用右手按下按钮)
  2. 另一种情况是,刺激与响应位于对侧:当刺激出现在左侧时,参与者必须用右手按右边的按钮,反之亦然。

Fitts 发现,在第一种情况下,参与者的反应速度更快,呈现出刺激-响应兼容性。 定义:刺激-响应兼容性是指刺激的物理布置与预期响应的位置相匹配的程度。

刺激-响应兼容性与设计高度相关。当一个对象或者一个接口违反了它,它的可用性就会大大降低。

考虑一下这两个炉子。哪个旋钮控制哪个燃烧器?一个路子会让你对你的猜测更有信心吗?

左边的是一个典型的 2 x 2 的网格中布置的燃烧器,控制旋钮在底部对齐成一行。这种设计使用户很难猜测哪个旋钮控制哪个燃烧器(没有刺激-响应兼容性)。而右边的那个,底部控件的排列对应了五个燃烧器的排列位置,因此具有更高的刺激-响应兼容性。

再来看我不久前在火车站售票机上拍的这张照片。用信用卡付款后,机器要求我输入邮政编码作为安全验证。但是,让我感到困惑的是,黄色的编号按钮是不可触摸的。我目瞪口呆地反复点击屏幕上的黄色数字,在想是不是屏幕发生了假死,或者程序的反应时间太慢。然而,我忽然注意到屏幕的外侧两边还有一列金属按钮。每列编号为 1 - 6。更让我感到吃惊的是,当我按下右边标有“1”的按钮后,邮政编码的输入框内出现了一个“6”。按下标有“2”的金属按钮后,输入框内又出现了一个“7”。我简直不敢相信。按一个数字会出现另一个数字,这在身体上和认知上都是极不自然的。我按下每个按钮的反应迟钝就是刺激-响应不相容的直接后果。

低刺激-响应兼容性的一个例子就是这个火车售票机,在这个机器中,用户必须按下一个按钮,上面标注的数字与实际想要的数字不相符(例如,按下右侧标有数字1的金属按钮,屏幕上就会出现数字6)

自然映射

刺激-响应兼容性的概念可以扩展到空间维度之外。这正是 Don Norman 在他的《设计日常用品》一书中所做的。

定义:自然映射是指系统的控件表示或对应于预期的设计。当控件映射到将要产生的动作时,系统学习起来会更快,记忆起来也更容易。

自然映射架起了执行鸿沟的桥梁,帮助用户理解如何使用系统以及需要采取哪些操作来实现其目的。设计师可以通过几种方式创建自然映射,包括以下三种常见模式:

  1. 空间相似性。这种模式与刺激响应兼容性非常相似。通过在空间布局中安排控件,模仿设计布局,用户可以更快地理解系统。例如,下面的屏幕截图取自 Mac 上的显示设置菜单。当连接多个显示器时,显示排列屏幕允许用户重新排列屏幕上显示器的位置,以匹配物理显示器的实际位置。对于在扩展屏幕上工作的用户来说,这种相似的布局帮助他们快速地将文件从一个显示器拖动到另一个显示器,因为桌面的布局完全映射到显示器的排列方式。

排列屏幕显示器(左图)来模拟物理显示器(右图)的布局是自然映射的一个例子,它帮助用户在工作时在显示器之间有效地移动

  1. 概念上或隐喻上的相似性。有些设计利用了一个普遍接受的隐喻,并将其作为设计决策的基础。如果做得好,这些隐喻性的映射可以使系统的功能更加透明,参考 iOS 控制中心的亮度。在控制面板上向上滑动可以增加屏幕亮度,而在控制面板上向下滑动则会使屏幕变暗。这种安排是因为强烈的文化隐喻“上升意味着更多”,概念上映射的“更高(亮度)”。此外,亮度控制填充了白色背景色,这也在概念上映射到亮度级别(想象一下,如果填充是反向的;也就是说,如果黑色填充表示更大的屏幕亮度。)这样感觉会极不自然。或者,也可以通过颜色,与特定的行为联系到一起。例如,在西方世界,“绿色代表前进”,“红色代表停止”设计人员可以利用这些隐喻来创建自然映射。请注意,图形的有效性在很大程度上取决于文化和社会习俗。

iOS 控制中心的亮度控制使用自然映射,向上滑动会提高屏幕亮度,向下滑动会使屏幕变暗。

  1. 行为相似性。用户通常对他们执行一个操作时会发生的事情有所预期,而这些预期通常是由他们的目标所决定的。行为相似性是另一种形式的系统反馈,其中界面响应的方式类似于用户执行的动作。例如,当用户有兴趣查看他们的手表时,他们通常会通过移动和倾斜他们的手腕来看得更清楚。这种行为被智能手表的设计者加以利用,作为“抬起以唤醒”的手势。对于用户“唤醒”设备,所需要的仅仅是转动手腕,看着表盘。该设备检测移动并解释用户的交互意图。该行为是如此的自然,以至于用户不必为了打开设备的屏幕而采取一个单独的操作:唤醒命令已经成为了一个非命令用户界面。

请注意,尽管手势操作在设备与应用中,正在变得越来越普遍,但它们仍然对用户的认知负荷产生挑战。许多手势是不自然的,它们与用户试图完成的行为无关,因此它们更难被发现、记忆和执行。一个例外是触摸板上的旋转手势,这与现实生活中人们旋转照片的方式类似。但是那些需要复杂互动的手势,比如两个、三个或四个手指的敲击或滑动,对于普通用户来说就太难以正确学习和记忆。当创建一个手势时,设计师必须考虑自然映射,如果他们有任何手势希望被用户所使用。

触摸板上的旋转手势(左)能够自然映射到人们如何在现实生活中旋转一个物体。然而,许多手势,比如四指滑动和三指点击,并没有清晰地与正在执行的动作联系在一起,因此它们对于用户的学习和操作是一个挑战(图片出处:https://support.apple.com/en-us/ht204895

总结

对于一个易于学习的系统,人们需要迅速理解它是如何工作的,什么操作是可能的,以及如何实现他们的目标。具有高刺激-响应兼容性并利用自然映射的设计可以帮助用户更快、更自信地采取行动。

参考

Fitts, P. M., & Seeger, C. M. (1953). S-R compatibility: spatial characteristics of stimulus and response codes.” Journal of Experimental Psychology, 46(3), 199-210. Lakoff, G. & Johnson, M. (2003). Metaphors we live by. Chicago: University of Chicago Press. Norman, D. (2013). The design of everyday things. New York, New York: Basic Books.

原文地址:https://www.nngroup.com/articles/natural-mappings/


All Rights © Justin Bibi, 2018. Please do not use without permission.