觸控式航海模擬器人機交互系統(tǒng)優(yōu)化設(shè)計

符 斌，任鴻翔，李小濤

(大連海事大學(xué) 航海動態(tài)仿真和控制交通行業(yè)重點實驗室，遼寧 大連 116026)

觸控式航海模擬器人機交互系統(tǒng)優(yōu)化設(shè)計

符 斌，任鴻翔，李小濤

(大連海事大學(xué) 航海動態(tài)仿真和控制交通行業(yè)重點實驗室，遼寧 大連 116026)

觸控操作便捷高效，已成為下一代船舶駕駛臺操控的趨勢，為適應(yīng)實船操控的發(fā)展，提高船員培訓(xùn)效率，節(jié)約培訓(xùn)成本，減少硬件人機交互系統(tǒng)損耗的目的，在航海模擬器中很有必要開發(fā)觸控式人機交互系統(tǒng)。以V.Dragon-4000 型航海模擬器硬件人機交互系統(tǒng)為參考，采用 WPF 框架搭建軟件人機交互系統(tǒng)界面，運用 C# 語言后臺編寫邏輯實現(xiàn)交互功能。優(yōu)化設(shè)計的觸控式人機交互系統(tǒng)操作靈敏、形象逼真，且可以根據(jù)操作需要改變界面大小，經(jīng)接入到航海模擬器進行檢驗，可以替代硬件人機交互系統(tǒng)在航海模擬器中使用。與原有交互系統(tǒng)進行比較，該交互系統(tǒng)可以提高航海模擬器的運行效率。

航海模擬器；人機交互系統(tǒng)；觸控操作；模塊化；邏輯關(guān)系

0 引 言

根據(jù) STCW78/95 公約及其馬尼拉修正案關(guān)于使用模擬器進行的適任評估和持續(xù)熟練程度的訓(xùn)練要求，船舶操縱模擬器在船員培訓(xùn)及評估方面的地位更加突出[1 – 2]。另外，在港口和航道的開發(fā)應(yīng)用、通航論證及事故調(diào)查分析等方面，船舶操縱模擬器也有著廣泛的應(yīng)用[3 – 4]。然而，目前船舶操縱模擬器人機交互方式仍然采用半仿真設(shè)備的形式，操縱人員使用實物操作面板對模擬器進行操作，操作方式比較陳舊。

原有的軟件式人機交互系統(tǒng)基于 MFC 框架開發(fā)而成，可以通過鼠標(biāo)點擊軟面板的方式實現(xiàn)交互，也可以利用半仿真硬件面板的按鍵操作實現(xiàn)，前者利用鼠標(biāo)操作不夠靈活，且不能根據(jù)操作需要改變界面大小，后者利用按鍵操作硬件設(shè)備容易老化。隨著電子觸控技術(shù)的成熟和觸摸屏幕價格的降低，觸控電子產(chǎn)品越來越多[5]，觸控操作界面友好、反應(yīng)靈敏，已成為下一代船舶駕駛臺操控的趨勢，因此，很有必要在模擬器中用軟件觸控式人機交互系統(tǒng)取代硬件交互系統(tǒng)，從而提高航海模擬器的使用效率。

1 傳統(tǒng)船舶操縱模擬器人機交互面板組成及功能

以 V.Dragon-4000 型航海模擬器為例，其硬件人機交互系統(tǒng)主要由 13 個交互單元組成，部分原有軟件式交互系統(tǒng)如圖 1 所示。操作人員通過操縱不同的交互單元來操控相應(yīng)的航行設(shè)備（車、舵、錨、纜、拖輪的操作；航行燈及信號燈的操作；各種聲號的操作；航行輔助信息顯示等），操作時選擇不同的控制選項，集成電路將該選項的電平信號傳入到微機處理器后轉(zhuǎn)化成相應(yīng)的控制指令傳入到模擬器的數(shù)據(jù)接口，進而控制船舶的航行狀態(tài)，在鍵入選項的同時，電路板上的燈管發(fā)出相應(yīng)的燈光變化提示操作人員當(dāng)前已選擇的指令。

2 觸控式人機交互界面的設(shè)計

2.1 用戶體驗設(shè)計

用戶體驗包括信息架構(gòu)、內(nèi)容文本、視覺設(shè)計、交互設(shè)計等[6]。人機交互界面的用戶體驗，包含了用戶的主觀感受、動機、價值觀等方面。好的人機交互界面便于理解且操作簡單，使用戶在使用時能感到愉快，提高使用效率。同時，在界面設(shè)計中要考慮人的喜好和使用習(xí)慣，使界面設(shè)計中有更多人們所期望的元素，實現(xiàn)人機完美結(jié)合。如果人機界面和用戶之間一對一的交互方式并不方便或者不令人愉快，那么這一缺陷會毀掉整個系統(tǒng)的性能。

船舶操縱模擬器的用戶主要是海事院校的老師、學(xué)生以及參加培訓(xùn)評估的社會船員。這些用戶群體存在年齡、學(xué)歷及航海實踐經(jīng)歷的差別等。充分考慮了這些差別，結(jié)合航海操作實踐，借鑒手機觸屏的交互方式，完成觸控式人機交互界面用戶體驗設(shè)計。如操作界面之間采用滑動觸摸屏的方式進行翻頁切換；在觸摸屏上做拉伸縮放手勢實現(xiàn)界面大小的變化等。交互界面背景顏色選取淡藍色，有助于用戶在長時間進行操作時減緩視力疲勞；按鈕報警閃爍提示顏色選取紅色，有助于引起操作人員的注意力，起到較好的警示作用。

2.2 總體設(shè)計方案

模擬器人機交互系統(tǒng)是操縱人員使用最多的設(shè)備，人機交互界面的設(shè)計有三大原則，分別是：保持界面的一致性、提供信息反饋和界面操作的便捷性[7]。觸控式人機交互系統(tǒng)設(shè)計主要從界面布局、風(fēng)格設(shè)計和功能實現(xiàn) 3 個方面來增強人機交互界面的友好性和靈活性，使用戶在使用觸控式人機交互界面時能夠通過熟悉的半仿真操作面板來使用新產(chǎn)品。整體設(shè)計流程如圖 2 所示。

觸控式人機交互系統(tǒng)采用模塊化的設(shè)計思想[8]，將模擬器整個人機交互系統(tǒng)劃分為若干基本功能控制單元，再將各個控制單元進行有機組合。如圖 3 所示，將整個人機交互系統(tǒng)拆分為 4 個模塊，每個模塊框架下有相應(yīng)的操作單元。在程序設(shè)計的過程中，每個單元獨立編譯成 DLL（動態(tài)鏈接庫），然后通過引用DLL 將基本功能單元引入到相應(yīng)的模塊框架中[9]。此方法利于每個基本功能單元獨立運行，并且可以避免當(dāng)某個控制單元出現(xiàn)錯誤時而導(dǎo)致整個人機交互系統(tǒng)故障，利于故障的排查和程序的修改。

2.3 實現(xiàn)

2.3.1 開發(fā)平臺及開發(fā)語言

觸控式人機交互系統(tǒng)是在 Microsoft .NET Framework 4.5 環(huán)境下，在 Visual Studio 2013 開發(fā)平臺上，采用 WPF（Windows Presentation Foundation）技術(shù)，使用XAML 和 C# 程序設(shè)計語言開發(fā)。

WPF 具有強大的圖形用戶控制功能和多種編程模式，適于多種數(shù)據(jù)訪問接口，方便模擬器的系統(tǒng)集成與數(shù)據(jù)傳輸。采用 WPF 技術(shù)設(shè)計人機交互系統(tǒng)需要使用 XAML 和 C# 程序設(shè)計語言，XAML 語言用于觸控式人機交互系統(tǒng)界面布局和外觀設(shè)計，該方法可使系統(tǒng)界面根據(jù)操作需求進行拉伸縮放而不出現(xiàn)變形。C#語言用于實現(xiàn)觸控式航海模擬器人機交互系統(tǒng)的復(fù)雜邏輯控制，將輸入指令數(shù)據(jù)寫入到相應(yīng)的事件函數(shù)中，在觸發(fā)指令時供模擬器數(shù)據(jù)接口訪問。這種前臺界面代碼和后臺邏輯代碼的分離，使得系統(tǒng)在運行時不容易出現(xiàn)錯誤[10 – 12]。

2.3.2 技術(shù)細節(jié)

1）按鈕的實現(xiàn)。在 App.xaml 中編寫自定義用戶Button 控件模板，在模板中分層次放 2 個矩形，利用Banding 將最底層矩形的填充色與按鈕背景色（Background）和前景色（Foreground）相綁定，運用 Path 復(fù)合路徑生成的代碼作為按鈕的 Content 屬性來顯示按鈕上的圖形[13]，同時在邏輯層寫入點擊事件。最后完成按鈕的效果，即點擊按鈕時邊框和表面字體發(fā)生顏色的變化。

2）旋鈕的實現(xiàn)。在項目里添加用戶控件（User-Control），創(chuàng)建旋鈕（Knob）控件，給自定義旋鈕添加旋轉(zhuǎn)的依賴屬性，利用極坐標(biāo)的計算方法來計算旋鈕旋轉(zhuǎn)的角度。旋鈕在創(chuàng)建時將 Canvas.Background 屬性設(shè)置為圖片路徑，將所需圖片放入，旋鈕可以設(shè)置為有極（轉(zhuǎn)動 360 °）和無極（循環(huán)轉(zhuǎn)動）的 2 種轉(zhuǎn)動方式，通過手勢在觸屏上控制旋轉(zhuǎn)操作旋鈕轉(zhuǎn)動。

3）LED 數(shù)碼管的實現(xiàn)。在 WPF 中用自定義用戶控件來制作 LED 數(shù)碼管，通過定義了此控件的依賴屬性[10]，并將模擬器的數(shù)據(jù)接口與其輸出顯示值綁定，能達到硬件 LED 數(shù)碼管的顯示效果。

4）船形的實現(xiàn)。利用 WPF 中 Path 復(fù)合路徑的方法，在窗體中繪制光滑的船形圖[13]。

5）進度條的實現(xiàn)。創(chuàng)建自定義進度條，運用Blend 設(shè)計器設(shè)計進度條外觀，并定義了其所需要的依賴屬性[10]，并且將進度條所要顯示的數(shù)據(jù)與該依賴屬性綁定，從而來滿足動態(tài)的顯示效果。

2.3.3 與船舶操縱模擬器的接口實現(xiàn)

船舶操縱模擬器的開放接口由 C++ 語言編寫而成，由于觸控式人機交互系統(tǒng)開發(fā)采用 C# 語言編寫，是一種托管代碼，編譯生成微軟的中間語言，而模擬器的接口 C++ 代碼編譯生成本地機器碼，這 2 種語言實現(xiàn)對接就存在一定的困難。具體實現(xiàn)方法為：在交互界面的 C# 中使用托管 C++ 接口，調(diào)用本地 C++ 的類和函數(shù)，同時通過托管 C++ 程序集嵌套模擬器本地C++ 編譯的機器碼，與模擬器接口構(gòu)成了混合體，實現(xiàn)了和模擬器接口對接。

2.3.4 人機交互界面實現(xiàn)

根據(jù)整體設(shè)計方案，將側(cè)推、車舵、螺距操作進行有機組合，利用側(cè)推控制單元操作船舶旋轉(zhuǎn)，實驗中通過對該人機交互系統(tǒng)進行操作，操作指令與模擬器數(shù)據(jù)接口進行傳輸，船舶可以實現(xiàn)旋轉(zhuǎn)運動，界面設(shè)計效果如圖 4 所示。界面上的按鈕、旋鈕、LED 數(shù)碼管等的交互按照技術(shù)細節(jié)中的實現(xiàn)方法，結(jié)合船舶操縱模擬器的具體要求，完成交互功能。

Tug Control 控制單元由 14 個拖輪位置點選擇按鈕（在船形四周的按鈕）、4 個拖輪馬力控制按鈕、7 個拖輪速度控制按鈕、確認按鈕、釋放拖輪按鈕及船形和角度選擇按鈕等組成。

界面背景色選擇為藍色，每個按鈕的基礎(chǔ)顏色為黃色，當(dāng)被觸發(fā)后顏色變?yōu)榫G色或紅色。每個按鍵按下后的邏輯關(guān)系如圖 5 所示。Tug Control 控制單元的實現(xiàn)效果如圖 6 所示，其余 12 個交互單元實現(xiàn)具有類似效果。

面板觸控邏輯關(guān)系說明如下。初始狀態(tài)時只有位置按鈕可操作（黃色），操作人員點擊位置按鈕選擇拖輪的位置，隨后可選擇拖輪馬力、速度、拖輪作用角度（左 90 °～右 90 °）之后，最后點擊 YES 鍵進行確認，完成一條拖輪的操作。當(dāng)有拖輪位置鍵被選中時，按下彈起 LET GO，該位置上的拖輪被釋放，按下彈起 ALL LET GO 按鈕時，所有位置點上的拖輪被釋放。

2.4 與原有模擬器人機交互方式比較

原有的半仿真式人機交互界面分布在綜合船橋的各個部位，操作人員對某控制單元操作時需要在船橋的操縱臺上找到相應(yīng)的交互面板，在一定程度上分散操作人員的注意力。并且交互界面上的實體控件會隨著操作次數(shù)的疊加而產(chǎn)生老化，容易出現(xiàn)操作不靈敏的故障。

原有基于 MFC 開發(fā)的對話框式的人機交互界面（見圖 7 ），通過鼠標(biāo)點擊和鍵盤輸入進行交互，鼠標(biāo)是非直接的輸入方式，操作平臺和輸出界面是分離的，交互速度也較慢，鼠標(biāo)移動的方向和顯示屏上光標(biāo)移動的方向不能體現(xiàn)操作時的控件的變化過程，使交互枯燥乏味，影響整個系統(tǒng)的性能。并且界面比較單一，不夠形象生動，交互界面大小固定，缺乏靈活性。

觸控式人機交互系統(tǒng)交互操作在觸摸屏上進行，可以將所有交互界面集中放置在一起操作，根據(jù)操作需求進行控制單元之間的切換和改變界面的大小。由人機交互界面實現(xiàn)效果圖可以看出，交互界面是參照實體控件外觀設(shè)計的，保留了原有操作邏輯，可以模擬實體控件的操作反應(yīng)過程；與此同時，在界面顏色搭配及布局上做出相應(yīng)的改變，開發(fā)出的圖形用戶界面生動形象，交互時帶給操作人員良好的視覺效果，在一定程度上實現(xiàn)人機的完美結(jié)合。

3 結(jié) 語

觸控式航海模擬器人機交互系統(tǒng)是對 V.Dragon-4000 型航海模擬器人機交互系統(tǒng)的交互方式的改變。突出的特點是采用模塊化的編程思想，利用目前較為流行的圖形多媒體交互技術(shù)（WPF），開發(fā)出了在觸摸屏上進行交互操作的人機交互界面。本觸控式人機交互系統(tǒng)操作靈敏、形象逼真，可根據(jù)操作人員的需求任意調(diào)整界面的位置和大小，方便靈活。經(jīng)實驗測試，優(yōu)化設(shè)計的觸控式人機交互系統(tǒng)可以替代電路板式人機交互系統(tǒng)在航海模擬器中使用。

[ 1 ]趙月林, 方文治, 王逢辰. 新的《STCW》公約對航海模擬器的要求[J]. 大連海事大學(xué)學(xué)報. 1996, 22(04): 6–10.

ZHAO Yue-lin, FANG Wen-zhi, WANG Feng-chen. Requirement on marine simulator by the revised STCW[J]. Journal of Dalian Maritime University. 1996, 22(04): 6–10.

[ 2 ]金一丞, 尹勇. STCW公約馬尼拉修正案下的航海模擬器發(fā)展戰(zhàn)略[J]. 中國航海. 2012, 35(3): 5–10.

JIN Yi-cheng, YIN Yong. Development Strategy of Marine Simulator in Light of the Manila Amendmernts to STCW Convention[J]. Navigation of China. 2012, 35(3): 5–10.

[ 3 ]范濟秋. 模擬器在航海教育與培訓(xùn)中的應(yīng)用[J]. 航海教育研究, 2007(增刊): 103–104.

FAN Ji-qiu. Application of simulator in maritime education and training[J]. Maritime Education Research, 2007(Supplement): 103–104.

[ 4 ]史方敏, 孫峰. 航海模擬器在航海技能訓(xùn)練中的應(yīng)用[J]. 航海教育研究. 2011, (02): 65–68.

SHI Fang-min, SUN Feng. Marine simulator application in navigation skills training[J]. Maritime Education Research, 2011, (02): 65–68.

[ 5 ]呂明, 呂延. 觸摸屏的技術(shù)現(xiàn)狀、發(fā)展趨勢及市場前景[J].機床電器, 2012, (3): 4–7.

LV Ming, LV Yan. The technology current situation and developing tendency and market of touch –screen[J]. Machine Tool Electric Apparatus, 2012, (3): 4–7.

[ 6 ]單筱秋. 淺議人機交互界面研發(fā)中的用戶體驗設(shè)計[J]. 南京藝術(shù)學(xué)院學(xué)報, 2013, (6): 181–183.

SHAN Xiao-qiu. Shallow discuss user experience design of HCI interface development[J]. Journal of Nanjing College of Art, 2013, (6): 181–183.

[ 7 ]胡杰明. 數(shù)碼產(chǎn)品人機交互界面研究[J]. 包裝工程, 2014, 35(18): 61–63.

HU Jie-ming. Human-computer interaction interface of digital products[J]. Packaging Engineering, 2014, 35(18): 61–63.

[ 8 ]張偉. 基于模塊化的船舶控制臺設(shè)計[J]. 自動化與儀器儀表, 2013(4): 66–68.

ZHANG Wei. Design of ship console based on Modularization[J]. Automation & Instrumenttation, 2013(4): 66–68.

[ 9 ]齊立波, Watson. C#入門經(jīng)典(第6版)[M]. 北京: 清華大學(xué)出版社, 2014.

QI Li-bo, Watson. C# entry classic (Sixth edition)[M]. Beijing: Tsinghua University Press, 2014.

[10]劉鐵錳. 深入淺出WPF[M]. 北京: 中國水利水電出版社, 2010.

LIU Tie-meng. Layman WPF[M]. Beijing: China Water Conservancy and Hydropower Publishing House, 2010.

[11]王鑫, 鄧宏彬. 基于WPF技術(shù)的無人機地面指揮控制站的設(shè)計與實現(xiàn)[Z]. 重慶: 2014: 102–110.

WANG Xin, DENG Hong-bin. Design and implementation of UAV Ground console station based on WPF Technology[Z]. Chongqi: 2014: 102–110.

[12]李方芳, 趙旭東, 盧偉文, 等. 基于WPF的通用可配置式教員控制臺軟件引擎研發(fā)[J]. 系統(tǒng)仿真學(xué)報, 2013, 25(8): 1761–1765.

LI Fang-wei, ZHAO Xu-dong, Lu Wei-wen, et al. Development of All-purpose and Configurable IOS Software Engine Based on WPF[J]. Journal of System Simulation, 2013, 25(8): 1761–1765.

[13]孟冬梅, 張洪定. 基于Expression Blend 4中文版WPF和Silverlight項目設(shè)計基礎(chǔ)[M]. 北京: 清華大學(xué)出版社, 2011.

Optimal design of touch-sensitive human-computer interaction of ship maneuvering simulator

FU Bin, REN Hong-xiang, LI Xiao-tao
(Key Laboratory of Marine Simulation and Control for Ministry of Communications, Dalian Maritime University, Dalian 116026, China)

Touch operation is convenient and efficient, it has become the trend of next generation of ship bridge manoeuvre. In order to adapt the development of ship operation, improve crew training efficiency, save training costs and reduce ullage of hardware human-computer interaction, it is necessary to exploit a touch-sensitive human-computer interaction of ship maneuvering simulator. Reference to the hardware human-computer interaction of V.Dragon-4000 ship maneuvering simulator, built the User Interface of software human-computer interaction by using WPF framework, and achieved the interactive function by using C# Language to write the background logical program. The operation to the exploitative touch-sensitive human-computer interaction is sensitive, the display is vivid and can be changed the size of interface according operation need. It is proven by combined it with ship maneuvering simulator that it can be used in ship maneuvering simulator to replace hardware human-computer interaction. Which can improve the operational efficiency of ship maneuvering simulator after compared with primary human-computer interaction.

ship maneuvering simulator；human-computer interaction；touch operation；modularization；logical relationship

TP391

A

1672 – 7619(2017)06 – 0110 – 05

10.3404/j.issn.1672 – 7619.2017.06.022

2016 – 07 – 20；

2016 – 10 – 20

國家863課題資助項目(2015AA016404)；海洋公益性行業(yè)科研專項資助項目(201505017-4)；交通運輸部應(yīng)用基礎(chǔ)研究資助項目(2015329225240)；中央高校基本科研業(yè)務(wù)費資助項目(3132016324)

符斌(1991 – )，男，碩士研究生，主要研究方向為人工智能、虛擬現(xiàn)實。