基于眼动追踪技术的即时通讯APP导航界面设计

李森，吕伟，郭伏，刘成龙

(东北大学 工商管理学院，沈阳 110167)

1 引言

2015年李克强总理宣布将“互联网+”上升至国家战略，中国全面迎来互联网时代。在当前时代背景下，互联网用户的时间、兴趣、需求和行为等都呈现出“碎片化”的状态[1]。智能手机应运成为满足用户“碎片化”需求的重要平台。手机应用(Applications，APP)是装载在智能手机等移动终端中的软件程序，作为移动互联网的内容载体，能为用户提供各种便捷的服务，包括社交通讯、出行导航、金融理财、娱乐健康、消费娱乐等。IM(Instant Messaging，即时通讯)类APP以其实时性、跨平台性、低成本、高效率等诸多优势成为互联网用户使用最为广泛的APP，并对传统的电话、短信等通讯方式带来了冲击[2]。

当前，APP市场发展迅猛，能够满足用户不同需求的APP层出不穷，但相同类别的APP在功能与设计上也呈现出严重的同质化趋势。此外，当前APP市场尚无统一的导航设计标准，加之部分应用研发团队刻意追求应用投入市场的进度，导致IM类APP在功能性、美观性、易操作性等方面无法满足用户的需求。Hoffmann等人在《用户体验要素》一文中指出，APP属于自助式产品，在使用过程中通常没有老师或者操作手册加以引导，需要用户自己摸索如何使用[3]。这对APP的设计提出了两点要求：(1)APP的结构层设计需要符合用户的使用习惯，能够使用户自然而然的找到需求的功能入口；(2)对于用户未知的任务路径要有良好的引导。APP导航作为用户获取信息以及实现自我需求的重要入口，导航设计的优劣将直接影响用户的操作体验。良好的导航设计可以让用户快速了解产品的功能和信息组织架构，减少学习成本，提高用户的搜索、操作效率与满意度[4-5]。

当前，已有部分研究关注APP导航设计中的问题。龚诗雅(2007年)等人采用主观调查问卷和任务绩效评价的方法，借助Silverback移动互联网应用可用性评价软件，以拼车APP为研究对象，研究了目前市场上主流的拼车APP导航设计存在的不足[6]。陈驰等人(2015年)从导航的基本概念和设计原则出发，采用主观问卷和绩效评价的手段研究了APP的导航情感化设计，他指出在设计过程中不仅要遵循形式美的法则，从用户的认知、审美、本能行为出发，考虑图标、文字、色彩、布局、操作习惯、细节等多项内容，让用户在使用导航时产生一种积极的情感状态[7]。汪洋研究了消费者在操作不同复杂程度、不同密度的模拟手机APP分类导航界面时的搜索效率，发现消费者在操作浅色背景的简单图片导航时效率最高[8]。张悦指出App 界面导航设计的最终目的是实现视觉信息导航，并基于视觉传播的机制与模式分析了APP界面导航中的视觉传播过程以及相应的导航设计策略[9]。当前已有的APP导航研究在研究方法上主要依赖于访谈法与问卷调查等主观方法，缺乏来自用户的客观数据，如操作绩效、眼动数据、脑电数据等；在研究内容上主要集中在对APP的使用情况与用户满意的调查方面，缺乏对影响用户体验的深层原因的探索以及基于用户数据的APP导航设计与优化。

基于上述背景，本文立足于APP导航方式的优化设计，以IM类APP为例，从用户的角度入手，尝试用先进的眼动追踪设备挖掘用户深层次的需求，寻求对传统导航设计方法的创新，指导APP导航设计的全过程。本文的内容安排如下：首先为IM类APP导航系统可用性评价词对筛选与确定，其次为导航系统关键设计要素确定与原型设计，再次为结合主观量表与眼动追踪技术的导航系统可用性测量实验，最后为APP导航系统的设计优化与验证。

2 IM类APP导航系统可用性评价词对确定

首先收集能反映IM类APP导航系统可用性的意象词对，通过语义差异量表测量，获取用户对导航系统可用性的意象评价。通过查询导航设计相关期刊11本、“Google”、“百度”等搜索引擎以及导航设计类文献数十篇，并与专业人士进行词对比较分析，筛选出原始感性词对28组，利用该28组词对对用户进行感性词对问卷初步调查。选取IM类应用中下载量最高的微信作为预实验材料，在被试体验完APP后现场对被试发放并回收问卷30份(其中男女被试各15人)。调查结果显示被试选择比例在30%以上的词对共有13组，如表1所示。

表1 初步选取的可用性评价意象词对

以该13组词对为基础开发APP导航可用性测量问卷，对各年龄段用户进行问卷调查，共发放问卷140份，实际收回问卷135份，剔除问卷答案不清晰、字迹潦草等出现明显差错的问卷4份，最终得到实际有效问卷131份(其中男性67份，女性64份)。将问卷数据进行项目分析与独立样本检验后发现词对“花哨的——素净的”、“明确的——迷茫的”不具备显著性，予以剔除。在剔除2组词对后，采用因子分析探索剩余的11组词对中是否存在潜在的共性因子。通过KMO检验(0.828)和巴特利特检验(显著性P<0.001)后，进行探索性因子分析后发现当成分确定为3个因子时，累积百分比为70.568%，后续因子继续增加引起累积百分比变化幅度小于6%，因此确定提取三个因子。为确定3个因子包含的感性评价评价词对，需对问卷结果进行进一步的主成份分析。经过旋转后的成分矩阵如表2所示。按照Hair(1998年)提出的因子载荷标准，词对“易学的―难学的”在3个成分中载荷均<0.5，词对“好看的——难看的”在成分1和成分2中均>0.5，不符合Hair提出的因子载荷标准，予以剔除。

表2 旋转后的成份矩阵

从表2中可以看出成分1包含的词对侧重APP导航的设计复杂度方面，成分2侧重导航外观审美方面，成分3侧重导航的易用性方面，因此分类结果从逻辑上可以进行解释。将筛选过的九个词对重新赋变量，结果如表3所示。

表3 产品情感意象划分

3 IM类APP导航系统关键设计要素确定与原型设计

3.1 代表性IM类APP的选取

本研究选择Android系统的IM类手机APP作为研究对象，参考豌豆荚、360手机助手等APP下载平台，根据下载量收集到在中国大陆地区使用量较高的IM类手机APP，包括信使、KK觅友、小恩爱、飞信、飞聊、环聊、百度Hi、Line、陌陌、What’sAPP、来往、Skype、米聊、翼聊、沃友、手机QQ、有信、YY语音、新浪UC、有你、微信、口信、个信、Imessage、旺信、易信、爱聊、佳话、KaKaoTalk和有聊共计30款软件。

3.2 代表性IM类APP多维尺度分析

将收集到的30款IM类APP随机编号，然后开展问卷调查，要求被试根据软件名称、软件图标、一级导航界面图像和提供的软件功能简介等方面的信息对该30款软件进行分组，分组数量和规则不加限定。共计发放调查问卷40份，回收33份，其中有效的调查问卷30份(其中男女各15人)。被调查者均为具有IM类APP使用经验的在校学生或企业职员，平均年龄为24.4岁。将分组的结果进行统计，记录某一款软件与其他软件被分配在一组的次数，整理后得出被调查软件相似矩阵并进一步转化为距离矩阵，最后将得到的距离矩阵输入到SPSS 18.0中，采用多维尺度分析，得到不同维度下的Stress值与RSQ值。当维度数量为6时，Stress值<0.100且RSQ值>0.800，满足多维尺度分析条件。将30款手机APP的6维度坐标值输入到SPSS 18.0中，使用分层聚类方法得到将30款软件的分类情况，统计软件输出的树状图如图1所示。

图1 IM类APP聚类树状图

从分层聚类的树状图中可以看出，在聚类为4类时，随着距离的变化分类数趋于稳定，因此选定4类作为30款IM类APP软件的分类数；利用K均值聚类分析方法再次对选定的6维度坐标值进行快速聚类分析，设定聚类数目值为4，得到运行结果见表4所示。

从表4的快速聚类分析的结果可看出，30款软件可以分为4类，各类别所包含的IM类APP如表5所示。按照聚类分析的结果，由每一类别中选择出两款代表性产品，根据该软件距离该类别中心的距离远近进行排序，选出两款距离中心最小的作为代表性软件，如表5所示。将选出的八款软件作为本研究的代表性研究产品，即导航设计解构对象，提取关键设计要素，为后续实验用APP设计做准备。

表4 IM类APP快速聚类表

表5 IM类APP聚类结果与代表性APP选择

3.3 IM类APP导航系统关键设计要素提取

人机界面元件法HIEs(Human Interface Elements)由Han 于2003年率先提出，是影响用户情感的最基本要素[10]。根据Han的定义，HIEs指用户所见、所触或所用的设计特征集合，是产品与人的多种感官发生信息交互的最小单位。本文所定义的导航是指用户想要完成某一操作时，从起始点到达目的地并返回的过程中，APP所提供给用户的全部，包括信息显示、提供操作、反馈信息等等。结合前人对HIEs解构方法的研究[11-12]，提出基于HIEs的IM类APP导航系统解构方法如下(如图2所示)：

在设计要素提取的过程中，首先邀请15名熟练使用手机APP的大学生进行眼动实验，在实验过程中记录被试在实际操作过程中的注视点、扫视轨迹与操作过程等。然后以视频记录为基础，眼动注视点、兴趣区域为辅助，依据HIEs解构方法对IM类APP导航系统进行解构，提取影响导航可用性的HIEs要素的组合属性、交互属性，分别是导航方式、返回方式和操作手势。对选出的APP导航设计要素进行全要素组合，选出具有代表性的组合原型进行APP导航系统原型设计，并用于后续的APP导航实验研究。

3.3.1 导航方式的确定

针对于八种代表性APP在预实验中的表现，最终设计的导航方式共三种，如图3所示，从左到右依次为TAB式导航、舵式导航、抽屉式导航。

图3 APP导航方式设计

3.3.2 操作手势确定

通过眼动数据分析发现，影响APP导航可用性的不仅有APP设计因素，还包括用户的使用方式，习惯操作手势等，有调查显示大多数人习惯使用单手操作手机，约占到总人群的60%，习惯双手操作手机的用户所占比例仅为15.6%[13]；所以将操作手势纳入导航可用性评价实验设计中。

3.3.3 返回方式确定

分析预实验中被试操作八种代表性APP的过程，发现在返回导航方面主要受返回方式的影响，返回方式分为返回按钮返回和向右滑动手势返回两种。各设计要素及其相应水平如表6所示。

表6 导航设计要素

3.4 IM类APP导航系统原型设计

依据以上三个设计要素，参考Smith & Chaparro(2015)研究输入法可用性的实验设计[14]，通过对关键设计要素的全组合，利用Mocking Bot软件设计了12款导航系统原型，导航系统的详细信息见表7。

表7 12款导航系统原型

4 IM类APP导航系统可用性测量

借助第2部分制定的导航可用性评价量表与眼动追踪系统，对第3部分开发的IM类APP导航系统原型的可用性进行综合评价。通过对眼动数据、主观问卷数据单独处理分析以及两者间的相关分析，为导航设计方案的优化提供依据。

4.1 实验设计

本次实验在东北大学人因工程实验室进行，实验设备为德国SMI公司的头戴式视线追踪眼动仪。本次实验共邀请42名被试，其中有效被试30名(其中男女各15名；由于头戴式眼动仪校准精度要求较高，另12名被试因眼动仪校准不合格被剔除)。所有被试年龄在20～28岁之间，均能熟练使用Android智能手机，有多年使用IM类APP导航系统的经验。

本次实验任务为IM类APP二级导航的使用。在被试熟悉实验用APP导航系统后，请被试完成相同二级导航目录下任务，包括(1)添加新的朋友，(2)打开扫一扫，(3)创建群聊(各任务出现顺序为计算机随机生成)。每位被试分别使用第3部分设计的12款导航系统完成实验任务。

4.2 实验数据与结果分析

4.2.1 问卷数据

通过第2部分提取出的导航系统可用性评价的三个维度：内容复杂度(X)，美观性(Y)，易用性(Z)及其包含的意向词对Wj (j=1, 2, …, 9)，本文假设各因子及其所含成分权重相等，采用李克特量表七分制打分法，对所有被试的问卷调查结果进行均值处理后的结果如表8所示。

表8 问卷数据处理结果

采用偏最小二乘建模法，借助Smartpls软件，以导航系统的三个可用性评价维度得分情况为因变量，建立导航系统设计要素与因变量回归模型，将数据导入SmartPLS中，运算得到的路径模型与系数见图4。从建模结果可以发现复杂度评价维度主要受导航方式的影响，而易用性受到三个设计要素的综合影响，美观性评价因子主要与导航方式有关，可以看出导航方式是最主要的影响因素。

图4 导航系统主观评价路径模型

4.2.2 眼动数据

结合以往有关网页导航研究以及眼动实验设计指导[15-16]，选取眼跳时间、操作时间、首次注视时间、注视时间四个眼动指标对APP导航系统的可用性进行分析。将所有被试操作各个导航系统的眼动数据进行均值处理后得到的结果如表9所示。

表9 眼动数据处理结果

本研究采取3*2*2被试内实验设计方式，先由眼动数据采集软件BeGaze导出各被试在各种实验条件下的眼动数据，采用SPSS统计软件对眼动数据然后进行重复测量方差分析，分析结果如表10所示。

表10 各眼动指标的重复测量方差分析

从表10可以看出，导航方式对眼跳时间与首次注视时间有显著影响，导航方式、返回方式、操作手势三个设计因素对操作时间都有显著影响。各导航设计要素与注视时间眼动指标间不存在显著性关系。

4.2.3 相关分析

将问卷调查获得的主观评价数据与眼动指标中眼跳时间、操作时间与首次注视时间导入SmartPLS软件中，得到的路径模型与系数见图5。

图5 导航系统眼动数据评价路径模型

在APP导航的实际设计中，复杂度是设计者考量的重要维度。导航的复杂度越高，首次注视时间越长，用户搜寻有用信息的难度越大。此外，本研究发现用户操作TAB式导航的首次注视时间小于舵式导航，而抽屉式导航的首次注视时间最长，表明TAB式导航和舵式导航能够很好地凸显出拓展按钮，具备良好的导航引导作用。

在导航设计中，美观性与眼跳时间存在高度相关性，而美观性主要受到导航设计方式的影响。通过SPSS软件对导航方式与眼跳时间做估计边际均值图分析发现，舵式导航方式在美观性方面的表现要优于其他两种导航方式，这一点也体现在主观问卷美观性维度的得分中，可以看出舵式导航更加符合用户的审美。

易用性同样是评价导航系统优劣的重要维度，从路径关系图中可以看出易用性主要与操作时间有关。将30名被试在各任务的操作时间进行均值处理，比较不同导航方式、不同操作手势、不同返回方式之间的操作时间差别。分析结果指出，在操作时间方面，导航方式从优到劣依次为舵式导航、TAB式导航、抽屉式导航。此外，单击返回按钮返回在双手操作时明显要快于单手操作，但是向右滑动返回方式在双手操作时反而消耗更多的时间。

5 IM类APP导航系统优化设计与验证

5.1 导航系统评价路径模型修正

通过第4部分相关分析发现返回方式与操作方式的交互效应对易用性也有影响，所以对导航系统评价模型加以修正，得到的路径模型及路径系数如图6所示。

图6 导航系统主观评价路径模型(修正)

5.2 最优方案确定

由于导航系统评价的三个维度分别是复杂度、美观性、易用性，各维度均具有三个水平；通过眼动数据的分析发现在三个评价维度中，复杂度与导航系统呈负相关，美观性与易用性与导航系统呈正相关，为了取得最优的设计要素组合，设定复杂度目标值为1、美观性目标值为3、易用性目标值为3，优化公式见公式(1)。

(1)

其中设Xi(O)为目标设计值，Xi(T)为由设计要素决定的实际值，D(O,T)为目标设计值与实际值差异，优化目标为D(O,T)的最小值，即Min(D(O,T))。目的是寻找与目标值最接近的导航设计方案。将目标值与模型结果输入Matlab中求解得到的最优导航系统设计方案为舵式导航方式、单手操作配合向右滑动返回方式。

5.3 最优导航方案分析与验证

为验证最优导航设计方案进行的有效性，选择应用商店IM类APP下载量排名第一的“微信”作为研究对象，依据最优导航设计方案参照微信设计风格设计的实验用APP如图7所示。

验证性实验选取15名被试，均参与过第4部分的实验。实验要求被试在手机上先使用微信完成二级导航目录下操作，然后再熟悉实验用APP，最后完成二级导航目录任务，包括：(1)添加新的朋友，(2)打开扫一扫，(3)创建群聊(各任务出现顺序为计算机随机生成)。采用头戴式眼动仪搜集眼动数据，在实验结束后邀请被试填写调查问卷。经均值处理后的问卷数据和眼动数据整理如表11所示。

图7 APP导航最优化方案实验用APP

表11 优化前后微信APP导航系统评价结果

对比优化前后的APP评价指标，导航可用性的问卷调查结果显示，复杂度和美观性方面两个方案得分接近。在易用性方面，优化后的微信APP评价得分高于原版APP，在使用过程中更容易被用户接受。眼动指标方面，眼跳时间和操作时间都显示优化后的APP导航可用性更高；但首次注视时间方面差异不明显，造成这一现象的原因是被试均能熟练使用微信，了解拓展按钮的位置，在完成任务操作时并不需要对拓展按钮进行搜索，所以不需要用到信息凸显性。综上所述，优化后的导航方案能够缩短操作路径，降低用户的点击成本，而且拓展按钮布局位置独立，不受界面当中其他元素的局限。在导航可用性方面较原版微信APP有明显提高，验证了优化方案的有效性。

6 结论

本文立足于APP导航方式的优化设计，以IM类APP导航为研究对象，通过导航系统可用性评价词对选取与量表开发、关键设计要素提取与原型设计、可用性实验测量以及最佳方案的实验验证等步骤，提出了APP导航设计与优化的系统方法。