UIUX设计师必看：用户体验心理学全面学习指南用户体验中的变化盲视：定义

摘要： 由于人类注意力的局限性，当网页上的重大变化缺乏强烈提示时，用户可能不会注意到这些变化。

在可用性测试中，我们经常观察到用户会忽略屏幕上设计师认为明显且引人注目的变化。在可用性领域，如果你参与了设计，那么你就会知道要查找什么、在哪里查找、何时出现以及它意味着什么。因此，对于设计师来说，这些变化显而易见，并且在审查自己的设计时，你不会错过重要消息或数据对象的出现。但用户经常会错过。为什么？因为变化盲视是人类（以及原始人类）感知中存在了数百万年的事实，并且不太可能在短期内消失。

那么什么是变化盲视呢？在阿尔弗雷德·希区柯克有史以来最著名的电影之一《惊魂记》中，侦探阿博加斯特看着诺曼·贝茨的房子，它投射在黑暗无云的天空中。镜头移回到侦探的脸上，并在他开始走向房子时跟随他。场景仍然很暗，但天空突然布满了云彩。

无论天空纹理的变化是有意为之（可能是希区柯克对即将发生的事情的微妙警告）还是场景切换错误，大多数观众很可能都不会注意到它。电影通常在一个场景到下一个场景之间存在这样的小差异——背景、演员服装、化妆或位置的变化，但当这些变化发生在场景之间的剪辑过程中时，它们就会被忽略。

这种现象被称为变化盲视，它超越了电影——它适用于人们通常如何感知场景，无论是在屏幕上还是在现实生活中。变化盲视非常顽固：即使人们被警告可能会发生变化，场景中的变化也可能被忽视。

定义：变化盲视是指人们倾向于忽略场景中发生在远离他们注意力焦点的区域的变化。

在心理学中，变化盲视可能最好地通过 20 世纪 90 年代中期进行的一系列实验来说明。在这些实验中，向参与者展示了一张复杂场景的图片约半秒钟；然后显示屏会变成空白一小段时间，最后再次显示相同的图片。但是，第二次显示场景时，一些细节被修改了——例如，一个物体改变了大小、颜色，或者添加或删除了一个元素。实验中的参与者应该识别两张图像中的变化。在其中一些研究中，人们在两个版本之间循环多次，直到他们能够检测到变化。许多人需要 20 或 40 次交替才能找到它。

显示器的闪烁特性（一个场景，然后是空白屏幕，最后是看似相同的场景）是变化盲视的一个基本组成部分。在电影中，场景剪辑起到了闪烁的作用；并且，在与计算机交互时，闪烁是由用户按下按钮后加载新页面（或 UI 元素）引起的。但事实证明，闪烁不必是字面上的——当用户眨眼或扫视（当她的眼睛移动到屏幕的另一个区域时）时发生的场景修改也很容易受到变化盲视的影响。

魔术师利用人类在眼睛移动时容易产生变化盲视的倾向：他们使用吸引注意力的装置使眼睛移动到该点，同时进行对其技巧至关重要的未被注意到的动作。

为什么会发生变化盲视？

发生变化盲视的根本原因是我们注意力容量的限制。任何复杂的场景都有大量的细节，人们很难也不可能关注所有细节。我们通常做的是走捷径。

变化对人类来说一直很重要——它可以传达有关我们环境的重要信息。自然界中的大多数变化都是由运动介导的（除了变色龙等少数例外，物理对象不可能在没有任何运动的情况下瞬间发生变化），而人类的周边视觉很容易检测到运动。一旦人眼检测到外围的运动，它们就会看向运动的来源——中央视觉开始起作用，并提供补充的详细信息。这种行为是我们野外生活的遗留物，任何动作都可能预示着捕食者在等待猎杀我们。

当运动作为变化的提示很弱或完全不存在时，就会发生变化盲视。当屏幕闪烁时，运动会被屏蔽掉——我们看到的是场景的两个静态版本。找出发生了什么变化的唯一方法是检查前后版本中所有对应的元素并进行比较。这项任务非常困难——不仅检查场景中无数的小细节很乏味，而且我们对场景先前版本的记忆很可能相当糟糕。事实上，我们很可能根本就没有注意到该场景中的许多元素。

但变化盲视也发生在眼球运动过程中。换句话说，如果两个（可能是运动提示的）变化相互竞争——就像在魔术表演中，一个变化通常会获胜并吸引眼球，但这种眼球运动会阻止对第二个变化的检测。这个原因在界面设计中尤其重要。

界面设计中的变化盲视

在与用户界面（UI）的正常交互中，当一个新元素（例如，产品图像轮播中的不同图像，或下拉菜单的内容）由于用户操作而出现在屏幕上，并且屏幕的其他区域也发生变化时，经常会发生变化盲视。变化的焦点应该是直接响应用户操作的可视化设计元素，并且用户将视线移向该方向——但实际上，变化遍布屏幕的多个区域。

例如，当用户点击 Aldiko 安卓应用程序中的汉堡菜单时，他们希望屏幕上的变化与该操作相关——也就是说，新元素将位于包含菜单内容的区域内。他们的眼睛会停留在该区域周围，并且不太可能注意到屏幕右上角的操作溢出按钮已被搜索图标取代。

适用于 Android 的 Aldiko：打开菜单时，屏幕右上角的控件将被放大镜取代。搜索工具将被忽视，因为 (1) 人们会查看展开的菜单，这是他们操作的直接结果；(2) 他们会期望屏幕的其他元素保持不变（就像他们在与大多数 UI 交互时通常所做的那样）。

在其他地方，我们讨论了为什么不应该在桌面上用搜索图标替换搜索框；然而，在移动屏幕上，该模式比在桌面上更有用，因为我们的研究表明，即使没有搜索框，放大镜工具也相当容易找到。但是，如果默认情况下搜索框不可见，则当用户点击搜索图标时，文本字段应显示在其旁边（而不是在屏幕上相距较远的位置），以确保人们不会错过它。

德州农工大学不仅用搜索图标替换了搜索字段，而且还将搜索文本框显示在远离搜索图标的位置。英雄图像的动画与搜索框的显示相冲突。

约翰霍普金斯大学也使用了动画英雄并将搜索隐藏在一个图标下。但至少它在搜索图标附近显示了搜索框，并使移动的背景变暗，以减少一些相互竞争的动画。

出现在页面顶部的半持久性导航栏或浮动按钮也有可能被忽视，因为页面的滚动经常会遮挡它们。例如，当用户开始向上滚动时，半持久性导航栏会出现在屏幕顶部。希望人们会注意到这些栏并选择其中的一个选项，而不是一直向上滑动到页面顶部。不幸的是，页面的移动很容易阻挡栏出现引起的移动，尤其是当栏的颜色与页面的颜色融为一体时，如下面的《纽约时报》示例所示。

适用于 iPhone 的纽约时报：当他们开始向上滚动时，人们可能会错过出现在屏幕顶部的半持久性导航栏，因为他们专注于页面的滚动。一个加剧因素是导航栏的视觉效果与页面内容没有足够的区分度。

《芝加哥论坛报》的移动网站也使用半持久性导航栏，当人们开始向上滚动时，该栏会出现在页面顶部。但是，在这种情况下，栏的视觉设计使其更加突出。

（我们的周边视觉负责识别运动和阴影。当页面的“阴影”轮廓发生变化时，例如因为一个对比色的大色块出现在一个角落，我们更容易检测到它的出现，而不是当同一个色块巧妙地融入页面的其余部分并且没有显著改变页面的阴影轮廓时。）

还有许多其他设计方面可能会受到变化盲视的影响——错误消息或其他通知、出现过快的结果，或者不断变化的导航栏也可能由于这种现象而被忽略，如我们关于同一主题的配套文章中所述。

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

要避免变化盲视，请分析您的设计中是否存在可能同时发生并可能分散彼此注意力的任何竞争性变化。以下是一些执行此操作的技术：

• 一次只做一个更改。在上面的 Aldiko 示例中，搜索可以放置在右上角并始终可见。
• 将所有将同时更改的元素分组在屏幕的同一区域中，以确保运动会吸引人们对所有元素的注意。例如，Aldiko 设计的另一个简单解决方案是将搜索移至菜单内。（但请注意，将搜索隐藏在菜单下会严重影响其可发现性，并且可能只在浏览量大的网站上可以接受。）
• 使用动画来表示更改，但要避免屏幕上出现太多相互竞争的动画，以防止注意力分散。
• 使屏幕上未更改的区域变暗，以吸引人们注意更改。
• 如果您在用户滚动时向页面添加浮动元素，请将它们显示在用户注意力焦点附近（例如，对于返回顶部按钮_，则位于页面底部）并使用与页面其余部分形成对比的颜色。

参考文献

Ronald Resnick. 2002. Change Detection. Annual Review of Psychology, 53, p/245-277. Ronald Rensnick. 2005. Change Blindness. In In McGraw-Hill Yearbook of Science & Technology. pp. 44-46.

原文：https://www.nngroup.com/articles/change-blindness-definition/