袁天昊 劉永翔

摘要：本文通過梳理產(chǎn)品用戶界面中圖標(biāo)元素設(shè)計中擬物、扁平和符號化三種表現(xiàn)形式，分析現(xiàn)在的用戶界面的設(shè)計特點(diǎn)和現(xiàn)狀，以此探討歸納未來的設(shè)計發(fā)展趨勢和方向。

關(guān)鍵詞：用戶界面 國標(biāo)元素 擬物化設(shè)計 扁平化設(shè)計 符號化設(shè)計 用戶體驗

中圖分類號：TB472

文獻(xiàn)標(biāo)識碼：A

文章編號：1003-0069（2015）12-0034-02

引言

產(chǎn)品用戶界面中的圖標(biāo)元素設(shè)計自2000年傳入中國，在互聯(lián)網(wǎng)與移動互聯(lián)網(wǎng)蓬勃發(fā)展下得到快速的發(fā)展，在這期間出現(xiàn)了大量的產(chǎn)品用戶界面設(shè)計師，即UI設(shè)計師。

用戶界面設(shè)計則是指對軟件的人機(jī)交互、操作邏輯、界面美觀的整體設(shè)計。好的用戶界面圖標(biāo)設(shè)計不僅是讓軟件變得有個性有品味，還要讓軟件的操作變得舒適、簡單、自由，充分體現(xiàn)軟件的定位和特點(diǎn)。通過界面給用戶一種情感傳遞，是設(shè)計的真正藝術(shù)魅力所在。用戶在接觸作品時的感受，使人產(chǎn)生感情共鳴，利用情感表達(dá)，切實(shí)地反映出作品與用戶之間的情感關(guān)系。

一 產(chǎn)品用戶界面中圖標(biāo)元素設(shè)計的三種風(fēng)格

1.1 擬物化設(shè)計

擬物化設(shè)計是一種產(chǎn)品圖標(biāo)設(shè)計的元素或風(fēng)格，指原有物件中某些必需的形式在新的設(shè)計中已不再必要，但新設(shè)計仍模仿舊有形式，以使新的外觀讓人感覺熟悉和親切。這可以看作是技術(shù)領(lǐng)域中的路徑依賴。擬物化設(shè)計的代表作品：iOS7.0以下，Android、以及iOS7.0以下時代的大部分APP。擬物化設(shè)計的特點(diǎn)（如圖1所示）：界面模擬真實(shí)物體的材質(zhì)、質(zhì)感、細(xì)節(jié)、光亮等；人機(jī)交互也擬物化，模擬現(xiàn)實(shí)中的交互方式。

擬物化設(shè)計的好處是學(xué)習(xí)成本低，一學(xué)就會，而且傳達(dá)了豐富的人性化的感情，所以家居類物品適合擬物化設(shè)計。擬物化設(shè)計壞處是擬物化本身就是個約束，會限制功能本身的設(shè)計。

擬物設(shè)計并不僅僅局限于計算機(jī)圖形用戶界面中，在生活中我們會發(fā)現(xiàn)許多擬物設(shè)計的影子，比如你的相機(jī)在拍照時，相機(jī)會發(fā)出”咔”的一聲，你家塑料地板的樣式也很可能是木紋的，這樣的例子很多很多，如果你仔細(xì)觀察一定會發(fā)現(xiàn)不少。這些隱藏在生活中的擬物設(shè)計會讓人感覺自然，你甚至?xí)X得它是某些產(chǎn)品中必不可少的元素。

1.2 扁平化設(shè)計

扁平化的概念最核心的地方就是放棄一切裝飾效果、諸如透視、紋理、漸變等能做出3D效果的元素。所有的元素的邊界都干凈利落，沒有任何羽化，漸變。尤其在手機(jī)上，更少按鈕和選項使得界面干凈整齊，使用起來格外簡潔?？梢愿雍唵沃苯拥貙⑿畔⒑褪挛锏墓ぷ鞣绞秸故境鰜?。

目前扁平化設(shè)計主要應(yīng)用在Windows Phone手機(jī)和Window 8操作系統(tǒng)上（如圖2所示）。扁平化合計拒絕特效。顧名思義，扁平化設(shè)計僅僅采用二維元素。所有元素都不加修飾——陰影、斜面、突起、漸變，這樣會帶來深度變化的設(shè)計都是不應(yīng)該的。從圖片框到按鈕，再到導(dǎo)航欄都干脆有力，需要極力避免羽化、陰影這樣的特效?，F(xiàn)實(shí)主義、3D、擬物化更是扁平化設(shè)計的大敵。扁平化設(shè)計中的層次和其他的——對應(yīng)，但各個位面間沒有交叉，不會明確區(qū)分背景圖片、前景圖片、按鈕、文本、導(dǎo)航等。

最近，越來越多的設(shè)計師開始贊同扁平化的設(shè)計。在大部分扁平化設(shè)計中，基調(diào)仍然是扁平風(fēng)格的，但會在設(shè)計方案中添加一種，且僅添加一種特效，無論是陰影也好、梯度也好，這種設(shè)計風(fēng)格相比嚴(yán)肅的、純粹的扁平化更加靈活。設(shè)計師們喜歡它，因為可以添加深度和紋理：用戶喜歡它，因為它能有助于直觀的交互。

1.3 符號化設(shè)計

目前符號化設(shè)計可以分出以下三種不同的類型：指示符號設(shè)計、象征符號設(shè)計和圖像符號設(shè)計。其中指示符號設(shè)計，如路標(biāo)就是道路的指示符號。象征符號設(shè)計，如紅色代表著革命，桃子在中國人的眼中是長壽的象征。圖像符號設(shè)計，中比如肖像，就是某人的圖像符號。人們通過形象的相似就可以辨認(rèn)出來。圖形符號還是人們最初記錄和傳遞的重要工具，圖形符號仍有語言、文字、圖形無法取代的獨(dú)立意義，所以在界面設(shè)計中，符號與圖形會有著必然的聯(lián)系。符號化的造型語言在界面設(shè)計中是完全可以得到充分發(fā)揮的。符號化設(shè)計在界面設(shè)計中的特征是將界面設(shè)計為可視的形象，易于用戶理解，產(chǎn)生共鳴。因此，界面設(shè)計中的圖形元素從現(xiàn)實(shí)到非現(xiàn)實(shí)會有巨大的跨度與多樣的變化。

符號作為人們工作生活中不可缺少的一部分（如圖3所示），在日新月異的現(xiàn)代社會中發(fā)揮著越來越重要的作用。無論是用戶還是符號設(shè)計人員，都會有一種共同的感受：每個人每天都生活在充滿符號味道的氛圍中?？梢哉f，只要有人活動的地方，就有符號的存在。而標(biāo)識，也隨著人類文明進(jìn)程的加快而迅速得到完善。

符號影響和改變著我們的生活。因為符號系統(tǒng)的警示及指示功能隨時都在為人們服務(wù)、引導(dǎo)，不管是正確的，還是錯誤的。就如一個沒有交通指示符號的路口，人們可能會經(jīng)常性地與來往車輛搶道，路口充滿了安全隱患，設(shè)立了交通指示符號之后。路口的交通就會變得安全有序。符號，無形之中改變了我們的生活習(xí)慣。正因如此，我們應(yīng)該對身邊的符號引起足夠的重視，把用戶界面中的圖標(biāo)元素設(shè)計提升到符號化設(shè)計的高度。

二 產(chǎn)品用戶界面中圖標(biāo)元素設(shè)計的發(fā)展及未來趨向

2.1 現(xiàn)階段用戶界面中國標(biāo)元素的需求趨向

在這個高速發(fā)展的時代，人們每天都在潛移默化地接受著新鮮事物，而隨著智能產(chǎn)品例如手機(jī)的出現(xiàn)，其對用戶界面中的圖標(biāo)元素也有著明顯的沖擊，人們在逐步接受智能產(chǎn)品的過程中，這在年輕人中尤其明顯。對于界面中的圖標(biāo)設(shè)計需求也不在向以往那樣，需求在不自覺中已經(jīng)較過去發(fā)生了一些改變。

2.1.1 情感化的轉(zhuǎn)移

在智能產(chǎn)品如手機(jī)出現(xiàn)之前，可以說產(chǎn)品用戶的界面中圖標(biāo)元素主要是擬物化的設(shè)計為主。人們由于已經(jīng)習(xí)慣原先手機(jī)的按鍵式的操作模式，所以產(chǎn)品所給予人類情感的方式主要是通過視覺傳達(dá)的，即通過多元的界面（陰影，發(fā)光，擬物化）等方式呈現(xiàn)給用戶的；但是隨著智能產(chǎn)品的問世，人們對產(chǎn)品的操作方式產(chǎn)生了根本性的動搖，你會發(fā)現(xiàn)人們不再是冰冷地按動按鈕，而是有著更加多元化的操作體驗（點(diǎn)觸、拖動，長時間按，放大縮小手勢等），人們不在單一地通過界面國標(biāo)即視覺獲得情感，相反，人們對于操控手機(jī)的體驗得到的情感甚至遠(yuǎn)遠(yuǎn)超過了原來多元的界面所帶來的，人們的情感發(fā)生了轉(zhuǎn)移，也可以說人們從單一的視覺情感體驗為主轉(zhuǎn)移到了操作手機(jī)的情感體驗為主。

2.1.2 產(chǎn)品界面中的圖標(biāo)設(shè)計更加服從于功能

由于智能化產(chǎn)品如手機(jī)的問世導(dǎo)致按鍵式操作方式逐漸全屏觸摸方式所取代，這也直接導(dǎo)致現(xiàn)在的產(chǎn)品屏幕也比原來的增大很多，因此其也比原來包含了更多的內(nèi)容、功能、界面及圖標(biāo)，自然而然復(fù)雜程度也相對增加了不少。而面對著這么多的改變，復(fù)雜的增加，現(xiàn)在的界面圖標(biāo)設(shè)計就會相對于以往更加服從于功能，即讓用戶把更多的注意力集中在更加有效的信息上，而不是分散用戶的注意力。

2.2 現(xiàn)在設(shè)計的趨勢——極簡主義

伴隨著win8的上市以及蘋果ios8的發(fā)布，不難發(fā)現(xiàn)，現(xiàn)在用戶界面中圖標(biāo)元素設(shè)計正在發(fā)生明顯的改變，更加簡單以至于簡單到了極點(diǎn)。擬物化設(shè)計正在越來越少被人們談起，而扁平化設(shè)計和符號化設(shè)計有著更加緊密的結(jié)合，形成了一種被大家稱作為極簡主義的設(shè)計趨勢。

2.2.1 極簡主義的特點(diǎn)

極簡主義的概念最核心的地方就是：去掉冗余的裝飾效果，意思是去掉多余的透視，紋理，漸變等能做出3D效果的元素。讓“信息”本身重新作為核心被凸顯出來。并且在設(shè)計元素上強(qiáng)調(diào)抽象、極簡、符號化。

極簡主義設(shè)計的產(chǎn)生源于迎合了用戶需求的變化，即情感的轉(zhuǎn)移和更加讓用戶去留意更加有效的信息，界面服從于功能，這些都是該設(shè)計的優(yōu)點(diǎn)。然而極簡主義的缺點(diǎn)也十分明顯，我個人認(rèn)為其設(shè)計理念不易理解，即它的美很難被人發(fā)現(xiàn)只有受過高等教育的人才能所理解。由于現(xiàn)如今界面被設(shè)計的高度抽象化，簡單化，造成了對人們視覺情感上的忽視，也可以說極簡主義的界面設(shè)計過于單一、冰冷，缺少多樣性的感情。

2.2.2 擬物化設(shè)計不會消失

隨著極簡主義即扁平化和符號化融合的愈發(fā)流行，現(xiàn)在出現(xiàn)了一些類似的聲音即擬物化圖標(biāo)設(shè)計已經(jīng)過時之類的的觀點(diǎn)，我個人并不贊同。我認(rèn)為他們之間不存在著絕對的對立，只是兩種截然不同的風(fēng)格，或者可以說二者是站在了不同的用戶角度、需求去進(jìn)行的設(shè)計。擬物化設(shè)計強(qiáng)調(diào)視覺上接近現(xiàn)實(shí)世界，有著很強(qiáng)的認(rèn)知性；而極簡主義設(shè)計則是強(qiáng)調(diào)高度簡潔的設(shè)計，即盡量地將用戶的注意力放在產(chǎn)品自身的內(nèi)容和功能上，有著很強(qiáng)的抽象性。相較于極簡主義的界面圖標(biāo)設(shè)計，擬物化設(shè)計更加容易被認(rèn)知和理解。

極簡主義風(fēng)格設(shè)計出的圖標(biāo)元素過分強(qiáng)調(diào)簡潔、高效風(fēng)格，主要針對的用戶是在上班族和青年人這些每天生活很緊湊的人，然而這種設(shè)計方式對于兒童、老年人、及其他一些視覺和認(rèn)知并不完善的人來說很難讓人理解。例如你很難讓兒童或者老人輕易地能夠看出（如圖4所示）代表的是照相機(jī)，而且兒童的智力正處在發(fā)展階段，過于單一的用色和平面化的設(shè)計對于兒童的智力發(fā)展也是不利的。相反，擬物化在這方面尤其先天的優(yōu)勢（如圖5所示），由于其高度還原了現(xiàn)實(shí)中產(chǎn)品的形象，所以在認(rèn)知上不會有較大困難。

2.3 未來產(chǎn)品用戶界面中國標(biāo)元素設(shè)計的趨向

就目前的設(shè)計趨勢來看，當(dāng)前的這種極簡主義風(fēng)格還會持續(xù)一陣子，但縱觀設(shè)計史，沒有哪個設(shè)計理念能夠長期作為主導(dǎo)，哪怕是現(xiàn)在看來被奉為經(jīng)典的現(xiàn)代主義，也不過風(fēng)靡了十幾年。因為人類是善變的，長期接受一個風(fēng)格之后就會自然產(chǎn)生厭煩心理，從而產(chǎn)生全新的設(shè)計理念。未來的界面設(shè)計如果發(fā)生改變我認(rèn)為一定會有基于以下幾點(diǎn)原因：

（1）基于用戶群體、情感發(fā)生改變或者主要參考用戶需求產(chǎn)生轉(zhuǎn)移

比如現(xiàn)在是為大多數(shù)年輕人上班族設(shè)計的極簡界面圖標(biāo)，力求高效，加強(qiáng)內(nèi)容和功能，但如果未來不是基于此類人為主導(dǎo)，或者主要考慮用戶群體的需求對于極簡的界面產(chǎn)生厭煩，對于追求簡潔高速的情感產(chǎn)生轉(zhuǎn)變，則必然設(shè)計理念發(fā)生改變。

（2）基于移動智能產(chǎn)品操作模式、交互模式發(fā)生改變

如果未來的產(chǎn)品不再依靠觸摸式方式作為主導(dǎo)交互模式，而是改回按鍵式，或者是很熱門概念的增強(qiáng)現(xiàn)實(shí)技術(shù)在未來得以成熟的應(yīng)用在智能移動端，則我認(rèn)為設(shè)計界面中的圖標(biāo)理念必然為迎合這一新興交互模式的改變而發(fā)生改變。

無論如何，界面中圖標(biāo)元素設(shè)計也是設(shè)計史的一部分，從長遠(yuǎn)的角度看，其必然是符合反復(fù)循環(huán)，并在循環(huán)中產(chǎn)生創(chuàng)新的規(guī)律，用一種新鮮的設(shè)計理念來代替人們已經(jīng)厭倦的舊有理念。

三 結(jié)語

產(chǎn)品的界面圖標(biāo)元素是人與移動產(chǎn)品進(jìn)行交互的紐帶，重要程度不言而喻。在產(chǎn)品高速發(fā)展的今天，我們作為設(shè)計者應(yīng)該時刻關(guān)注用戶需求、情感以及交互手段等的不斷變化。作為一個產(chǎn)品界面中圖標(biāo)元素設(shè)計者，我們應(yīng)該有義務(wù)去為大眾設(shè)計功能良好的圖標(biāo)元素，設(shè)計出符合用戶心理模型的界面圖標(biāo)，幫助用戶解決實(shí)際生活中的所遇到的各種問題，規(guī)劃好、設(shè)計好標(biāo)識系統(tǒng)，更好地為大眾服務(wù)，才能為社會營造出一個和諧有序的生存環(huán)境。