UI设计

认知心理学与交互设计(4)--边界视觉

作者:口袋使者 2016-10-26 我要评论

有边界视觉,自然也就有中央视觉。两者的区别是,中央视觉的分辨率,获取信息量、处理速度都高于边界视觉。高到什么程度呢,中央视觉的分辨率比一般相机都高,就...

有边界视觉,自然也就有中央视觉。两者的区别是,中央视觉的分辨率,获取信息量、处理速度都高于边界视觉。高到什么程度呢,中央视觉的分辨率比一般相机都高,就是我们平时看东西的感觉,但是边界视觉相当于你透过有水雾的玻璃看东西,甚至于根据有关定义,边界视觉的视力相当于盲人的级别。获取信息量的话,中央是直接无损传递给大脑的,边界是经过压缩的。处理速度上,中央区域占整个视网膜面积的1%,但是用了大脑视觉皮层的50%来处理。相应的,99%的边界区域只能使用剩下的50%。

那么第一个问题就是,为什么我们平常感觉不到这种区别。原因很简单,我们的眼睛是以大约每秒三次的速度在不断快速移动,将焦点投射到周围空间,同时大脑会基于我们的认知和期待做出适当的补充。
有一个实验可以很直观地说明这个原因:当你在看一个网页时,电脑通过追踪你的眼球知道你现在中央区域所看的位置,于是在相应的区域显示有意义的内容,其他区域则显示随机的无意义的文字,随着眼球的运动,中央视觉关注的区域不断更新保证有意义,其他地方则仍然是随机的。结果表明,人们并不会注意到这些变化,他们会觉得阅读的是一整页有意义的信息。

第二问题就是,边界视觉的作用是什么,既然存在,那肯定是有原因的。边界视觉有三个功能:引导中央视觉、察觉运动、以及让我们在黑暗中看得更清楚。黑暗中的视觉涉及到视锥细胞和视杆细胞,而且对界面设计没什么参考作用,这里就不做介绍了。下面就来介绍边界视觉的前两个功能及其在界面设计中的作用。

引导中央视觉

前面提到眼球是以每秒3次的速度移动,移动的位置主要就是根据边界视觉提供的线索。比如你想去市场买草莓,边界视觉一旦注意到有红色的物体,就会引导我们的眼球去关注,虽然有时并不是草莓,而是其他红色的东西。

察觉运动

这个可以追溯到我们的祖先,猎物的速度是很快地,所以我们需要边界视觉去察觉,然后快速调动眼球去关注,或者做出其他反应。

这两个功能其实是有点重叠的,总的来说,虽然我们可以有意识、有目的地移动眼球,但是控制它们往哪里看的机制是潜意识的、自动的、快速的。

在界面中一个相关的例子就是提示信息的显示,有时候你点了一个按钮,然后等了好一会都没有反应,试了几次之后还是不行。最后你重新查看前面的信息,发现原来是出现了一个错误,只是你一直没注意到。一个原因是距离太远了,另一个原因是虽然近,但是不够明显,后者往往被忽视。

下面的例子中,虽然错误信息的位置离输入框很近,但是由于中央视觉的区域确实太小,大概只有一到两个厘米,所以还是不能注意到,而在边界视觉中,错误信息会和上面的红色字体混在一起,不够突出,所以不会引起注意。

所以在设计提示信息的时候,要么就离用户注意的地方足够近,比如显示在鼠标点击的区域,要么就使用明显的标志,比如与周围区别较大的颜色或者符号。这里也可以解释为什么尽量不在除了错误信息之外使用红色。下面这些例子是做得比较好的。

边界视觉在界面设计中的另外一个应用就是运动。比如在电脑上工作时,每次右下角弹出窗口,你都会第一时间下意识地去看,还有就是图标的抖动,比如QQ的消息提醒,都会引起你的注意。但是心理学上还有一个“习惯化”的现象,就是如果这些运动频繁地出现,我们会对这些刺激越来越习惯,最后不会对此做出反应。就像“狼来了”的故事。
所以我们不能滥用这些方法,以致于真正重要的东西会被习惯性屏蔽。

最后是两个有趣的例子。

一是多个目标的设计。比如开始菜单,每个应用都有可能是用户需要的,你不能每次都预测到用户需要哪个并将其突出显示(或许之后可以),那么用户只能每次一个个地找了吗?不一定,我们可以把每个对象做得与众不同,这样用户在搜索的时候,就可以借助边界视觉快速锁定相应的目标。但是当对象过多时,设计独一无二的图标是非常困难的。有一个技巧,图标的设计不用太华丽,不用带太多的细节,只要有独特的颜色和轮廓即可。

另一个是文字的设计,相比于图像,文字的视觉引导几乎没有作用,你也不可能在每个不同的文本上使用不同的字体和颜色。这时候就只能经过多次训练了,但是训练的前提是,内容是不变的。这就是为什么很多软件,在改版的时候不会轻易地改变功能或者选项的位置,因为这样用户之前所记忆的信息就是错误的了。这里作者提到了一个观点,“动态菜单”被认为是用户界面设计中一个巨大的错误。不过也不是绝对,还是需要根据具体情况分析。



阅读原文 本文来自:口袋知识网 news.papocket.com

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 没灵感?这里是最全的15个设计风格总结

    没灵感?这里是最全的15个设计风格总结

  • 没灵感?这里是最全的15个设计风格总结

    没灵感?这里是最全的15个设计风格总结

  • 淘宝刚发布的新版本,可能会引领2017年

    淘宝刚发布的新版本,可能会引领2017年

  • 学会这个教程,可以把任何一张人物照都

    学会这个教程,可以把任何一张人物照都