在可用性测试中,我们经常观察到用户忽略了屏幕上的变化,而设计师认为这些变化是显而易见的。在可用性方面,如果你做过设计,你就会知道什么寻找,,在哪里去寻找它,什么时候它会出现,它是什么方法. 所以是的,它是明显的对你当您回顾自己的设计时,您不会错过重要消息或数据对象的外观。但用户经常这样做。为什么?因为改变的盲目性,这是人类(和原始人类)感知的一个百万年前的事实,而且不可能很快消失。

那么什么是变化盲症呢?在阿尔弗雷德·希区柯克的书中心理《阿博加斯特侦探》是有史以来最著名的电影之一,他在乌云密布的天空中看着诺曼·贝茨的房子。摄像机移回到侦探的脸上,跟着他向房子走去。场景仍然很暗,但天空突然变得乌云密布。

天空纹理的变化是否是有意的(也许是希乔克对未来的微妙警告)或者是一个连续性错误,大多数观众可能不会注意到。电影在一个场景到下一个场景之间通常会出现类似这样的小不一致——背景、演员服装、化妆或姿势的变化,但在场景之间进行剪辑时,这些变化会被忽略。

这种现象被称为变化盲症,它超越了电影——它适用于人们对场景的总体感知,无论是在屏幕上还是在现实生活中。对变化的盲目性是非常强烈的:即使当人们被警告可能发生变化时,场景中的变化也可能无法被察觉。

释义变化盲指当场景发生在远离其关注焦点的区域时,人们忽视场景变化的倾向。

在心理学中,20世纪90年代中期进行的一系列实验或许最能说明变化盲症。在这些实验中,参与者被展示了一幅复杂场景的图片,持续了大约半秒;然后显示器空白了几分之一秒,最后又再次展示了同一幅图片。然而,第二次,场景出现了如图所示,一些细节被修改——例如,一个物体改变了大小、颜色,或者添加或删除了一个元素。实验参与者被要求识别这两幅图像中的变化。在其中一些研究中,人们多次循环浏览这两个版本,直到他们能够检测到变化。对于许多人来说,这需要20或更长的时间40个备选方案才能找到它。

显示屏的闪烁质量(一个场景,接着是空白屏幕,接着似乎是同一个场景)是变化盲视的一个重要组成部分。在电影中,过场动画起到了闪烁的作用;在与计算机交互时,闪烁是由于用户按下按钮后加载新页面(或UI元素)而引起的。但事实证明,闪烁并不一定是字面意义上的——当用户眨眼或扫视(当她的眼睛移动到屏幕的另一个区域)时发生的场景修改也非常容易发生变化失明。

魔术师利用人类在眼睛移动时改变失明的倾向:他们使用吸引注意力的装置使眼睛移动到该点,同时,进行对他们的魔术至关重要的未被观察到的动作。

为什么会发生变化盲症?

变化盲症发生的根本原因是我们的注意力能力受到限制。任何复杂的场景都有大量的细节,人们很难关注所有细节,而且效率低下。我们通常做的是走捷径。

变化对人类来说是而且一直都很重要——它可以传达有关我们环境的基本信息。自然界的大多数变化都是由运动介导的(只有少数例外,如变色龙,一个物理物体不能在没有运动的情况下瞬间改变),运动很容易被人类的周边视觉检测到。一旦人类的眼睛检测到周围的运动,他们就会看到运动的源头——中央视觉开始起作用,并提供补充的详细信息。这种行为是我们在野外生活的残余,在那里,任何行动都可能发出捕食者等待捕杀我们的信号。

当作为变化线索的运动很弱或完全没有时,就会发生变化盲视.当屏幕闪烁时,移动被移出——我们看到场景的两个静态版本。找出更改内容的唯一方法是检查前后版本中的所有对应元素并进行比较。这个任务是非常困难的——不仅是检查场景中无数的小细节是乏味的,而且是我们的记忆力之前版本的场景可能会很差。事实上,我们很有可能根本没有注意到那一幕中的许多元素。

但是变化盲也会在眼球运动中发生。换句话说,如果两种变化(可能是由运动引起的变化)相互竞争——就像在魔术表演中一样,一种变化通常会胜出并吸引眼球,但这种眼球运动阻碍了对第二个变化的察觉。这个原因在界面设计中尤为重要。

界面设计中的变更盲目性

在与UI的正常交互中,当新元素(例如产品图像中的不同图像)出现时,通常会发生更改盲旋转木马的内容下拉菜单)显示在屏幕上的结果,用户的操作和屏幕的其他区域也改变。改变的轨迹应该是直接响应用户动作的可见设计元素,用户的眼睛会朝那个方向移动——但事实上,改变是分散在屏幕的多个区域。

例如,当用户点击汉堡菜单在Aldiko的Android应用程序中,他们希望屏幕上的变化与该动作相关,即新元素将被定位在包含菜单内容的区域。他们的眼睛将停留在该区域,他们不太可能注意到屏幕右上角的动作溢出按钮已被替换d带有搜索图标。

Aldiko for Android:当菜单打开时,屏幕右上角的控件会被放大镜取代。搜索工具不会被注意到,因为(1)人们会看到扩展的菜单,这将是他们行为的直接结果;(2)他们希望屏幕的其他元素保持不变(正如他们通常在与大多数UI交互时所做的那样)。

在其他地方,我们讨论了搜索框不应该被桌面上的搜索图标所取代;然而,在移动屏幕上,这种模式比在桌面上更有用,因为我们的研究表明,即使没有搜索框,放大镜工具也相当容易被发现。但是,如果默认情况下搜索框不可见,当用户单击搜索图标时,文本字段应显示在其旁边(而不是在屏幕上显示得更远),以确保人们不会错过它。

德克萨斯农工大学不仅用搜索图标替换了搜索字段,而且还显示了远离搜索图标的搜索文本框。英雄形象的动画与搜索框的显示相竞争。
约翰·霍普金斯大学还使用了一个动画英雄,并将搜索隐藏在一个图标下。但至少它在靠近搜索图标的地方显示了搜索框,并使移动的背景变暗,以减少一些相互竞争的动画。

出现在页面顶部的半永久性导航条或浮动按钮也有被检测不到的危险,因为页面的滚动常常会掩盖它们。例如,当用户开始向上滚动时,半永久性导航条会出现在屏幕顶部。希望人们会注意到这些导航条并选择它们ect是其中的一个选项,而不是将其滑动到页面的最顶端。不幸的是,页面的移动很容易阻止条的幻影引起的移动,特别是当条的颜色与页面的颜色混合时,如下面的《纽约时报》示例中所示。

《纽约时报》iPhone版:当人们开始向上滚动时,可能会错过屏幕顶部出现的半永久性导航栏,因为他们专注于页面的滚动。一个恶化的因素是,导航栏的视觉效果与页面内容没有足够的区别。
《芝加哥论坛报》的手机网站也使用了半持久导航条,当人们开始向上滚动时,导航条就会出现在页面顶部。然而,在这种情况下,酒吧的视觉设计使它更加突出。

(我们的周边视觉负责识别运动和阴影。当“阴影”出现时页面的配置文件会发生变化,例如,因为一个角落中出现了一大块对比色,所以我们更容易检测到它的外观,而不是当同一块与页面的其余部分巧妙地混合在一起时,并且不会显著改变页面的阴影配置文件。)

还有许多其他的设计方面也会受到变化盲目性的影响——错误消息或其他通知,结果出现过快,或更改导航栏也可能由于这种现象而被忽略,正如我们在关于同一主题的配套文章

如何防止界面设计中的变化盲目性

为了避免变化盲目性,分析你的设计中可能同时发生的、可能会分散注意力的任何竞争变化。以下是一些技巧:

  • 使一次换一个. 在上面的Aldiko示例中,搜索可以放在右上角,并且始终可见。
  • 将所有将要改变的元素分组同时在屏幕的同一区域,以确保运动将注意力吸引到所有人。例如,对Aldiko设计的另一个简单的修复是将搜索移动到菜单中。(不过要注意的是,将搜索隐藏在菜单下会严重影响其发现性,而且可能只在浏览量较大的网站上可以接受。)
  • 使用动画发出改变的信号,但要避免在屏幕上出现过多相互竞争的动画,以免分散注意力。
  • 调暗屏幕上的区域那就不要改变,以引起人们对变化的注意。
  • 如果要添加浮动元素到用户滚动时的页面,将它们显示在用户关注的焦点旁边(例如,朝向页面底部的返回顶部按钮),并使用与页面其余部分形成对比的颜色。

参考文献

罗纳德·雷斯尼克。2002变化检测。心理学年度回顾,53,p/245-277。

罗纳德·伦斯尼克。2005。改变失明。在麦格劳·希尔科学技术年鉴.44-46页。