吳偉

摘 ?要： 采用新型儲能變流器的電子設(shè)備人機(jī)界面色彩設(shè)計方法，未增強(qiáng)界面圖像的顯示效果，導(dǎo)致界面的關(guān)注時長較短，文中提出基于視覺傳達(dá)的電子設(shè)備人機(jī)界面色彩設(shè)計方法。基于視覺傳達(dá)的視覺信息認(rèn)知分為輸入信息、信息認(rèn)知加工、認(rèn)知決策和行為反應(yīng)，通過多次加工后的輸入信息促使視覺元素具備意識和情緒狀態(tài)，電子設(shè)備使用者根據(jù)人機(jī)界面視覺信息做出決策;在此基礎(chǔ)上采用多分辨多尺度Retinex算法，增強(qiáng)人機(jī)界面圖像的色彩顯示效果，設(shè)計燈光信號色彩，分析不同電子設(shè)備人機(jī)界面光電信號色彩的搭配，使人機(jī)界面色彩符合使用需求，色彩編碼過程通過分割錯覺調(diào)整人機(jī)界面視覺比例，提升人機(jī)界面的視覺關(guān)注度。實驗結(jié)果表明，所提方法設(shè)計電子設(shè)備人機(jī)登入界面和主程序界面的平均注視時長均為9.5 s，使用者的視覺專注度較高，是一種有效的電子設(shè)備人機(jī)界面色彩設(shè)計方法。

關(guān)鍵詞： 視覺傳達(dá); 電子設(shè)備; 人機(jī)界面; 色彩設(shè)計; 信息認(rèn)知加工; 多分辨多尺度Retinex算法

中圖分類號： TN99?34; TB472 ? ? ? ? ? ? ? ? ? 文獻(xiàn)標(biāo)識碼： A ? ? ? ? ? ? ? ? ? ?文章編號： 1004?373X（2019）10?0156?05

Design of human?computer interface color based on visual

communication for electronic equipment

WU Wei

（Qingdao University of Science & Technology， Qingdao 266061， China）

Abstract： A color design method for the human?computer interface of the electronic equipment using a new energy storage converter cannot enhance the display effect of the interface image， resulting in short time duration of interface attention. Therefore， a human?computer interface color design method based on visual communication is proposed for electronic equipment. The visual information recognition based on visual communication is divided into information input， information cognitive processing， cognitive decision?making， and behavioral response. The input information after many times of processing makes the visual elements have consciousness and emotional states. The electronic equipment users make decisions according to the visual information of the human?computer interface. On this basis， the multi?resolution multi?scale Retinex algorithm is adopted to enhance the color display effects of human?computer interface images. The color of light signals is designed and the photoelectric signal color collocation is analyzed for the human?computer interfaces of different electronic devices， so as to make the color of the human?computer interface comply with the usage requirement. The visual ratio of the human?computer interface is adjusted by using the segmentation illusion during the color coding process， so as to improve the visual attention degree of the human?computer interface. The experimental results show that the electronic equipment designed by the proposed method has an average attention time duration of 9.5 s for the human?computer login interface and main program interface， and a high visual concentration degree of users， which is an effective human?computer interface color design method of electronic equipment.

Keywords： visual communication; electronic equipment; human?computer interface; color design; information cognitive processing; multi?resolution multi?scale Retinex algorithm

人們獲取電子設(shè)備運(yùn)行狀態(tài)的信息大部分來自于人機(jī)界面中各要素的視覺表達(dá)，視覺認(rèn)知即采用視覺對所見之物進(jìn)行辨別、理解和判決，該過程除視覺上獲取的信息外，還需要人腦對所獲取信息的多次加工，得到事物的整體情況[1]。人機(jī)界面是人機(jī)交互技術(shù)的重要組成，該界面表現(xiàn)出各種視覺信息為使用者的判斷提供依據(jù)，電子設(shè)備的人機(jī)界面具有結(jié)構(gòu)復(fù)雜、多維表現(xiàn)和海量信息的特點(diǎn)。色彩是人眼最靈敏的視覺感知信息，人機(jī)界面色彩設(shè)計的好壞直接決定著人機(jī)界面使用的效果。人機(jī)界面設(shè)計中的色彩不是越多越好，人機(jī)界面色彩設(shè)計的目的為加強(qiáng)使用者的視覺效果[2]。人機(jī)界面中色彩的有效設(shè)計對提升使用者在信息感知方面的能力有較強(qiáng)幫助，可提升任務(wù)的執(zhí)行效率。

以往采用圖元火控系統(tǒng)和新型儲能變流器的電子設(shè)備人機(jī)界面色彩設(shè)計方法，設(shè)計出的電子設(shè)備人機(jī)界面的關(guān)注時長較短，使用者無法高效率地執(zhí)行任務(wù)，而采用視覺傳達(dá)技術(shù)可根據(jù)人體視覺信息的傳達(dá)[3]，設(shè)計符合使用者的人機(jī)界面色彩。

1 ?基于視覺傳達(dá)的電子設(shè)備人機(jī)界面色彩設(shè)計

1.1 ?基于視覺傳達(dá)的視覺信息認(rèn)知

視覺信息的認(rèn)知是指使用者在電子設(shè)備人機(jī)界面操作時，所具備的理解、判斷和決策等信息處理過程。視覺信息的認(rèn)知流程接近計算機(jī)的工作原理，使用者在電子設(shè)備人機(jī)界面中完成視覺信息的加工和認(rèn)知，且人機(jī)界面中的信息不斷更新，促進(jìn)使用者在電子設(shè)備人機(jī)界面中完成具體任務(wù)[4]。電子設(shè)備人機(jī)界面中視覺信息的輸入、輸出和決策為復(fù)雜的認(rèn)知過程，使用者與人機(jī)界面的信息交流需確保界面信息有效的傳遞給使用者，便于使用者快速地對相應(yīng)的信息給出具體的分析和決策。

視覺信息傳達(dá)流程如圖1所示，分為輸入信息、信息認(rèn)知加工、決策和行為反應(yīng)四部分。人機(jī)界面中的信息應(yīng)服務(wù)人體的感官，人體根據(jù)感知到的各種信息得到短暫的記憶印象[5]，即圖1中的輸入信息;在經(jīng)過多次加工后的輸入信息促使視覺元素具有一定的意識和情緒狀態(tài)，使用者依照自己的經(jīng)驗知識檢索出這些狀態(tài)，然后做出有效的判斷和決定;依照做出的判決，使用者針對電子設(shè)備人機(jī)界面給出的信息做出實際反應(yīng)。

圖1 ?視覺信息認(rèn)知流程

1.2 ?電子設(shè)備人機(jī)界面色彩設(shè)計

電子設(shè)備人機(jī)界面中顯示的信息為圖像信息，視覺信息認(rèn)知中，信息刺激包括色彩，在電子設(shè)備人機(jī)界面圖像色彩設(shè)計中，需要同時協(xié)調(diào)電子設(shè)備控制器、顯示器與人體運(yùn)動器官、感官的關(guān)系，其關(guān)聯(lián)電子設(shè)備與使用者對應(yīng)關(guān)系的認(rèn)知和匹配關(guān)系，因為色彩顏色在電子設(shè)備的面板控制、外部操作和編碼方面作用顯著[6]。因此，說明電子設(shè)備人機(jī)界面的色彩設(shè)計是確保電子設(shè)備穩(wěn)定工作的關(guān)鍵環(huán)節(jié)。對電子設(shè)備人機(jī)界面色彩的設(shè)計包括面板色彩處理、燈光信號色彩處理和電子設(shè)備色彩編碼三部分。

1.2.1 ?界面面板色彩處理

電子設(shè)備人機(jī)界面色彩設(shè)計均關(guān)系到界面的注目性和能見度，對界面色彩的設(shè)計需要設(shè)計者根據(jù)不同的電子設(shè)備具體做出設(shè)計。電子設(shè)備前部面板的顏色可選擇明亮度較差的淡藍(lán)色，在面板關(guān)鍵區(qū)域的顯示可選擇顏色較突出的明亮顏色，但電子設(shè)備的接口插件和控制器等均屬于常用的零件，用明亮的顏色顯示可能造成人機(jī)界面的不協(xié)調(diào)[7]?？刹捎玫咨嘟柿炼认嗖钶^大的色彩表示顯示區(qū)域和電子設(shè)備的控制區(qū)域，以提升電子設(shè)備人機(jī)界面的協(xié)調(diào)性。

采用多分辨多尺度 Retinex（Multi Resolution and Multi Scale Retinex，MRMSR） 算法，可增強(qiáng)電子設(shè)備人機(jī)界面圖像的顯示效果，該算法具體采用直方圖自動截斷拉伸操作，根據(jù)設(shè)置適當(dāng)?shù)慕財嘀祦砀纳茍D像的拉伸效果，增強(qiáng)圖像的顯示效果，截斷拉伸公式為：

[Tout=0， ? ? ? ? ? ? ? ? ? ? ? ? ? ?TinThigh] （1）

式中：[Tin]和[Tout]分別為界面色彩通道的輸入和輸出值;[emax]表示界面圖像輸出的最大動態(tài)范圍值，該值為254;[Thigh]和[Tlow]分別表示直方圖的上限和下限截點(diǎn)，其表達(dá)式為：

[Thigh=α+hβTlow=α-hβ] ? （2）

式中，[α]和[β]分別表示人機(jī)界面圖像色彩通道的均值和標(biāo)準(zhǔn)差，且公式中常數(shù)h的取值嚴(yán)重影響著界面圖像色彩的增強(qiáng)效果[8]，存在h值越大界面色彩均衡度較高、亮度信息較低和界面圖像模糊的現(xiàn)象，將該參數(shù)稱為圖像增強(qiáng)分辨度參數(shù)。

根據(jù)參數(shù)h對人機(jī)界面圖像色彩增強(qiáng)效果的影響，且高斯環(huán)繞尺度[c]與h間存在圖像互補(bǔ)特性，因此采用多分辨多尺度Retinex算法提升電子設(shè)備人機(jī)界面彩色圖像增強(qiáng)算法，計算過程如下：[r（x，y）=qw?w，qQ·S（x，y）-W·Fx，y] （3）

式中：[r（x，y）]為增強(qiáng)后的人機(jī)界面色彩圖像;[S（x，y）]為人機(jī)界面的原始色彩圖像;函數(shù)[F（x，y）]為中心環(huán)繞函數(shù);[Q]為多分辨的數(shù)量;[W]為環(huán)繞函數(shù)的數(shù)量;權(quán)值[?]為：

[?w，q=1W·Q] ? （4）

多分辨多尺度 Retinex算法的計算過程為：

1） 將原始的人機(jī)界面色彩圖像分解為紅色（R）、藍(lán)色（B）和綠色（G）三種分量圖，將三種分量用對數(shù)表示。

2） 采用中心/環(huán)繞高斯函數(shù)構(gòu)建W個尺度不同高、中、低的高斯/中心環(huán)繞函數(shù)。

3） 根據(jù)步驟2）中構(gòu)建的高斯/中心環(huán)繞函數(shù)對步驟1）中三種分量的對數(shù)表達(dá)實施濾波處理，并完成對入射圖像的估算和反射圖像的計算。

4） 假設(shè)共有Q個h值，則采用式（1）和式（2）拉伸步驟3）獲取的反射圖像的三種分量。

5） 采用式（3）和式（4）計算出人機(jī)界面圖像的色彩增強(qiáng)圖像。

1.2.2 ?燈光信號色彩設(shè)計

在電子設(shè)備人機(jī)界面色彩的設(shè)計過程中，高效準(zhǔn)確地傳遞出燈光信號的含義對電子設(shè)備的正常運(yùn)行和用戶正常的使用極其重要[9]。電子設(shè)備人機(jī)界面?zhèn)鬟f的燈光信號可表達(dá)不同的視覺信息，例如紅色可表示緊急撤離、綠色表示設(shè)備正常運(yùn)行等。表1為電子設(shè)備人機(jī)界面色彩設(shè)計中燈光信號的分類結(jié)果。

電子設(shè)備人機(jī)界面設(shè)計應(yīng)在滿足功能需求的基礎(chǔ)上，盡量具備較強(qiáng)的色彩飽和度，提升人機(jī)界面的宜人度。合理有效地搭配人機(jī)界面的色彩，選擇合適的燈光信號顏色是電子設(shè)備人機(jī)界面設(shè)計的關(guān)鍵，因此需針對不同電子設(shè)備具體分析其人機(jī)界面光電信號色彩的搭配情況，滿足人機(jī)界面使用的需求。

1.2.3 ?色彩編碼

色彩不僅可以用作表現(xiàn)電子設(shè)備的產(chǎn)品特質(zhì)，通過不同的色彩搭配吸引使用者的眼球，也可提升電子設(shè)備的工作能力。電子設(shè)備人機(jī)界面中的各種程序可通過不同色彩來突出顯示[10]，以縮短使用者尋找各種程序或控制軟件的用時。程序或軟件色彩的選擇應(yīng)結(jié)合界面的背景顏色，對界面顯示的程序或軟件色彩安排時，可根據(jù)界面的色調(diào)、對比度、飽和度和功能劃分來安排。

電子設(shè)備通常的工作環(huán)境為工廠等環(huán)境，其顏色的安排應(yīng)主要以中性色的灰色為主，可為使用者帶來電子設(shè)備穩(wěn)重和性能強(qiáng)的視覺感覺，不可過于鮮艷和沉悶。而有些電子設(shè)備人機(jī)界面的比例設(shè)計不十分協(xié)調(diào)，可通過在界面中設(shè)置色帶橫向劃分界面，利用分割錯覺調(diào)整人機(jī)界面的視覺比例，提升人機(jī)界面的視覺關(guān)注度。

2 ?實驗分析

實驗仿真分析本文方法的實際應(yīng)用效果，將本文方法實際應(yīng)用到電子設(shè)備人機(jī)界面的色彩設(shè)計中，對電子設(shè)備人機(jī)界面色彩設(shè)計質(zhì)量進(jìn)行評價，且為突出本文方法的性能優(yōu)勢，將采用圖元火控系統(tǒng)的人機(jī)界面色彩設(shè)計方法和采用新型儲能變流器的人機(jī)界面色彩設(shè)計方法的界面色彩設(shè)計結(jié)果為實驗參照。

通過眼球追蹤實驗來驗證三種方法的電子設(shè)備人機(jī)界面色彩設(shè)計效果，具體實驗步驟如下：

1） 在某藝術(shù)設(shè)計院校中隨機(jī)選取20位大學(xué)生為界面設(shè)計效果測試對象，樣本中包括男女學(xué)生各10名;

2） 選擇Eyeso Glasses眼球追蹤裝置、液晶顯示屏和圖形工作站為實驗設(shè)備;

3） 實驗材料包括6種不同的界面，實驗主要研究電子設(shè)備的人機(jī)登入界面和主程序界面;

4） 實驗初始時，人機(jī)顯示界面呈現(xiàn)一種界面狀態(tài)，且每次成像時間間隔為10 s，測試對象在無任何干擾的情況下觀察電子設(shè)備人機(jī)顯示界面，眼球追蹤裝置將準(zhǔn)確記錄測試對象的界面注視時間和眼球移動情況。

有效記錄眼球追蹤裝置獲取20位測試對象觀察界面的用時情況，3種方法設(shè)計的電子設(shè)備登入界面和主程序界面注視時間分別如表2和表3所示，且為突出比較表中數(shù)據(jù)的差異性，分別將表2和表3數(shù)據(jù)用圖2和圖3表示。

分析表2和圖2實驗結(jié)果可以看出，電子設(shè)備人機(jī)界面色彩的設(shè)計，測試對象對采用不同方法設(shè)計的登錄界面注視時長相差較大。圖2中采用本文方法設(shè)計登入界面的注視時長曲線在最上方，最高點(diǎn)為9.9 s，說明該測試對象對采用本文方法設(shè)計的登錄界面的關(guān)注度極高，界面的色彩視覺效果好;采用圖元火控系統(tǒng)設(shè)計登錄界面的注視時長居中，該方法設(shè)計界面的最長注視時間為7.7 s，測試對象對該界面的關(guān)注度較差;采用新型儲能變流器設(shè)計界面的注視時長最短，最長注視時間也不到6 s，說明該登錄界面的色彩視覺效果較差，測試對象無法較長時間關(guān)注該界面。

圖2 ?登入界面的注視時長曲線

測試對象對圖元火控系統(tǒng)的電子設(shè)備人機(jī)界面色彩設(shè)計方法和新型儲能變流器的設(shè)計方法設(shè)計的登錄界面平均注視時長分別為7.1 s和5.6 s。說明超出該時間后人眼的關(guān)注點(diǎn)發(fā)生轉(zhuǎn)移，對人機(jī)界面顯示信息的關(guān)注降低，不利于使用者完成既定的任務(wù)。本文方法設(shè)計界面的平均注視時長為9.5 s，注視時長高于另外兩種方法設(shè)計的界面，可較長時間地理解界面的信息，促進(jìn)任務(wù)的有效執(zhí)行。本文方法設(shè)計電子設(shè)備人機(jī)界面的注視時長較長是因為：在選擇燈光信號的顏色前，先對界面面板色彩進(jìn)行處理，增強(qiáng)界面的色彩顯示效果，界面的協(xié)調(diào)性大大增強(qiáng)，有效提升使用者的界面注視用時，吸引測試對象的能力較強(qiáng)。

分析表3得出，測試對象對采用本文方法設(shè)計主程序界面的注視時間較長，最長注視時間可達(dá)到9.7 s，而采用圖元火控系統(tǒng)設(shè)計界面和采用新型儲能變流器設(shè)計界面的注視時長最高分別為6.8 s和6.6 s，分別低于采用本文方法設(shè)計的主程序界面注視時間2.9 s和3.1 s，說明采用本文方法設(shè)計的主程序界面的吸引力強(qiáng)，實驗測試對象的注視時間長，滿意度高。分析圖3三條曲線可以看出，采用本文方法設(shè)計的電子設(shè)備人機(jī)主程序界面的注視時長曲線在最上方。采用新型儲能變流器的設(shè)計的主程序界面的注視時長最短，且不同測試對象對主程序界面的注視時長差異較大，說明該界面吸引測試對象關(guān)注度能力差，界面的色彩視覺顯著性較差。

圖3 ?主程序界面的注視時長曲線

3 ?結(jié) ?論

本文針對電子設(shè)備人機(jī)交互界面高關(guān)注度的設(shè)計需求，提出基于視覺傳達(dá)的電子設(shè)備人機(jī)界面色彩設(shè)計方法。根據(jù)視覺傳達(dá)中視覺信息的認(rèn)知流程，先理解人機(jī)界面所傳達(dá)的信息;然后對信息進(jìn)行記憶、理解和判斷，根據(jù)自身的判斷結(jié)果做出有效決策和適當(dāng)?shù)男袨?。電子設(shè)備人機(jī)界面?zhèn)鬟_(dá)的信息為圖像，增強(qiáng)圖像的顯示效果有助于提升界面的關(guān)注度。本文采用的多分辨多尺度Retinex算法，可有效運(yùn)算電子設(shè)備人機(jī)界面圖像色彩，且在進(jìn)行燈光信號色彩設(shè)計時通過不同的色彩搭配吸引使用者的眼球，提升電子設(shè)備的工作效率。

本文提出基于視覺傳達(dá)的電子設(shè)備人機(jī)界面色彩設(shè)計方法，是一種有效的人機(jī)界面色彩設(shè)計方法，在提升電子設(shè)備使用者的關(guān)注度上具有極佳的效果。

參考文獻(xiàn)

[1] 鄧霞.一種新型儲能變流器的人機(jī)界面設(shè)計方法與實現(xiàn)[J].電測與儀表，2016，53（4）：97?101.

DENG Xia. A novel design and implementation method of human machine interface for power storage converter [J]. Electrical measurement & instrumentation， 2016， 53（4）： 97?101.

[2] 馬莉，王建國，韋勇宇，等.基于圖元的火控系統(tǒng)人機(jī)交互界面的實現(xiàn)[J].火力與指揮控制，2017，42（7）：170?174.

MA Li， WANG Jianguo， WEI Yongyu， et al. Realization of the human?computer interaction interface of fire control system based on graphic element [J]. Fire control & command control， 2017， 42（7）： 170?174.

[3] 汪惟寶，陳為龍.交通標(biāo)示顏色的視覺傳達(dá)作用仿真分析[J].計算機(jī)仿真，2016，33（7）：351?354.

WANG Weibao， CHEN Weilong. Traffic sign color visual communication function simulation analysis [J]. Computer simulation， 2016， 33（7）： 351?354.

[4] 李科，岳林，惠子南，等.基于Qt跨平臺的車載人機(jī)界面設(shè)計[J].鐵道標(biāo)準(zhǔn)設(shè)計，2017，61（9）：128?132.

LI Ke， YUE Lin， HUI Zinan， et al. Design of on?board driver machine interface based on Qt cross?platform software [J]. Railway standard design， 2017， 61（9）： 128?132.

[5] 周井玲，翟春樹，楊蘇云，等.陶瓷球計數(shù)裝袋機(jī)控制系統(tǒng)及界面設(shè)計[J].電氣傳動，2015，45（11）：50?53.

ZHOU Jingling， ZHAI Chunshu， YANG Suyun， et al. Design of ceramic ball counting package machine control system and interface [J]. Electric drive， 2015， 45（11）： 50?53.

[6] 趙慧亮，何林，林麗.數(shù)字化人機(jī)界面的多目標(biāo)意象設(shè)計決策研究[J].工程設(shè)計學(xué)報，2016，23（1）：28?34.

ZHAO Huiliang， HE Lin， LIN Li. The decision making on multi?image design for digital human?machine interface [J]. Chinese journal of engineering design， 2016， 23（1）： 28?34.

[7] 關(guān)淯尹，耿心.飛行模擬系統(tǒng)人機(jī)交互設(shè)計[J].計算機(jī)工程與應(yīng)用，2017，53（23）：230?235.

GUAN Yuyin， GENG Xin. Design of human?computer interaction for flight simulation system [J]. Computer engineering and applications， 2017， 53（23）： 230?235.

[8] 邵婷，李光琛，張文興，等.艦炮瞄準(zhǔn)裝置操控界面優(yōu)化設(shè)計[J].火炮發(fā)射與控制學(xué)報，2016，37（3）：76?79.

SHAO Ting， LI Guangchen， ZHANG Wenxing， et al. Manipulation interface optimized design of aiming devices of naval gun [J]. Journal of gun launch & control， 2016， 37（3）： 76?79.

[9] 陳述，蒙錦濤，王建平，等.三峽升船機(jī)中控室人機(jī)界面的適配性研究[J].人民長江，2017，48（19）：110?115.

CHEN Shu， MENG Jintao， WANG Jianping， et al. Adaptability of human?machine interface for central room of Three Gorges ship lift [J]. Yangtze River， 2017， 48（19）： 110?115.

[10] 張寶，丁敏，李燕杰.基于視覺感知強(qiáng)度的人機(jī)交互界面優(yōu)化設(shè)計[J].中國機(jī)械工程，2016，27（16）：2196?2202.

ZHANG Bao， DING Min， LI Yanjie. Optimization design of human machine interaction interface based on visual perception [J]. China mechanical engineering， 2016， 27（16）： 2196?2202.