![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=1739210617-BbHOy0AO5bjrfP8CWScdNOKGJDJ0egOC-0-c680cb7f4c7c40ed88d163eb02822908)
图2.5-1 边界视野的分辨率和透过覆满水雾的浴室玻璃看东西一样
视网膜的边界更多的是视杆细胞,这类细胞能够感光,但是不能感色。一般来说,只有在夜晚的时候才会发挥作用,边界视觉的作用如图2.5-2所示。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_56_2.jpg?sign=1739210617-gn4ME32zvyfRCpVANTQ6a1pYyBdVNG4k-0-f592c06a19d04df3841136f886121cd8)
图2.5-2 视觉边界的作用
在UI设计上,有一些界面中的错误信息的放置位置违反了人眼的生理结构,常常将那些重要的错误提示信息放到用户当前的视觉边界的位置上(一般来说距离视觉焦点1~2cm,人的视觉就会严重下降),导致用户根本注意不到。如图2.5-3所示的注册网页,填写完用户名和密码后,用户的视觉焦点位于登录按钮区域附近。输入的信息有误,错误提示却出现在2cm之外的视觉边界的位置上,用户根本注意不到,单击登录按钮之后没有任何响应,用户就会感到莫名其妙。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_56_3.jpg?sign=1739210617-rqMR8UnJOGpxh05CQZY2tlYY6PQfc4Dp-0-bf2bea7ff72d4b5a598db0e202e808f0)
图2.5-3 重要的错误提示信息放到了用户当前的视觉边界位置
再如图2.5-4所示,用户也可能注意不到错误信息。
原因有两个:一是错误信息位于视觉边界区域;二是和错误信息非常接近的标题也是红色的,用户的视觉边界看到的图像大致如图2.5-5所示。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_57_1.jpg?sign=1739210617-KTzYIa2d2rBovqKQyvrRMdUz1y8vBMbG-0-4a6da6051a1336de0909c1b6a873dda4)
图2.5-4 用户注意不到错误信息
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_57_2.jpg?sign=1739210617-rGBbSvR5L3FtVUZSE4m6Bl8mwCRXMQMN-0-8b4ea63017100f05344c76b26c72680b)
图2.5-5 用户的视觉边界看到的图像
关于上述问题的改进方法有很多,下面介绍几种常见的方法:
(1)明确标注错误,并放在用户的中央凹区域附近;
(2)在提交之前就动态地实时提示错误信息,而不是将错误提示全部放在提交之后,如图2.5-6所示。
![](https://epubservercos.yuewen.com/82F748/23020635301635706/epubprivate/OEBPS/Images/42048_57_3.jpg?sign=1739210617-1VR4PVmI2tgQqi1U4dgsR6McyOYZPXYw-0-83dc0a402100f506489141d62f9404db)
图2.5-6 两种改进视觉边界问题的方法