地图导航类APP半透明黑色蒙版的透明度阈限研究

姚 君，郭益诚

（中国矿业大学，江苏 徐州 221116）

1 研究背景及现状

地图导航类APP为了满足用户日益增加的需求，出现了大量优秀的界面设计，虽然这些设计给予用户良好的体验，但是这些作品大多是根据设计师自身设计经验得到的，没有定量的数据支撑设计过程中用到的设计方法[1]。

在交互和界面设计中大量运用了具有透明度特征的设计元素，如半透明图标、半透明黑色蒙版等[2]，经过大量文献查阅，发现目前几乎没有对具有半透明特征的设计元素进行的相关研究[3]，尤其是对黑色半透明蒙版的透明度阈限的研究。

2 研究意义

黑色半透明蒙版主要应用于用户使用该软件时的使用引导、强弱弹窗提醒、广告推送等使用情景中，在移动手机APP设计中被广泛应用[4]。半透明黑色蒙版能够遮挡背景信息，减弱背景信息对主体内容的视觉干扰，将用户的视觉焦点转移到新的主体内容上[5]，在传递信息暗示主题的同时，能够让用户了解他们所处的环境，被广泛的应用于界面交互设计中[6]。

地图导航类APP多在复杂多变的驾驶环境中使用，驾驶者消耗最多的认知资源的是视觉认知[7]。半透明黑色蒙版的合理应用影响着用户的视觉认知与 （人机交互的流畅度），合理的半透明黑色蒙版的应用可以提高用户的认知效率，减少误操作，提高用户在使用导航类用户体验。所以对地图导航类APP界面的黑色半透明蒙版的阈限研究是很有必要的。

3 研究方法

3.1 实验过程

使用眼动仪记录用户与车载信息系统交互时的眼动轨迹，通过分析眼动轨迹来判断用户对界面元素的注意顺序、注意程度以及所关注的区域等，得到半透明黑色蒙版的阈限下限，结合系统可用性量表分析用户对车在信息系统中半透明黑色蒙版界面的使用体验，进而得出车载信息娱乐终端半透明黑色蒙版的可用性阈限的上限，结合黑色半透明蒙版的上限与下限，最终得出半透明黑色蒙版的阈限。

实验材料包括：使用ADOBE PHOTOSHOP CC与AXURE软件制作（半透明黑色蒙版透明度分别为0、10%、20%、30%、40%、50%、60%、70%、80%、90%、100%）11 个原型界面（见图1），所有界面尺寸的大小均为7英寸，分辨率为800×480。用户在执行操作任务时，流程中各个界面相同，半透明黑色蒙版突出的主题内容一致。通过界面原型在触屏平板电脑上模拟用户与车载信息娱乐系统的交互场景。实验采用SMI iView XTM HED头盔式眼动仪，采样率为200Hz，利用BeGaze 3.2软件进行数据分析。

图1 界面Fig.1 Display interface

3.2 实验设计

实验采用被试间设计，自变量为半透明黑色蒙版的透明度，（以10%梯度为梯度设置），将“疲劳驾驶提醒——确认阅读”设置为用户任务执行流程，在该流程中半透明黑色蒙版的透明度保持不变。

本研究以在校本科生和研究生共68人作为实验对象，平均年龄为22.6岁，其中男性36人，女性32人。所有测试对象的裸眼视力或矫正视力正常，且都未使用过车载信息系统的收音机和多媒体功能，随机将其分为11组，分别对应实验所用到的11个原型。

3.3 系统可用性量表

系统可用性量表是对系统的可用性、有效性等进行评估的常用自我报告度量之一，是最具有代表性的量表，通过该量表可以对系统的可用性进行详细地分析和度量[8]。系统可用性量表由 John Brooke编制，可用性量表由10个陈述句构成，其中第一、三、五、七、九句为正向表达，第二、四、六、八、十句为反向表达，具体内容如下：①我愿意经常使用这个系统；②我发现这个系统没必要这么复杂；③我认为该系统容易使用；④我需要技术人员的支持才能使用该系统；⑤我发现这个系统中的不同功能被很好地整合在一起；⑥我认为这个系统不太一致；⑦我认为大部分人会很快学会使用这个系统；⑧我发现这个系统用起来非常笨拙；⑨我对这个系统感到很自信；⑩我在使用该系统前需要学习很多东西。

用户在使用过地图导航界面以后，根据自己的体验感受对上述十项陈述语句的同意程度用五点量表的形式进行打分，研究人员对10项评分进行汇总即可得到系统可用性量表的分数，该分数位于 0～100之间，评分在 60分以上的系统一般被认为是用户体验较好的产品。

4 结果与讨论

4.1 系统可用性量表分数分析

系统可用性量表分数的统计结果见表1，通过观察车载信息娱乐系统的操作界面的透明度计算后得出的P值可以发现，用户在使用11个界面时所感受到的系统可用性差别较大。当黑色蒙版的透明度达到60%时，用户对系统的可用性评价最高，即黑色蒙版透明的上限应为60%的透明度。

表1 系统可用性量表的平均值（标准差）Tab.1 Means（standard deviations）of SUS

4.2 热点图分析

对热点图的分析可以从客观的角度了解用户对界面关注的区域，本研究的热点图见图2。可以发现，在车载信息系统的疲劳驾驶提醒界面中，如图2（a）～（k），如图2（a）中热点比较分散，说明界面中提供的信息量比较多，用户的注意力被分散，不能很快的筛选出重要信息；图2（k）中热点集中在弹框上，说明用户能够很直接的捕捉到重要信息。

分析图2（a）～（k）图这 11 张热力图，可以明显的看出当黑色半透明蒙版的透明度在40%时，用户的注意力主要集中在，中心弹窗的重要信息上。所以我们可以得出地图导航类APP黑色半透明蒙版透明度阈限的下限值为40%。

图2（a）～（k），随着黑色蒙版透明度的降低，用户的视觉注意力越来越集中，用户找到重要信息的速度也越来越快，但是随着透明度的降低，用户感知自己所在系统导航位置的能力不断下降，造成不好的用户体验。为了使用户快速找到重要信息的同时，保证良好的用户体验，必须将系统可用性量表与热力图结合起来进行分析。

5 结论

我们结合系统可用性量表的数据及热力图分析可以得到以下结论。在排除主体内容与背景对用户视觉影响的情况下，地图导航类APP的半透明黑色蒙版透明度阈限为40%～60%。在该阈限范围内可以让用户将视觉注意力集中在主题内容的同时，让用户了解自身所处的环境，给予用户良好的体验。

本研究基于眼动追踪技术，构建了地图导航类APP界面设计的原型测试实验，通过对系统可用性量表分数、扫描路径、热点图等实验结果的深入分析，得出了地图导航类APP半透明黑色蒙版透明度阈限，对地图导航类APP黑色半透明蒙版的应用与界面设计具有重要的指导意义。

[1]谭浩，赵丹华，赵江洪.面向复杂交互情境的汽车人机界面设计研究[J].包装工程，2012，18.

[2]CAI H，LIN Y，CHENG B.Coordinating Multi-level CognitiveAssistance and Incorporating Dynamic Confidence Informationin Drivervehicle Interfaces[J].Human Factors and Ergonom-ics in Manufacturing&Service Industries，2012，22（5）：437-449.

[3]蔡明琬.增强认知效率的音乐情感缩略图研究[D].杭州：浙江大学，2011.

[4]MITSOPOULOS R E，TROTTER M J，LENN M G.Effects onDriving Performance of Interacting with an In-Vehicle MusicPlayer：a Comparison of Three Interface Layout Concepts forInformation Presentation[J].Applied Ergonomics，2011，42（4）：583-591.

[5]LAVIE T，ORON G T，MEYER J.Aesthetics and Usability of In-Vehicle Navigation Displays[J].International Journal of Hu-man-Computer Studies，2011，69（1-2）：80-99.

[6]刘青，薛澄岐，FALK H.基于眼动跟踪技术的界面可用性评估[J].东南大学学报（自然科学版），2010，2.

[7]朱婧茜，何人可.Android手机应用界面布局的可用性测试研究[J].包装工程，2014，10.

[8]闵庆飞，李双明.基于可用性的移动商务系统采纳研究框架[J].计算机应用研究，2009，5.