王 寧, 余隋懷, 周 憲, 肖琳臻
(西北工業(yè)大學(xué)陜西省工業(yè)設(shè)計(jì)工程實(shí)驗(yàn)室,陜西 西安 710072)
人機(jī)交互界面中形狀特征的視覺顯著度計(jì)算
王 寧, 余隋懷, 周 憲, 肖琳臻
(西北工業(yè)大學(xué)陜西省工業(yè)設(shè)計(jì)工程實(shí)驗(yàn)室,陜西 西安 710072)
形狀特征是影響人機(jī)交互界面視覺工效的關(guān)鍵因素,為使人機(jī)交互界面能更好地適應(yīng)用戶的生理及心理特性、提升用戶體驗(yàn),需要建構(gòu)一種人機(jī)交互界面中形狀特征的視覺顯著度計(jì)算模型。在分析形狀特征對視覺顯著度影響程度的基礎(chǔ)上,針對人機(jī)交互界面中的典型形狀,利用內(nèi)接正方形將形狀分割為多個部分,使用相關(guān)三角形對形狀部分的視覺顯著度進(jìn)行計(jì)算,取其中最大值作為形狀的視覺顯著度,實(shí)現(xiàn)形狀視覺顯著度的量化分析與計(jì)算,并通過眼動追蹤實(shí)驗(yàn)驗(yàn)證該方法的有效性。
交互設(shè)計(jì);人機(jī)交互界面;形狀特征;視覺顯著性;視覺工效
人機(jī)交互界面(human-machine interface,HM I)是人、機(jī)器、環(huán)境共同作用的區(qū)域,隨著產(chǎn)品功能越來越復(fù)雜,HM I在單位時間和單位空間內(nèi)輸出的信息也越來越多,其中用戶所接收的信息中約80%為視覺信息[1-2]。人類對視覺系統(tǒng)信息處理的能力是有限的,無法同時處理所有的視覺信息,況且并非所有的視覺信息都具有同樣的重要性,因此用戶往往只會對重要的視覺信息給予視覺注意,而不太關(guān)注不重要的信息,甚至忽略這部分信息。視覺注意機(jī)制在信息篩選的過程中起著關(guān)鍵的作用,會使用戶主動注意到某些顯著的、重要的信息,保證用戶能夠及時處理危險(xiǎn)、突發(fā)事件。因此,理解人類的視覺注意機(jī)制對HM I設(shè)計(jì)有重要的作用。在HM I中存在多個組成部分,如
操控器、顯示器等,其組成部分具有多種對視覺注意產(chǎn)生影響的視覺特征,如色彩、形狀、紋理、空間位置等。其中形狀是一種重要的視覺特征,形狀在HM I中具有傳遞信息量大、抗干擾能力強(qiáng)、易于接收等優(yōu)點(diǎn),且對形狀辨認(rèn)后所獲取的信息和辨認(rèn)的客體有形象上的直接聯(lián)系[3],同時形狀還能表達(dá)一定的語義,是用戶對HM I中元件進(jìn)行識別的關(guān)鍵因素,因此形狀特征對于HM I設(shè)計(jì)有著重要意義。
國內(nèi)外的學(xué)者從多個角度對形狀特征引起的視覺注意展開了研究。W ilson[4]分析了形狀曲率對視覺顯著度的影響;Hoffman和 Singh[5]提出相對尺寸、突起、邊界強(qiáng)度是影響視覺顯著度的 3個因素,并對這些因素如何影響視覺顯著度做出了估計(jì);De Winter和Wagemans[6]給出了伸展度、緊致度、轉(zhuǎn)角等因素與形狀部分視覺顯著度之間的關(guān)系;Cohen和 Singh[7]提出形狀部分的輪廓長度會對視覺顯著性產(chǎn)生影響;賴重遠(yuǎn)[8]利用相關(guān)三角形計(jì)算形狀部分的視覺顯著性;張坤等[9]通過眼動分析實(shí)驗(yàn)比較了安全標(biāo)志上不同形狀對視覺顯著度的影響。
上述研究為定量的分析形狀特征的視覺顯著度提供了基礎(chǔ),但大部分研究主要集中在形狀部分的視覺顯著度分析與計(jì)算,不適合對完整形狀的視覺顯著度進(jìn)行分析。本文以形狀部分的視覺顯著性分析與計(jì)算方法為基礎(chǔ),選取 HM I中出現(xiàn)頻率較高的典型形狀,之后利用內(nèi)接正方形把形狀分解為多個部分,將形狀的視覺顯著度計(jì)算轉(zhuǎn)化為形狀部分視覺顯著度的計(jì)算,利用相關(guān)三角形分別計(jì)算各個部分的視覺顯著度,取其中最大值作為形狀的視覺顯著度。
形狀包含了多種基本屬性[10],如面積、曲率、轉(zhuǎn)角、輪廓類型等,下面分別對視覺顯著度產(chǎn)生影響的屬性進(jìn)行分析。
(1) 面積:視覺心理學(xué)的研究表明,形狀的面積越大,在視網(wǎng)膜上引起的響應(yīng)區(qū)域就越大,就越容易引起視覺注意,即具有越高的視覺顯著度,形狀的面積與視覺顯著度之間大體上呈線性的關(guān)系[3,5]。
(2) 轉(zhuǎn)角:形狀的轉(zhuǎn)角(圖1中的α1與α2)與人類的視覺特性最為接近[11]。形狀部分的顯著度隨著轉(zhuǎn)角的增加而增加,增速先增后減。文獻(xiàn)[9]通過眼動分析實(shí)驗(yàn)得出安全標(biāo)志形狀中的銳角越多,越容易識別并易引起視覺注意;鈍角越多,在幾何形狀上越接近圓的形狀識別難度越大,印證了轉(zhuǎn)角與視覺顯著度之間的關(guān)系。
圖1 形狀的轉(zhuǎn)角
(3) 輪廓類型:形狀的輪廓變化越劇烈,越容易吸引視覺注意[12],且人眼對直線輪廓比曲線輪廓更加敏感,因此由直線構(gòu)成且變化劇烈的輪廓比由曲線構(gòu)成且變化平緩的輪廓有更高的視覺顯著度。
以上分析了幾種對形狀視覺顯著度產(chǎn)生影響的屬性,但形狀的視覺顯著度是多個屬性共同作用的結(jié)果,用單一的屬性來描述形狀視覺顯著度并不精確,并且不符合人類的視覺規(guī)律,因此需要一種能考慮到多種對形狀特征視覺顯著度產(chǎn)生影響的屬性的計(jì)算模型。
文獻(xiàn)[8]使用相關(guān)三角形來定量計(jì)算形狀部分的顯著度,取得了較好的效果。但是 HM I中組成部分的輪廓都是完整的形狀,本文的思路是將HM I中組成部分的輪廓所構(gòu)成的形狀分解成多個部分,求取每一部分的視覺顯著度,取其中視覺顯著度的最大值作為該元件的視覺顯著度。
圖2 形狀部分的相關(guān)三角形
設(shè)在HM I中有n個組成部分,每一部分的輪廓都可以構(gòu)成完整的形狀,形狀經(jīng)分割后形成m個部分,每個部分相應(yīng)的可以構(gòu)建相關(guān)三角形(圖2),圖2中線段AB為分割線,也稱為基底,A、B為分割出的部分的邊界點(diǎn),C為部分輪廓上的點(diǎn),a、b為相關(guān)三角形的兩個邊,α為轉(zhuǎn)角。則形狀中分割出的部分的視覺顯著度為
本文分析35款國內(nèi)外數(shù)控機(jī)床的HM I,歸納出6種HM I中的常用形狀(圖3),分別為正方形、帶有倒角的正方形、矩形、圓形、橢圓形、三角形。以正方形為例說明形狀分割的方法,首先在形狀內(nèi)部建立一個內(nèi)接正方形,保證內(nèi)接正方形的4個頂點(diǎn)都在形狀的輪廓上,如圖3(a)中的虛線所示,這樣內(nèi)接正方形的4條邊可以看做是4條分割線,這
4條分割線將形狀分割為5個部分,分別為ΔHAB、ΔBCD、ΔDEF、ΔFGH以及內(nèi)接正方形□BDFH,點(diǎn)B、D、F、H為分割出的部分的邊界點(diǎn),點(diǎn)A、C、E、G為分割出的部分的輪廓點(diǎn)。根據(jù)相關(guān)三角形的定義,ΔHAB、ΔBCD、ΔDEF、ΔFGH也是分割出的部分的相關(guān)三角形,而正方形□BDFH處于形狀的內(nèi)部,對該形狀的視覺顯著度并無太大的影響。因此,對形狀的視覺顯著度度量主要是考量ΔHAB、ΔBCD、ΔDEF、ΔFGH的視覺顯著度。
圖3 人機(jī)交互界面中典型形狀的分割
對于相關(guān)三角形ΔHAB,其視覺顯著度的計(jì)算式為
其中,a= b= HA = AB ,α=90°,則有
相應(yīng)地,可以計(jì)算出相關(guān)三角形ΔBCD、ΔDEF、ΔFGH的視覺顯著度。
形狀的視覺顯著度由其分割后形成各個部分的顯著度的最大值決定,即
因4個三角形全等,所以正方形的視覺顯著度等于任意一個分割出的三角形部分的視覺顯著度。
接下來討論等邊三角形的視覺顯著度計(jì)算方法,部分的分割方法與正方形的分割方法類似,經(jīng)分割后得到4個部分,分別是ΔGAB、ΔBCD、ΔEFG及□GBDE (圖3(f)),其中ΔGAB、ΔBCD、ΔEFG即為分割出的形狀的相關(guān)三角形,□GBDE處于形狀的內(nèi)部,對該形狀的視覺顯著度的影響較小,因此,對形狀的視覺顯著度度量主要是考量 ΔGAB、ΔBCD、ΔEFG的視覺顯著度。
對于相關(guān)三角形ΔGAB,其視覺顯著度的計(jì)算式如下
由于a1= b1= GA = AB ,α=120°,則有
對于相關(guān)三角形 ΔBCD、ΔEFG,由于并不是等腰三角形,其視覺顯著度不大于三角形基底中線長度,不小于輪廓點(diǎn)到基底的最短絕對距離[8],因此相關(guān)三角形ΔBCD、ΔEFG視覺顯著度取值為
設(shè)等邊三角形的邊長為 l,計(jì)算可得,F(xiàn)Q= CR = 0.35l,AP=0.4l。因?yàn)锳P >FQ =CR ,則
所以等邊三角形的視覺顯著度為
其他形狀的視覺顯著度計(jì)算思路與上述的2個圖形類似,本文不再贅述。
本文通過眼動追蹤實(shí)驗(yàn)對所提出的計(jì)算模型進(jìn)行驗(yàn)證。共實(shí)驗(yàn)過程如下:
(1) 實(shí)驗(yàn)樣本。實(shí)驗(yàn)樣本人數(shù) 20名,年齡為19~21歲,其中10名為西北工業(yè)大學(xué)工業(yè)設(shè)計(jì)系本科生,10名為工業(yè)工程系本科生,視力或矯正視力正常。
(2) 實(shí)驗(yàn)設(shè)備。ASL EYE-TRAC6眼動追蹤系統(tǒng)、HP圖形工作站及液晶顯示器。
(3) 實(shí)驗(yàn)材料。6個形狀,分別為正方形、帶有倒角的正方形、矩形、圓形、橢圓形、等邊三角形,以同樣的中性灰色填充。
(4) 實(shí)驗(yàn)步驟。實(shí)驗(yàn)開始后,每次測試計(jì)算機(jī)屏幕將在橫向方向上同時顯示2個形狀,顯示時間為10 s,樣本在無任務(wù)提示的情況下觀察測試圖,眼動追蹤系統(tǒng)將自動記錄樣本視線的移動及注視情況,在此過程中樣本無需進(jìn)行其他操作。每個樣本需進(jìn)行測試的次數(shù)為6(6–1)/2=15(次)。
通過眼動追蹤實(shí)驗(yàn)得到 20個樣本在觀察每張測試圖時注視情況,其中正方形與圓形對比測試圖、三角形與矩形對比測試圖的實(shí)驗(yàn)數(shù)據(jù)如表1、2所示,其他測試圖的樣本注視實(shí)驗(yàn)數(shù)據(jù)略。
表1 正方形和圓形對比時的注視情況
表2 三角形和矩形對比時的注視情況
通過表1實(shí)驗(yàn)數(shù)據(jù)可以看出,當(dāng)正方形和圓形以測試圖中的比例關(guān)系同時出現(xiàn)時,樣本注視正方形的次數(shù)較多,注視持續(xù)時間較長,且在觀察初期即注視正方形,而開始注視圓形的時間較晚,說明正方形與圓形相比,更能吸引樣本的視覺注意,即具有更高的視覺顯著度。
根據(jù)表2中的實(shí)驗(yàn)數(shù)據(jù),當(dāng)三角形和矩形以測試圖中的比例關(guān)系同時出現(xiàn)時,兩者的注視點(diǎn)數(shù)量接近,說明樣本觀察兩個圖形的次數(shù)基本相同,在初次注視時間上兩者也很接近,說明樣本對兩個圖形投入近似的視覺注意,也就是兩個圖形具有類似的視覺顯著性。
將實(shí)驗(yàn)中6個形狀兩兩比較,當(dāng)形狀1的視覺顯著度大于形狀2時,形狀1計(jì)1分,形狀2計(jì)0分,將每個形狀的得分相加,得出的總分為該形狀視覺顯著度的水平,如表3所示。
通過表3得出的6個形狀的視覺顯著度分值,其按照視覺顯著度從大到小的排序?yàn)椋簷E圓形、三角形、矩形、正方形、帶有倒角的正方形、圓形。
利用本文提出的形狀視覺顯著度計(jì)算方法可得出各形狀視覺顯著度,如表4所示。6個形狀的視覺顯著度由大到小排序與眼動追蹤實(shí)驗(yàn)得到的結(jié)果是一致的,證明本文所提出的 HM I形狀特征的視覺顯著度計(jì)算模型能較好地反應(yīng)出人類在觀察形狀時視覺注意機(jī)制的特性,對形狀的視覺顯著度有很好的預(yù)測能力。
表3 不同形狀的注視情況配對比較
表4 各形狀的視覺顯著度值
本文針對HM I中常用的形狀,建立HM I中形狀的視覺顯著度量化計(jì)算模型。首先歸納出 HM I中常用的幾種形狀,利用內(nèi)接正方形將形狀分割為多個部分,將對形狀視覺顯著度的計(jì)算轉(zhuǎn)化為形狀部分視覺顯著度的計(jì)算。再用相關(guān)三角形計(jì)算每一個分割出的部分的視覺顯著度,取其中的最大值作為形狀的視覺顯著度。最后通過眼動追蹤實(shí)驗(yàn)進(jìn)行驗(yàn)證,證明所提出的計(jì)算模型能較好的預(yù)測 HM I中形狀特征的視覺顯著度,為進(jìn)行 HM I的視覺工效設(shè)計(jì)與優(yōu)化提供依據(jù)。
HM I中各組成部分的視覺顯著度是多種視覺特征共同作用的結(jié)果,形狀特征是其中比較重要的影響因素,其他的視覺特征如色彩、空間位置、材質(zhì)等都會對 HM I中組成部分的視覺顯著度產(chǎn)生影響。探討其他的獨(dú)立視覺特征及多個視覺特征共同作用對視覺顯著度的影響,并建立相應(yīng)的量化計(jì)算模型是后續(xù)研究工作的重點(diǎn)。
[1] Jacobson N, Bender W. Color as a determ ined communic-ation [J]. IBM Systems Journal, 1996, 35(3/4): 526-538.
[2] Wyszecki G, Stiles W S. Color science [M]. New York: Jonh Wiley & Sons, 2000: 16.
[3] 丁玉蘭. 人機(jī)工程學(xué)[M]. 北京: 北京理工大學(xué)出版社, 2005: 90.
[4] Wilson H R. Discrimination of contour curvature: data and theory [J]. Journal of the Optical Society of America, A, 1985, 2(7): 1191-1198.
[5] Hoffman D D, Singh M. Salience of visual parts [J]. Cognition, 1997, 63: 29-78.
[6] De Winter J, Wagemans J. Perceptual saliency of points along the contour of everyday objects: a large-scale study [J]. Perception and Psychophysics, 2008, 70(1): 50-64.
[7] Cohen E H, Singh M. Geometric determinants of shape segmentation: tests using segment identification [J]. Vision Research, 2007, 47: 2825-2840.
[8] 賴重遠(yuǎn). 形狀部分的視覺顯著度與形狀編碼[D]. 武漢:華中科技大學(xué), 2013.
[9] 張 坤, 崔彩彩, 牛國慶, 等. 安全標(biāo)志邊框形狀及顏色的視覺注意特征研究[J]. 安全與環(huán)境學(xué)報(bào), 2014, 14(6): 18-22.
[10] 朱 浩. 沖裁件幾何形狀特征識別[J]. 工程圖學(xué)學(xué)報(bào), 2005, 26(4): 109-113.
[11] Scasselati B, Alexopoulos S, Flickner M. Retrieving images by-2D shape: a comparison of computation methods w ith human perceptual judgments [J]. Proceedings of Spie the International Society for Optical Engineering, 1994, (2185): 2-14.
[12] Attneave F. Some informational aspects of visual perception [J]. Psychological Review, 1954, 61(3): 183-193.
Visual Salience Calculation of Shape Feature for Human-M achine Interface
Wang Ning, Yu Suihuai, Zhou Xian, Xiao Linzhen
(Shaanxi Engineering Laboratory for Industrial Design, Northwestern Polytechnical University, Xi’an Shaanxi 710072, China)
Shape feature is an important element of visual ergonom ics of human-machine interface. In order to improve the user experience and increase operation efficiency, a visual saliency calculation model for shape features of human-machine interface isproposed. The influence of shape features to visual saliency is analysed and several specific shapes are obtained which are used in huaman-machine interface frequently at first. The inscribed square is used to segment the shapes and some specific parts are got consequently. The triangle is related to the parts to calculate the parts’visual saliency. The maximal value of parts’ visual saliency is taken as the visual saliency of the shape. An eye tracking experiment verifies the effectiveness of the proposed visual saliency calculation model.
interaction design; human-machine interface; shape feature; visual salience; visual ergonomics
TB 47
10.11996/JG.j.2095-302X.2016040514
A
2095-302X(2016)04-0514-05
2015-12-02;定稿日期:2016-01-18
國家科技支撐計(jì)劃項(xiàng)目(2 0 1 5 BAH 2 1 F 0 1);西安市科技計(jì)劃項(xiàng)目(FW 1 4 0 9)
王 寧(1981–),男,遼寧阜新人,工程師,博士研究生。主要研究方向?yàn)橛?jì)算機(jī)輔助工業(yè)設(shè)計(jì)、視覺工效等。E-mail:ningdesign@hotmail.com