![UI设计](https://wfqqreader-1252317822.image.myqcloud.com/cover/944/43737944/b_43737944.jpg)
2.5 视觉边界
2.5.1 位于视觉边界的错误信息
人的视网膜上中央区域的视锥细胞非常集中,比中央区域之外的部分要多得多,通常将这个区域称为中央凹。视锥细胞是分辨颜色的主要细胞。因此,实际上只有聚焦区域的物体才能够被真真正正地看清楚,而边界视野的分辨率和透过覆满水雾的浴室玻璃看东西一样,但经过大脑的整合填补,使人产生能够看清楚周围所有事物的错觉,也就是说,无论你把眼睛聚焦于什么地方,你真正能够看到的地方也只有那里(见图2.5-1)。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_56_1.jpg?sign=1739273789-7EDIdk08iKUlnGOkQinS0ylncannTOhz-0-94f66a46a63a6c2cf6fbbe24d3563c61)
图2.5-1 边界视野的分辨率和透过覆满水雾的浴室玻璃看东西一样
视网膜的边界更多的是视杆细胞,这类细胞能够感光,但是不能感色。一般来说,只有在夜晚的时候才会发挥作用,边界视觉的作用如图2.5-2所示。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_56_2.jpg?sign=1739273789-ohNmYvwIjgm9QRlb91UJbm9RfPkGa3kc-0-d427d163036fe54d04e81619a243e1ad)
图2.5-2 视觉边界的作用
在UI设计上,有一些界面中的错误信息的放置位置违反了人眼的生理结构,常常将那些重要的错误提示信息放到用户当前的视觉边界的位置上(一般来说距离视觉焦点1~2cm,人的视觉就会严重下降),导致用户根本注意不到。如图2.5-3所示的注册网页,填写完用户名和密码后,用户的视觉焦点位于登录按钮区域附近。输入的信息有误,错误提示却出现在2cm之外的视觉边界的位置上,用户根本注意不到,单击登录按钮之后没有任何响应,用户就会感到莫名其妙。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_56_3.jpg?sign=1739273789-DSRRuGNcEDQSPc5PrmKgZFPuogDeNnFK-0-8f50b6aee20dd7f2daa166b643fb467e)
图2.5-3 重要的错误提示信息放到了用户当前的视觉边界位置
再如图2.5-4所示,用户也可能注意不到错误信息。
原因有两个:一是错误信息位于视觉边界区域;二是和错误信息非常接近的标题也是红色的,用户的视觉边界看到的图像大致如图2.5-5所示。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_57_1.jpg?sign=1739273789-BNnWB5XeuPqbDkSKcyf7HwCjPtkDG1Ud-0-74dedd1e60758d12ab3e708576e23393)
图2.5-4 用户注意不到错误信息
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_57_2.jpg?sign=1739273789-teS1D8RuE96890UQ1WAaTLjGpsDiz1ms-0-62b52d2003f3c7c2372a3857402eb583)
图2.5-5 用户的视觉边界看到的图像
关于上述问题的改进方法有很多,下面介绍几种常见的方法:
(1)明确标注错误,并放在用户的中央凹区域附近;
(2)在提交之前就动态地实时提示错误信息,而不是将错误提示全部放在提交之后,如图2.5-6所示。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_57_3.jpg?sign=1739273789-ncbocCXxEupj4GxKOWxMUFY5q01Wy1XO-0-9035d362e21fb36a2f2eff724e5dd1ea)
图2.5-6 两种改进视觉边界问题的方法