庞小敏

Pang Xiao-ming

（长沙理工大学设计艺术学院，湖南长沙 410114）

(School of Design and Art， Changsha University of Technology， Changsha， Hunan， 410114)

良好的用户界面设计（User Interface，UI）应该是好的可用性、功能性和美感的综合体[1]。其中，视觉设计是一项重要内容。好的视觉设计一方面能创造出美感，另一方面也能够引领用户顺利完成交互过程，确保界面的可用性。视觉设计和交互设计的最终目的都是为了创造好的用户体验，运行良好的界面设计能够给用户带来获得信息的满足感。

西方的眼动研究开始于19 世纪末。中国眼动研究则起步稍晚。在20 世纪五六十年代，中国只有几项眼动研究的报告。进入80 年代后，中国一些大学的心理系、教育系和科研机构陆续从国外购进了眼动仪，并初步开展了一些研究工作。近10 年来，中国在眼动研究领域已经取得令人可喜的成果[2]，但仍处于起步阶段，而且眼动技术在界面设计的运用方面存在如下几个问题：①眼动研究资料不足。②存在较为明显的眼动专业术语不统一，以及中英文翻译不统一的情况。在个别论文中，甚至出现生造出来的专业术语。③很多设计师还没有意识到眼动研究对视觉设计的重要性，很多人更喜欢凭感觉去解决设计上的问题。即使有部分设计师对眼动仪有兴趣，但由于眼动仪的运用要求使用者掌握相关的专业知识，让很多人望而却步。目前，中国已经有越来越多的设计院校和科研单位购置了眼动仪，但并没有被广泛应用。

针对这些问题，笔者梳理了眼动技术与界面设计研究领域国内外的相关文献资料，对眼动技术和眼动仪的使用原理和生产情况进行总结，以期为下一步眼动技术在界面设计中的运用研究奠定坚实的基础。

1 什么是眼动技术

眼动技术基于人眼睛如何看外界事物。科学发现，外界的光线通过瞳孔进入到眼球底部的视网膜上成像。视网膜将光的刺激信号传到大脑皮层的视觉中心，人即可感受外界事物。

视网膜成像的清晰程度并不一致。成像最清晰的区域为视网膜上正对瞳孔并凹陷的位置——“中央凹”。其直径为1.5 mm，视野范围仅2°[3]。在“中央凹”范围之外的视线范围，被称为“边界视野”。离“中央凹”越远，视线越不清楚。也就是说，要想看清事物，就必须将眼球的中央凹区域对准它（即注视）。

当代眼动试验通常采用基于视频的瞳孔/角膜反射法，即根据人瞳孔中心的位置和角膜反射关系来判断人在看什么[4]。

在眼动试验中，采用红外线作为光源（人眼看不到，不会使人分心）对眼睛进行照射，用可以拍摄红外线的照相机来拍摄用户的眼睛。红外线光源会在角膜上产生反射光，人们将反射光位置（角膜反射）作为基准点（静止部分），瞳孔则作为动点。根据瞳孔与角膜反射点的相对位置的变化，可以检测出视线。

假设头部保持不动的话，瞳孔和角膜反射的相对位置会随着眼球转动而改变。因此，可以根据瞳孔和角膜反射的相对位置的变化了解视线是怎样转移的。而且，即使观察者的头部有轻微的移动，只要看着同一个目标，其瞳孔和角膜反射的相对位置也不会改变[5]（图1）。

通过眼动试验，可以得到热点图、注视轨迹图、眼动路径、凝视时间、注视率、扫视率、最大扫视时间、平均扫视速度、平均扫视幅度、最大扫视幅度、瞳孔最大值和瞳孔平均值等多个眼动指标。通过对眼动指标的解读，可以推测出界面中用户感兴趣的地方，让用户难以理解的地方，以及用户当时的情绪和心理状态等。

2 关于眼动仪

眼动试验要通过眼动仪来完成。科学家真正使用眼动仪对眼动进行观察和试验是从中世纪开始的。但当时的研究结果并不精确，而且使用起来十分麻烦。在当代的用户体验研究中，经常使用的是两种眼动仪：远程眼动仪和可穿戴眼动仪。远程眼动仪能让参与者在较为自然的环境中参与研究，对于试验结果的数据分析较为简便。因此，远程眼动仪是一般试验的首选眼动仪类型。而可穿戴式眼动仪需佩戴在参与者的头上，常用于需要参与者四处走动的眼动研究中。

目前，世界范围内生产眼动仪的厂家已经有很多家。如中国用得较多的进口眼动仪出自加拿大SR 公司、瑞典Tobii 公司、德国SMI 公司和美国Arlington 公司。此外，也有很多机构采用中国产品，如北京的心拓英启（EyeSo）、上海的青研、重庆的爱威视（EYEVISION）等。

之前，眼动仪由于其昂贵的价格一直难以普及开来。近些年，随着制造成本的降低，以及便携式眼动仪的出现，眼动仪逐步成为教育学和心理学研究的常规仪器，并越来越多地运用于医学、语言、人类工效学、设计等领域。

图1 角膜反射为基准点，瞳孔为动点表示位置关系

3 眼动技术在界面设计中的运用

20 世纪90 年代，随着万维网（WWW）的诞生和商业化浪潮，互联网走向大众，西方学者开始运用眼动技术进行界面设计的研究。中国学者在2008 年前后开始这方面的研究。笔者对界面设计中受眼动技术影响的因素进行了梳理和总结，发现可以运用眼动技术，从以下6个角度入手进行界面设计的研究。

3.1 眼动技术与用户界面的大小

界面的大小会对用户的视觉产生影响，目前市场上屏幕的大小差别较大。如手机端常用的尺寸包括114.3、119.38、139.7、147.32、165.1mm 等，PC 端目前的主流尺寸则包括469.9、482.6、508、546.1、584.2、609.6、685.8mm 等。

通过眼动试验，可以了解界面尺寸对于视觉的影响。比如同一界面布局，在不同尺寸的界面上，对某类用户的视觉影响力有何不同。在此基础上，人们可以对界面设计方法加以调整，如自适应的设置标准等。

3.2 眼动技术与用户界面的布局方式

界面的布局方式同样会对用户体验产生影响，这也是目前眼动技术运用于界面设计研究中比较常见的研究内容。

在移动端的界面中，界面的布局方式主要有：标签式、宫格式、列表式、侧边展开式、组合式、旋转木马式等。PC 端的布局则一般比较统一，绝大多数网页都是由顶部导航、banner、内容区和页脚组成。

通过眼动试验，可以得到注视时间、注视点数、平均扫描轨迹总长度等眼动数据，从而判断出不同界面布局的特点。如注视时间和扫描轨迹短说明该界面的易读性较好，能让用户更快捷地找到目标对象。除此之外，还可以通过眼动试验掌握用户的视觉流程，了解布局方式对视觉优先顺序的影响，以及界面内容对布局方式的影响等。

3.3 眼动技术与用户界面的图文编排

图文编排包括界面的整体风格、界面的色调、图文的大小比例关系、图形的形态、图形的处理、文字的字体、字号大小、文字的颜色、字间距、行间距等。

通过眼动试验，可以研究什么样的图文编排方式能将功能与审美更好地结合起来，如左文右图和左图右文哪种形式更恰当；拟物风格与扁平风哪种风格更合适。可以去研究icon 图标形态对信息的接收有什么影响。如点、线、面图形形态对用户接受信息的影响；正方形、三角形、圆形等基本几何图形和不规则形对用户接受信息的影响；圆形icon 和圆角矩形icon 对用户接受信息的影响；icon 阴影的添加、模糊化的处理、抽象化的处理方式对用户的影响等。还可以通过眼动试验去研究不同用户群的审美偏好，如老年人为用户主体的界面的文字字号，也可以通过眼动结果去解读当前流行的色调、设计风格存在的内在原因等。

3.4 眼动技术与用户界面的交互功能

界面的交互设计，就是让人与界面之间更好地“对话”。如果某个UI 产品的界面能让你毫不费力地完成各种任务，那么就认为该界面的交互设计非常好。如果说视觉的美观设计是靠感性驱动，那交互设计则主要是靠理性和逻辑驱动。但交互设计中绝大部分仍然是要依靠视觉而实现的。界面中交互功能的可视性越好，越方便用户使用。如：抽屉式导航用不用按钮？按钮放在哪？等待时要不要设置进度条？搜索结果的排序怎样影响用户的点击等。

用户等待时间也是交互设计时要考虑的问题，如：页面跳转的速度；下载的速度等。此外，还有用户的交互手势问题，单击还是双击，上划还是下划……这些问题也都可以通过眼动试验进行研究，分析试验结果以得到更好的人机交互方式。

3.5 眼动技术与用户界面的情感体验

在使用界面的过程中，用户会产生相应的情感体验。如愉悦、轻松、烦闷、愤怒等。目前用于描述人类情感状态的常用情绪模型是PAD 模型。其中P 代表愉悦度，代表个体情感状态的正负特性；A 代表唤醒度，表示个体的神经生理激活水平；D 代表优势度，表示个体对情景和他人的控制状态。

通过眼动试验，可以得到注视时间、眨眼率、注释率、瞳孔最大值和瞳孔平均值等指标的数据，通过这些指标的结果能推导出用户的愉悦度、唤醒度和优势度。一个好的界面设计应该要能让用户感到愉悦、唤醒度高且优势度高。可以利用眼动试验去找到能提高PAD 情感的界面设计方式。比如，字体的暗色饱和度偏低，段落字间距、行距较大，会提升用户的愉悦度和优势度。

3.6 眼动技术与UI 产品用户群的分类

通过眼动技术，还可以研究怎样针对不同的用户群去进行界面的设计。用户群的分类较为多样化。一般来说，可以按年龄、性别、职业、收入、个性、文化层次、身体健康情况等标准来划分不同的消费群。如女性大学生群体、老年人群体等。不同的消费群，在审美倾向、思维方式、行为习惯等方面都存在着差异。如老年人群体，就是需要人们特殊关照的庞大群体。近年来， 部分中国学者针对老年人群体进行了深入的研究和实践，提出了“适老化设计”的概念，积极提升老年人用户群体对产品的满意度[6]。此外，用户的身体健康情况也是人们可以考虑的因素。针对残疾人士的“可及性设计”标准尽可能地帮助障碍者扫除生活中的障碍，使障碍者的感官能力获得提升。如美国盲人印刷公司开发的“动态多层触觉触摸显示屏”就改善了视觉障碍者对图形信息获取的能力[7]。

在眼动试验中，可以邀请具有相同特性的人群作为被试者，从而测试出不同用户群的喜好，总结出某用户群更青睐于怎样的版面设计和交互方式，从而进行有针对性的界面设计。例如女性更倾向于用语言机制处理信息，男性倾向于用视觉感官模式处理问题[8]。那么在为用户主体为女性的UI 产品进行界面设计时，可以适当增加文字内容；在为用户主体为男性的UI 产品进行界面设计时，可以适当增加图形部分的比例。

综上所述，眼动试验对于界面设计的研究具有重要的意义。

4 结语

虽然中国对眼动技术的研究越来越重视，但总的来说还处于初级阶段，对使用眼动仪进行界面设计的研究还不够深入和充分。

文章对国内外的眼动研究情况进行了总结，提出中国的眼动技术在界面设计的运用上存在3 大问题. 并介绍了眼动技术，总结了国内外眼动仪的生产情况和使用情况。在此基础上，文章提出，我们可以从6 个角度入手，通过眼动试验，研究眼动技术对界面设计的影响。

文章对中国的眼动技术在界面设计运用方面的现状和问题提出了独到的见解，能够为涉及眼动技术在界面设计运用的其他研究提供理论基础，也能够为接下来与界面设计有关的眼动试验提供前期的支撑依据。接下来，以此为基础，课题需要针对文中提到的界面设计中的问题，进行眼动试验实操，将研究深入、具体化，以得到详实有效的结论，这些结论将促进界面设计的良性发展。