（廣西廣播電視無線傳播樞紐臺）

1 引言

隨著互聯(lián)網(wǎng)新技術(shù)的不斷發(fā)展，人們使用互聯(lián)網(wǎng)產(chǎn)品已不僅僅關(guān)注產(chǎn)品本身的功能，而是越來越關(guān)心產(chǎn)品能否提高工作效率，使用過程是否愉快。于是UI設(shè)計應(yīng)運而生，它將枯燥的軟件代碼轉(zhuǎn)化為生動的圖形畫面，讓用戶得以輕松使用產(chǎn)品。優(yōu)秀的UI設(shè)計不僅是讓軟件變得有個性有品味，更讓軟件的操作變得舒適、簡單、自由，充分體現(xiàn)軟件的定位和特點。

2 用戶體驗設(shè)計與UI設(shè)計

UI，User Interface，譯為用戶接口，即用戶界面，是機(jī)器與人溝通的橋梁。UI設(shè)計主要是指對軟件的人機(jī)交互、界面美觀、操作邏輯等方面的設(shè)計。以日常瀏覽的網(wǎng)頁為例，UI設(shè)計師將機(jī)器代碼轉(zhuǎn)化為人們易于理解的圖形、文字等信息，便于使用。

用戶體驗，UE（UX），英文為 User Experience，直譯過來是用戶經(jīng)驗，顧名思義它強(qiáng)調(diào)的是使用者體驗的過程。互聯(lián)網(wǎng)行業(yè)知名的信息架構(gòu)專家Peter Morville提出的用戶體驗?zāi)Ｐ桶?Useful（有用）、Usable（可用）、Desirable（合意）、Findable（可尋）、Accessible（可及 ）、Credible（ 信 任 ）、Valuable（價值）幾個維度。[1]即，設(shè)計者應(yīng)以用戶為中心，設(shè)計的產(chǎn)品要有使用價值和清晰的產(chǎn)品定位，其次要易于使用并且讓用戶快速找到他們需要的信息，最終促進(jìn)用戶完成其目標(biāo)。

圖1 Peter Morville提出的用戶體驗?zāi)Ｐ?/p>

UI和UE是兩個不同的概念，同時又是不可分割的，離開了用戶體驗的UI設(shè)計，只能是敷衍的設(shè)計。二者結(jié)合是一種創(chuàng)新思維的設(shè)計方法，透過這種創(chuàng)新思維的設(shè)計方式，提升產(chǎn)品本身的易用性、趣味性，進(jìn)而提高用戶的工作效率。

3 結(jié)合UI和UE論述臺站監(jiān)控系統(tǒng)的界面設(shè)計思路

3.1 首要任務(wù)是滿足用戶需求

臺站監(jiān)控系統(tǒng)不同于盈利性互聯(lián)網(wǎng)應(yīng)用，有固定的用戶群，無需挖空心思發(fā)展用戶，其主要是為全區(qū)安全播出工作服務(wù)，因此如何滿足監(jiān)控全區(qū)臺站的需求，尤其是滿足最常用業(yè)務(wù)的需求才是最重要的。

3.2 尊重用戶的使用習(xí)慣

當(dāng)系統(tǒng)能夠滿足用戶基本需求時，用戶不再會說系統(tǒng)不能用，而是開始考慮系統(tǒng)是否好用。若要讓用戶覺得好用，首先要尊重用戶的使用習(xí)慣。習(xí)慣是一種不需要意識的行為，是一種經(jīng)常性發(fā)生的行為，由人腦中一個叫做basal ganglia的部分控制，它涵蓋用戶使用系統(tǒng)的全過程，如系統(tǒng)瀏覽習(xí)慣、使用頻率、操作方式、圖標(biāo)含義等等。Jakbo Nielsen研究得出人們對網(wǎng)頁瀏覽行為呈F形特征，表現(xiàn)為：

1）用戶首先會在內(nèi)容區(qū)的上部進(jìn)行橫向瀏覽，用戶視線下移一段距離后在小范圍內(nèi)再次橫向瀏覽。

2）最后用戶會在內(nèi)容區(qū)的左側(cè)做快速的縱向瀏覽。

所以，在臺站監(jiān)控系統(tǒng)中我們可以利用F形閱讀行為進(jìn)行如下設(shè)計：

1）將最重要的信息放在頁面的最上方，比如，在節(jié)目監(jiān)控界面，可以把最重要的信號源和發(fā)射機(jī)這兩個板塊并排放在網(wǎng)頁的最上端。

2）在后續(xù)的內(nèi)容中，將關(guān)鍵詞和信息放在段首，使用戶在左側(cè)縱向瀏覽時能更容易關(guān)注到。

在臺站監(jiān)控系統(tǒng)的實際設(shè)計中，還有許多尊重用戶使用習(xí)慣的例子。例如，技術(shù)員們已經(jīng)適應(yīng)原系統(tǒng)，產(chǎn)生了導(dǎo)航欄在左邊的習(xí)慣，那么在后續(xù)的系統(tǒng)設(shè)計中，在不影響生產(chǎn)效能的前提下，依然能尊重導(dǎo)航欄在左邊的習(xí)慣。當(dāng)然，尊重用戶習(xí)慣并不代表要拋棄創(chuàng)新，而是尊重用戶體驗的基礎(chǔ)上利用新技術(shù)、新知識帶來更好的用戶體驗，換句話說就是創(chuàng)造習(xí)慣。過去數(shù)十年里真正偉大的科技公司都有一個共同之處：他們能創(chuàng)造習(xí)慣，這點足以區(qū)分改變世界的公司和平庸的公司。

3.3 賦予產(chǎn)品的情感

前文介紹了用戶習(xí)慣的重要性，但這時系統(tǒng)仍給人冰冷的感覺，想要賦予系統(tǒng)情感，最重要的是：理解用戶的工作方式、行為和思考方式。從信息架構(gòu)的角度考慮，我們首先從不同用戶的視角出發(fā)，將業(yè)務(wù)流程相關(guān)的操作都匯集起來，再進(jìn)行分類，最后根據(jù)工作場景串聯(lián)起來。例如用戶角色為技術(shù)員時，我們更多考慮其處理緊急告警信息的情況，而領(lǐng)導(dǎo)角色的用戶則更關(guān)心整體的業(yè)務(wù)情況的統(tǒng)籌，相互之間差異就體現(xiàn)在信息架構(gòu)上。

3.4 優(yōu)化視覺設(shè)計，化“繁”為“簡”

對系統(tǒng)分析需求時強(qiáng)調(diào)盡量考慮全面，但如果把一切不必要的信息呈現(xiàn)給用戶的界面設(shè)計是不佳的。做設(shè)計時應(yīng)盡量把簡單留給用戶，復(fù)雜留給自己，給技術(shù)員們提供一個簡潔實用的值班工作界面，才能提高其工作效率，這就需要給界面做減法。有時候做加法容易做減法難，在眾多信息中如何取舍，把最需要的信息呈現(xiàn)給用戶是關(guān)鍵。根據(jù)不同的角色定制個性化的首頁視圖，將數(shù)據(jù)列表形式演變成圖標(biāo)形式展示，都是設(shè)計中常用的簡化頁面的方法。

設(shè)計中也常通過“顏色對比”引起用戶注意。顏色對比依然遵循“簡”的原則，配色方案不宜超過三種基色，采用60%+30%+10%的比例，其中 60%是主色調(diào)，30%是副色，10%是強(qiáng)調(diào)色。它的工作原理是創(chuàng)造了一種平衡感，給眼睛一個舒適的過渡，同時能夠快速注意到“強(qiáng)調(diào)色”。設(shè)計臺站監(jiān)控系統(tǒng)的頁面時，可以這樣處理色彩：

圖2 臺站監(jiān)控系統(tǒng)界面

淺藍(lán)灰色：作為底色，帶有灰度的底色能使人眼即使長時間觀看也不易覺疲勞；

綠色：給人自然感，作為設(shè)備正常工作的標(biāo)識；

紅色：給人危險、緊張感，且對比明顯，引人注目，應(yīng)作為主告警顏色；

橙色：與底色也是對比強(qiáng)烈，引人注目，卻不如紅色給人危險的感覺，所以更合適作為重要提示信息或次級告警的顏色；

藍(lán)色：給人責(zé)任感，又與底色色系相近，作為按鈕顏色最合適。

臺站監(jiān)控系統(tǒng)的功能非常強(qiáng)大，信息量很多，若要突出告警信息，除告警外的顏色應(yīng)盡可能少，且不宜顯眼。

3.5 優(yōu)化操作的流程

以往工程師常把一大串告警信息直接拋給用戶，導(dǎo)致用戶操作不及，工作效率底下，因此優(yōu)化系統(tǒng)的操作流程顯得尤為重要。優(yōu)化流程可遵循以下規(guī)則：

1）能夠先判斷的就先判斷，縮短用戶決策時間。

2）告警信息分類規(guī)范，交互、內(nèi)容、圖標(biāo)等保持體驗一致。

3）用戶處理流程盡量控制在三步以內(nèi)完成。

經(jīng)過UI設(shè)計師的改進(jìn)，由系統(tǒng)先在后臺判斷出告警的級別、種類并給出相應(yīng)解決流程，同時以不同的樣式、顏色呈現(xiàn)在前臺。這樣，不僅能減少技術(shù)員對告警的處理時間，也能使頁面看起來布局統(tǒng)一。另外，出現(xiàn)較為復(fù)雜的業(yè)務(wù)時，可通過按步驟導(dǎo)航方式引導(dǎo)用戶辦理，并且盡量給予用戶足夠的提示與幫助，盡量降低用戶學(xué)習(xí)的難度。特別對于部分年齡較大的值班員而言，更易學(xué)習(xí)的系統(tǒng)，能使工作更加便捷。

4 總結(jié)

隨著互聯(lián)網(wǎng)應(yīng)用越來越深入日常生活，相應(yīng)的界面設(shè)計也占據(jù)了越來越重要的地位。在「設(shè)計思考流程」的趨勢下，人們對產(chǎn)品的人性化設(shè)計越來越關(guān)注，對于界面設(shè)計不止于“能用”這個初級階段，更加著眼于創(chuàng)新設(shè)計，以提升應(yīng)用界面的易用性和趣味性，只為打造以用戶為中心的最佳產(chǎn)品體驗。

[1][美]Jesse James Garrett,用戶體驗要素 [M]，范曉燕 譯,機(jī)械工業(yè)出版社,2011

[2][美]唐納德·諾曼．設(shè)計心理學(xué)[H]．梅瓊譯．北京中信出版社，2003

[3]蔡坤，劉揚．基于美感模型的人機(jī)用戶界面設(shè)計[J]．開封大學(xué)學(xué)報．2006(02)

[4][美]Peter Morville,Web信息架構(gòu)[M]，陳建勛 譯，電子工業(yè)出版社，2013（10）