基于视觉感知强度的人机交互界面优化设计

张　宝　丁　敏　李燕杰

合肥工业大学，合肥，230009



基于视觉感知强度的人机交互界面优化设计

张宝丁敏李燕杰

合肥工业大学，合肥，230009

为了提高人机交互界面的视觉舒适性和高效性，提出了一种基于视觉感知强度的人机交互界面优化设计方法。首先依据人眼视锥感知细胞的感知强度区域划分标准，建立人机交互界面感知强度划分模型；然后依据优序法的权重等级划分方法，科学度量视觉感知元素权重等级；最后在人机交互界面感知强度与感知元素重要度指标基础上，构建基于视觉感知强度的人机交互界面优化布置模型并用遗传算法求解该模型。刀具补偿操作界面的实例表明，该方法适用于人机交互界面优化布置设计。

人机交互界面； 视觉感知强度； 遗传算法； 优化布置模型

0　引言

人机交互界面[1]作为实现操作人员获取制造装备关键运行特征信息以及对其进行有效控制的首要途径，其设计的合理与否，直接影响着操作人员对制造装备控制的及时性与准确性。人机交互界面设计不仅要考虑不同工作环境下，界面上各操作单元的重要性、使用频率和功能分组等设计原则，还要充分考虑人体工程学的因素。

英国学者Edward在他的SHEL模型中提出人机界面包括人-硬件界面、人-软件界面、人-环境界面和人-人界面[2]。目前对于人机界面的优化设计研究主要集中在两方面。一是基于认知心理学和人类工效学的基本知识对人机交互界面进行优化布局，提高人机舒适度和安全性。晏群等[3]从人体工程学和用户体验的角度定性地对数控机床操控界面的设计布局进行了研究。张娜等[4]从平衡度、整体度、简洁度和统一度4个方面对人机界面的形态元素布局进行了量化评价，构建了人机界面形态元素布局的综合美度意象计算方法。宫勇等[5]将图形面板的布局特征分为图标的大小、面板结构、面板方向及面板所处的屏幕位置等，通过实验，考察了图形面板的布局特征与反应时间的关系，定性地阐述了图形面板的布局对人机交互效率的影响。张云鹏[6]提出了一种以人类认知规律为基础设计应用系统人机界面的方法，并从人类认知规律的角度总结出设计人机界面的基本原则。二是通过数学模型对人机交互界面进行布局优化，这方面的研究多集中于传统操作界面，并且多基于人体参数模型进行界面优化设计，对于数字化人机界面的优化设计涉及甚少。宋正河等[7]将人机界面中各元件的几何位置可布置区域作为约束条件，以整体界面的匹配优度作为目标函数，构建了机械系统人机界面优化设计的数学模型。金晓萍等[8]提出了一种车辆人机界面布局推理方法，该方法将车辆操作界面设计中所涉及的人体工程学参数和部件尺度转化为计算机可识别的参数表示，形成界面布局推理架构。

本文主要针对数字化人机交互界面的优化设计进行模型构建求解研究，旨在得出一种合理的通用的数字化人机界面的优化设计方法。从人眼视锥细胞感知特性的角度对人机交互界面的感知强度进行等级划分，构建了人机交互界面感知强度等级划分模型，并通过优序法确立人机界面各视觉要素的感知重要度评价模型，基于此构建了基于视觉感知强度的人机交互界面优化模型，并采用遗传算法求解该模型，最后结合刀具补偿操作界面设计的具体实例验证了该模型的有效性与可行性，为提高机械系统数字化人机操作界面的操作效率提供了可行性方法。

1　基于视锥细胞的人机交互界面视觉感知强度划分模型

1.1基于视锥细胞的视觉特征分布分析

研究资料表明视网膜上的感受器细胞具有非均匀分布的特性[9-11]。锥状细胞是视网膜上的明视觉感受器，在视网膜上呈现非均匀分布特性[9]，如图1所示。在视角中心1°的范围内，视锥细胞分布最为密集。随着偏心度的增加，锥状细胞的密度逐渐减小。根据锥状细胞在视网膜上的分布状况，人眼视觉感知强度随着锥状细胞密度的大小而变化，即随着锥状细胞密度的减小，人眼能看到的图像像素强度会越来越弱，视觉感知的强度越来越低。

图1　视锥细胞的非均匀分布特性

如图2所示，根据对人眼视角的研究，人眼在正常情况下视角约为120°，而在集中注意力时，凝视角为原来的五分之一左右，即24°到26°之间，从而得出凝视角与视线中心的夹角为12°到13°之间。

图2　人眼视角与凝视角示意图

1.2人机交互界面视觉感知强度划分模型

均匀图像的界面上，人眼的视觉中心与图像中心重合，越偏离中心，视觉感知强度越低，依据人眼视觉感知特性，建立基于视觉感知特性的人机交互界面视觉强度感知强度划分模型，确定人机交互界面感知强度区域划分。

根据视锥感知理论，视觉感知强度的变化规律与锥状细胞分布一致，由中心向周边区域逐级递减。根据人眼直视界面时，在界面上不同位置的视线与视图中心所成夹角，建立不同感知强度等级的感知场范围。如图3所示，假设人眼距离界面距离为l，人眼到某点的视线与中心线的夹角为θ，因为视觉感知场与视锥细胞分布类似，呈圆形，则视觉感知场的半径r计算公式为

r=ltanθ

(1)

图3　视觉感知场计算示意图

根据用户使用人机界面时的情况和研究的量化需要，将视觉感知场分为5个等级，越靠近中心感知强度越高，以视觉中心为圆心作4个同心圆。凝视角(13°)内，包括1°，共划分成4个等级，角度呈等差数列，即1°、5°、9°、13°，其中1°内的圆表示在人机界面上锥状细胞最为密集的部分，划分为第一等级，依此类推。根据式(1)可计算出视点在偏心角度为1°、5°、9°、13°时区域等级划分状况。平面可根据长宽比的需要，调整区域的数量，方法如上所述，角度呈等比数列增长(若需增加区域数量可取角度17°、21°等)。超过7个区域就应当考虑调整l的大小。

以常用的矩形界面为例(图4)，根据视觉感知强度的分布特征将矩形人机界面区域划分为由最小单元组成的不同等级区域。

图4　视觉感知强度模型

设矩形人机界面短边边长为x，长边边长为y，人眼距离屏幕的距离l，最小单元根据使用习惯划分为正方形，设其边长为a。规定最小单元(正方形)的面积与视觉感知场第一等级面积大小一致，则满足公式：

a2=πr2

(2)

(3)

将整个平面区域划分为多个以a为边长的方形基本单元(图5)。忽略边缘不完整单元格的部分。

图5　人机界面区域划分示意图

根据各个单元格在视觉感知场中所处的位置，定义每个单元格的视觉感知强度等级(在不同区域临界上的单元格按照其在不同区域占有面积的大小选定等级)。以不同的颜色表示其对应的强度等级，形成由基本单元构成的不同强度区域的视觉感知场模型(图6)。

图6　基于基本单元的人机界面视觉感知区域划分

2　基于视觉感知强度的人机界面优化方法

2.1视觉感知元素重要度度量分析

人机界面中各视觉要素的布置要依据重要度的原则，本文在定性分析的基础上，结合优序法[12]，对界面上各个视觉感知元素的重要性进行排序。

图7　视觉感知元素编号示例

如图7所示，将人机界面上的视觉元素按功能模块划分编号，各模块依据其组成元素和面积，可能占有一个或多个基本单元，将每个模块的重要性两两对比，比较重要的填1，一样重要的填0.5，不够重要的填0，最后统计各模块视觉感知要素比较值的总和并进行排序。依据重要元素应处于视觉感知较强区域的原则，结合人机界面的视觉强度区域等级，调整人机界面布局方案。

2.2基于视觉感知强度的人机交互界面优化模型

在人机交互界面各区域视觉感知强度以及视觉感知元素重要度的基础上，以人机界面最终布局的视觉感知强度为优化目标，构建基于视觉感知强度的人机交互界面优化模型。在给出具体的优化模型前，给出如下定义：

(1)Y={y1,y2,…，yn}，Y表示人机交互界面所有视觉感知元素集，yi表示当前第i个视觉感知元素，i=1,2,…，n；

(2)D={d1,d2,…，dn},D表示人机交互界面所有视觉感知元素重要度等级集，di表示当前第i个视觉感知元素的等级值，i=1,2,…，n；

(3)S={s1,s2,…，sn},S表示人机交互界面所有视觉感知元素面积集，si表示当前第i个视觉感知元素的面积值，i=1,2,…，n；

(4)X={x1,x2,…，xm},X表示人机交互界面各区域划分的视觉感知强度集，xj表示当前第j个视觉感知区域的感知强度等级，j=1,2,…，m；

(5)Q={q1,q2,…，qm},Q表示人机交互界面各强度等级感知区域所占的单元格数，即面积数，qj表示当前第j个视觉感知区域所占的单元格数，j=1,2,…，m；

(6)qij表示对视觉感知元素i进行布置时，其在第j强度等级区域所占的单元格数；

(7)R={r1,r2,…，rn},R表示各视觉感知元素布置到人机交互界面后视觉感知强度指数，ri表示当前第i个视觉感知区域所占的单元格数，i=1,2,…，n。

定义1视觉感知强度指数ri是指某一视觉感知元素被布置在人机交互界面某一位置时，该元素的重要度等级di、布置位置所占区域的感知强度等级xj以及在相应布置位置所占单元数qij的乘积，即

(4)

由上述定义可知，视觉感知强度指数越大，视觉感知元素布置的位置越占据整个人机交互界面的核心区域。基于此方法构建基于视觉传达感知强度的人机交互界面优化模型：

(5)

该模型的约束条件如下：

(6)

(7)

(8)

其中，式(6)表示第j等级感知强度等级区域内布置的所有视觉感知元素在该区域所占面积之和；式(7)表示第i个视觉感知元素分布在各个感知强度区域的面积之和等于该感知元素的面积；式(8)表示视觉感知元素的面积之和等于各等级区域面积之和。

根据式(5)可以给出视觉传达指数的定义。

定义2 视觉传达指数是在进行人机交互界面优化布置时，所有视觉感知元素完全布置于人机交互界面后，各视觉感知元素感知强度指数之和。

根据视觉感知指数的定义，Z值越大，说明重要度高的视觉感知元素布置的位置就越处于人机交互界面视觉感知强度越高的区域。

2.3基于遗传算法的人机交互界面优化模型求解

上节建立的模型是一个典型的NP问题，我们采用遗传算法[13]来实现对该模型的求解。以下为针对该问题模型所采用的编码规则以及单个染色体的求解计算过程。

2.3.1模型编码

由于视觉感知元素在人机交互界面布置时需要保证其被合理地布置在各个区域，同时还需要保证各视觉感知要素布置在相连接的人机交互界面区域内，因此基于遗传算法求解染色体时，采用了基于视觉感知元素的编码规则，当有8个视觉感知元素需要布置到人机交互界面时，采用感知元素的编号作为求解染色体的一个基因片段，假设感知元素的编号采用整数编码，取值为1到8，可行的染色体编码为

p1：(2 3 5 6 7 4 8 1)

p2：(5 6 2 3 7 4 8 1)

2.3.2染色体编码求解

根据上述编码规则，人机交互界面布置求解的算法过程如下：

(1)提取基因段尚未进行布置的基因编码，根据该编码获取当前进行布置的视觉感知元素的di、Si等信息。

(2)根据视觉感知区域等级，由高到低，获取尚未布置的视觉感知元素的各视觉感知区域信息，根据面积匹配规则将视觉感知元素布置到该视觉感知区域。

(3)判断当前视觉感知区域是否能够完全布置该视觉感知元素，若不能，转步骤(4)；若能，转步骤(5)。

(4)获取下一等级视觉感知区域，与前序待布置视觉感知区域一起，根据面积匹配规则进行视觉感知元素布置，转步骤(3)。

(5)计算出该视觉感知元素布置完成后的rj值。

(6)判断当前编码所有染色体是否全部解码结束，是，则转步骤(7)，否则转步骤(1)。

(7)根据计算的各结果，获取当前染色编码的Z值，并获取各视觉感知元素在各感知区域的分布信息，完成单个染色体的求解计算。

3　基于视觉感知强度的人机交互界面优化设计实例分析

以一个简单的刀具补偿操作界面为例进行优化设计。优化界面示例如图8所示。该示例为分辨率1280×720的人机界面。

图8　优化界面示例

因为该界面大小与日常使用的计算机相近，为简化计算，可将舒适距离l设为500 mm(也可以多次试验统计相应的数据，确定舒适距离)。采用式(1)计算出视点在1°、5°、9°、13°、17°时半径r的值分别为8.73 mm、43.75 mm、79.19 mm、115.45 mm、152.87 mm。已知半径r，结合式(3)，计算出基本单元的边长a为15.47 mm。然后在界面上构建基本单元组成的网格，如图9所示。

图9　单元划分示意

计算出各个区域的半径之后，依据视觉感知强度等级划分模型将基本单元所在区域的等级用不同颜色标示出来，形成由基本单元组成的人机界面区域等级划分的示意图，见图10。

图10　人机界面区域等级划分示意图

按照功能划分原则，将该刀具补偿操作界面划分为六大模块，如图11所示。其中模块F为空白区域，可以不参与布置。

图11　人机界面模块划分

使用优序法对各个基本单元的重要性等级进行划分。已知需要进行布置的模块有5个，分别为模块A(2×10)、模块B(3×10)、模块C(3×25)、模块D(10×20)、模块E(2×13)。

评估的依据如下：该界面为某操作界面的刀具补偿调整的功能界面，模块D为主要显示界面，其关注程度必然是最高的，也是打开该界面时用户最为关注的模块；其次就应当是模块C，模块C的中央两个小模块中有正在执行的任务进度相关参数，如刀具位置、主轴转速、进给速度等，是用户次要关注的模块;模块E为该界面特有的操作模块，与模块A、模块B不同，模块A、模块B在该系统中其他界面也有显示，在该界面中使用频率一般小于模块E。

按照上述规则，比较各个要素的重要程度，列出表1并统计出结果，建立表2，得到重要性程度排序。

表1　优序法——模块重要程度评估表

表2　优序法——重要性程度排序表

统计人机界面上的基本单元(所有小正方形)的数量，结果为375。同时统计6个区域基本单元的数量，设为an。a1到a6对应视觉强度感知等级Ⅰ、Ⅱ、Ⅲ、Ⅳ、Ⅴ、Ⅵ所占的基本单元数，统计结果分别为1、20、48、108、80、118。

依据前文遗传算法的求解方法，采用基于视觉感知元素的编码规则方式进行编码，单个染色体编码长度为6，初始求解种群规模为50，收敛代数为1000，交叉概率为0.5，变异概率为0.05，对该问题进行求解。

根据现有的布局，各视觉感知元素的布局如表3所示。

表3　优化前各模块不同重要等级的基本单元构成

然后参照图12统计各个模块在不同强度等级区域所占的基本单位数量，根据式(5)计算人机交互界面布置的视觉传达指数Z=4694。

图12　Z值计算参照图

应用遗传算法进行求解，求得的一组最优解的编码规则为：DCEABF，得出相应的分布如表4所示。

表4　优化后各模块不同重要等级的基本单元构成

根据表4和式(5)，人机交互界面布置视觉传达指数Z=4762。

图13为优化后各个模块相对位置的示意图。为了界面的美观，有些需要对齐的部分或其他需要符合人机界面优化规则的部分可在定性分析的基础上进行适当调整，但是各模块的相对位置不应有太大的变动，最终得出优化结果，如图14所示。

图13　基于Z值优化后的参考界面

图14　优化后的刀具补偿操作界面

4　结束语

本文构建了基于视锥细胞的视觉分布特征人机交互界面感知强度划分模型，实现了对已知界面视觉感知强度等级区域的划分；应用优序法实现了对人机交互界面感知元素重要度的有效度量；在此基础上建立了基于视觉感知强度的人机交互界面布置优化模型。刀具补偿操作界面的实例验证了该模型对数字化人机交互界面的优化布置设计的可行性，并且该方法具有通用性，完全适用于其他人机交互界面的优化设计，从而为人机交互界面的优化提供了一套量化可行的方法。

[1]李乐山.人机界面设计[M].北京:科学出版社,2004.

[2]HawkinsFN.HumanFactorsinFlight[M]. 2nded.Sydney:AveburyAviation, 1995.

[3]晏群,庄德红.数控机床人机界面及造型设计研究[J].机械设计,2013,30(12):111-113.

YanQun,ZhuangDehong.ResearchonHuman-MachineInterfaceandModelingDesignoftheCNCLathe[J].JournalofMachineDesign, 2013,30(12):111-113.

[4]张娜,王家民,杨延璞.人机界面形态元素布局设计美度意象的评价方法[J].机械科学与技术,2015,34(10):1-5.

ZhangNa,WangJiamin,YangYanpu.EvaluationMethodofAestheticImageforMan-machineInterfaceFormElementsLayoutDesign[J].MechanicalScienceandTechnologyforAerospaceEngineering, 2015, 34(10):1-5.

[5]宫勇,杨颖,张三元,等.图形面板布局特征对人机交互效率的影响[J].计算机辅助设计与图形学报,2012,24(9):1145-1150.

GongYong,YangYing,ZhangSanyuan，etal.EffectsofGraphicalPanelLayoutCharacteristicsonHuman-computerInteractiveEfficiency[J].JournalofComputer-aidedDesign&ComputerGraphics, 2012, 24(9):1145-1150.

[6]张云鹏.基于认识心理学知识的人机界面设计[J].计算机工程与应用,2005,41(30):105-107.

ZhangYunpeng.Human-computerInterfaceDesignBasedonKnowledgeofCognitivePsychology[J].ComputerEngineeringandApplications, 2005,41(30):105-107.

[7]宋正河,毛恩荣,周一鸣.机械系统人机界面优化设计模型的研究[J].机械设计与制造,2006(2):35-37.

SongZhenghe,MaoEnrong,ZhouYiming.StudyontheOptimalDesignofHuman-machineInterfaceinMechanicalSystem[J].MachineryDesign&Manufacture, 2006(2):35-37.

[8]金晓萍,仇莹,毛恩荣,等.车辆人机界面布局优化推理系统研究[J].农业机械学报,2008,39(4):183-186.

JinXiaoping,QiuYing,MaoEnrong,etal.StudyontheOptimalLayoutReasoningSystemofHuman-machineInterfaceinVehicles[J].TransactionsoftheChineseSocietyforAgriculturalMachinery, 2008, 39(4):183-186.

[9]谢春兰.视觉注意模型及其在目标检测中的应用研究[D].重庆:重庆大学,2009.

[10]訾方.视觉注意机制及其在红外图像处理中的应用研究[D].西安:西北工业大学, 2005.

[11]PoratM,ZeeviYY.TheGeneralizedGaborSchemeofImageRepresentationinBiologicalandMachineVision[J].IEEETransactionsonPatternAnalysisandMachineIntelligence, 1988, 10(4): 452-468.

[12]张小之,朱传喜.多属性决策的广义等级偏好优序法[J].系统工程理论与实践,2013,33(11):2852-2858.

ZhangXiaozhi,ZhuChuanxi.GeneralizedPrecedenceOrderMethodwithRankingPreferenceforMulti-attributeDecisionMaking[J].SystemEngineering-theory&Practice, 2013, 33(11):2852-2858.

[13]XieNan,LiAiping.ReconfigurableProductionLineModelingandSchedulingUsingPetriNetsandGeneticAlgor[J].ChineseJournalofMechanicalEngineering. 2006, 19(3):362-367.

(编辑袁兴玲)

OptimizationDesignofHumanMachineInteractionInterfaceBasedonVisualPerception

ZhangBaoDingMinLiYanjie

HefeiUniversityofTechnology,Hefei,230009

InordertoimprovethevisualcomfortandefficiencyofHMIinterface,anoptimizedmethodofHMIinterfacewasproposedbasedonvisualperception.Firstly,accordingtosensingintensityofconecells,thepartitionmodelofHMIinterfacewasestablished.Secondly,theprioritygradingmethodwasscientificallyusedtomeasurethevisualperceptionalgradation.Finally,basedonthesensingintensityofHMIinterfaceandtheimportanceindexofperceptionalelements,theoptimallayoutmodelofHMIinterfacewasestablishedonthebasisofvisualperception,andthismodelwassolvedbygeneticalgorithm.TheexamplesoftoolcompensationinterfaceshowthatthismethodissuitablefortheoptimallayoutdesignofHMIinterface.

humanmachineinteraction(HMI)interface;visualperception;geneticalgorithm;optimallayoutmodel

2015-11-04

国家自然科学基金资助项目(51375134)

TH122

10.3969/j.issn.1004-132X.2016.16.012

张宝，男，1974年生。合肥工业大学建筑与艺术学院副教授。主要研究方向为视觉传达理论及其综合应用、工业设计及工业工程相关理论与应用。发表论文15篇。丁敏，女，1992年生。合肥工业大学建筑与艺术学院硕士研究生。李燕杰，男，1989年生。合肥工业大学建筑与艺术学院硕士研究生。