基于視覺感知強度的人機交互界面優化設計

張　寶　丁　敏　李燕杰

合肥工業大學，合肥，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年生。合肥工業大學建筑與藝術學院碩士研究生。