好玩的界面設(shè)計(jì)

中圖分類號(hào)：TP399"文獻(xiàn)標(biāo)識(shí)碼：A

摘要：世界著名交互設(shè)計(jì)師Paul"Jacques"Grillo曾說(shuō)過(guò)：“簡(jiǎn)單并不意味著欠缺或低劣，也不意味著不注重裝飾或者完全赤裸裸。而是說(shuō)裝飾應(yīng)該緊密貼近設(shè)計(jì)本身，任何無(wú)關(guān)的要素都應(yīng)該予以剔除?！睋Q句話說(shuō)，拋開(kāi)極簡(jiǎn)主義，也能夠成就簡(jiǎn)單。簡(jiǎn)單的特征和個(gè)性應(yīng)該源于所使用的方法、所要表現(xiàn)的產(chǎn)品，以及用戶執(zhí)行的任務(wù)。當(dāng)今計(jì)算機(jī)科學(xué)技術(shù)的發(fā)展改變了人們的生活生產(chǎn)方式，同時(shí)促使藝術(shù)的表現(xiàn)形式產(chǎn)生巨大的革新，人們開(kāi)始探究技術(shù)與藝術(shù)之間的連接點(diǎn)，如何將技術(shù)帶入尋常百姓的生活并同時(shí)滿足人們對(duì)于物質(zhì)與精神文明的追求，交互界面則是兩者最好的橋梁。隨著技術(shù)的進(jìn)步和發(fā)展，圖形用戶界面促使產(chǎn)品與人的交互更加親密，通過(guò)圖形，顏色，版面來(lái)表現(xiàn)產(chǎn)品的圖形用戶界面，以準(zhǔn)確地、有效地表達(dá)產(chǎn)品內(nèi)部的信息和行為。

關(guān)鍵詞：界面設(shè)計(jì);簡(jiǎn)約至上;交互設(shè)計(jì);用戶體驗(yàn)

簡(jiǎn)單并不意味著最少化。樸素的設(shè)計(jì)仍然具有自身的特征和個(gè)性。而交互設(shè)計(jì)是新媒體科學(xué)技術(shù)發(fā)展過(guò)程中的必然產(chǎn)物，是指人與產(chǎn)品、系統(tǒng)之間創(chuàng)建的一系列對(duì)話。產(chǎn)品的思維和想法是無(wú)法直接被用戶讀出，則需要適當(dāng)?shù)姆绞綄⒂脩襞c產(chǎn)品連接在一起到達(dá)互動(dòng)與交流，這種聯(lián)系往往發(fā)生在視覺(jué)上，既是交互界面，通常通過(guò)圖形，顏色，版面來(lái)構(gòu)成產(chǎn)品的外在表現(xiàn)，用以表達(dá)產(chǎn)品內(nèi)部的信息和行為，則為“圖形用戶界面設(shè)計(jì)”（Graphical"User"Interface，簡(jiǎn)稱GUI）。它綜合了“計(jì)算機(jī)科學(xué)”、“人機(jī)工程學(xué)”、“認(rèn)知心理學(xué)”、“藝術(shù)學(xué)”等眾多學(xué)科，發(fā)展成為一門(mén)獨(dú)立的學(xué)科。

無(wú)論是設(shè)計(jì)整個(gè)web站點(diǎn)還是設(shè)計(jì)一個(gè)下拉菜單，都需要對(duì)什么事簡(jiǎn)單的體驗(yàn)有一個(gè)認(rèn)識(shí)。這個(gè)認(rèn)識(shí)將成為判斷自己是否保持簡(jiǎn)單的一個(gè)標(biāo)準(zhǔn)。早期的計(jì)算機(jī)交互界面使用的是命令式的提示界面，圖形用戶界面設(shè)計(jì)打破了這種不具情感化的設(shè)計(jì)，從單調(diào)的命令式提示轉(zhuǎn)化為圖形界面，以窗口，菜單，按鈕的圖形組合方式代替操作，無(wú)疑是對(duì)交互界面的一個(gè)重大的變革，同時(shí)減少了用戶死記硬背計(jì)算機(jī)命令的麻煩，將人從繁瑣的命令中解放出來(lái)，產(chǎn)生愉悅的交互體驗(yàn)。

最早的圖形用戶界面是受史蒂芬·保羅·喬布斯[Steve"P.（aul）Jobs，1955—2011]最早研發(fā)的Macintosh的影響，從此進(jìn)入圖形用戶界面的設(shè)計(jì)?？v觀國(guó)際市場(chǎng)，越來(lái)越多的業(yè)界人士開(kāi)始注重GUI的設(shè)計(jì)，甚至有公司專門(mén)設(shè)立設(shè)計(jì)團(tuán)隊(duì)組建自己的產(chǎn)品的GUI設(shè)計(jì)，業(yè)界老大“蘋(píng)果”公司則是最好的代表，其產(chǎn)品的GUI設(shè)計(jì)引領(lǐng)GUI設(shè)計(jì)的發(fā)展潮流，并成功地創(chuàng)建了用戶與產(chǎn)品的情感?！肮雀琛惫镜脑O(shè)計(jì)團(tuán)隊(duì)，打造趣味性的個(gè)性化體驗(yàn)界面，吸引用戶的同時(shí)增加了網(wǎng)頁(yè)的點(diǎn)擊量等。

圖形用戶界面設(shè)計(jì)的發(fā)展史相對(duì)于藝術(shù)設(shè)計(jì)史等學(xué)科是非常短的，從20世紀(jì)80年代發(fā)展到現(xiàn)在也不過(guò)幾十年，但是它的出現(xiàn)使人與機(jī)器的交互方式發(fā)生了巨大變革，是計(jì)算機(jī)普及的重要因素，對(duì)計(jì)算機(jī)的進(jìn)一步發(fā)展和創(chuàng)新有著重要的意義。

用戶界面設(shè)計(jì)中的視覺(jué)元素都有其基本的屬性，在不同的功能性產(chǎn)品中扮演不同的性格，比如形狀，方形的圖形規(guī)矩、嚴(yán)謹(jǐn)、中庸、干練，又如顏色，紅色，激情、熱烈不同屬性的元素組合在一起創(chuàng)造出具有一定意義的視覺(jué)信息，各種元素在不同功能的產(chǎn)品中會(huì)扮演不同的性格屬性，將兩個(gè)相同屬性的元素組合在一起，他們兩個(gè)的關(guān)聯(lián)性更大，兩個(gè)不同屬性的元素組合在一起，則會(huì)吸引用戶注意，產(chǎn)生交互。我們經(jīng)常會(huì)看到兒童對(duì)于圖形的辨別能力非常強(qiáng)，在一些元素中讓兒童跳出“這幾樣?xùn)|西中哪個(gè)東西和其他不一樣？”“哪個(gè)不屬于其他東西？”，他們會(huì)準(zhǔn)確的辨別出不同的元素，其實(shí)這是人類與生俱來(lái)的本領(lǐng)。同樣，圖形用戶界面設(shè)計(jì)也是遵循這個(gè)人之初的本領(lǐng)組織和創(chuàng)造有意義的視覺(jué)界面。不難發(fā)現(xiàn)，“蘋(píng)果”系列產(chǎn)品老少皆宜，上手即可操作，正是因?yàn)樗膱D形用戶界面設(shè)計(jì)很好的將不同屬性的元素組織起來(lái)，準(zhǔn)確體現(xiàn)產(chǎn)品的屬性和功能，創(chuàng)造出易用且讓用戶喜歡的界面。

交互設(shè)計(jì)是邏輯性設(shè)計(jì)的基本要素，是產(chǎn)品可用性的關(guān)鍵。首先得到基本系統(tǒng)構(gòu)架后則需要了解界面中視覺(jué)元素的屬性和組成屬性，使用視覺(jué)元素：圖形，顏色，版式來(lái)區(qū)分界面每個(gè)結(jié)構(gòu)的層次。閱讀方式和習(xí)慣的視覺(jué)流程：一般標(biāo)準(zhǔn)邏輯為從左到右，從上到下，從大到小的原則。一致性的圖形用戶界面設(shè)計(jì)指產(chǎn)品屬性與界面風(fēng)格的一致性，產(chǎn)品行為與界面與用戶的一致性。一致性設(shè)計(jì)原則是體現(xiàn)企業(yè)文化，產(chǎn)品屬性和功能性的關(guān)鍵，目的讓產(chǎn)品更準(zhǔn)確地傳達(dá)信息，提高產(chǎn)品易用性，讓用戶更好地理解產(chǎn)品，降低操作難度，創(chuàng)建和諧的操作過(guò)程。其次有利于定位品牌形象，擴(kuò)大影響力和提升知名度。

例如，在電子產(chǎn)品中的巨頭“蘋(píng)果”系列產(chǎn)品，我們?yōu)楹慰梢詼?zhǔn)確定位一款“蘋(píng)果”的產(chǎn)品？分析其產(chǎn)品：專屬的“蘋(píng)果”標(biāo)志;方形圓角的產(chǎn)品外觀設(shè)計(jì);白色、銀色、黑色的產(chǎn)品色;獨(dú)立的IOS系統(tǒng)和界面設(shè)計(jì)，這五個(gè)方面統(tǒng)一起來(lái)，成為我們能夠辨別其產(chǎn)品的原因，如果有一個(gè)違背了其中一個(gè)方面，則不是“蘋(píng)果”產(chǎn)品，這便是遵循一致性原則。

在功能性設(shè)計(jì)中，人們?cè)谝曈X(jué)元素中創(chuàng)建獨(dú)特的有意義的符號(hào)，例如GUI中的圖標(biāo)設(shè)計(jì)，窗口的紙張折疊設(shè)計(jì)，文件的文件夾設(shè)計(jì)，播放器的音樂(lè)符號(hào)等，都是提供了功能性的設(shè)計(jì)，讓用戶在一次就能得到系統(tǒng)所表達(dá)的功能指向。人們采用了最直接最保守的擬物設(shè)計(jì)，從自然界借鑒人們已經(jīng)習(xí)慣的信息設(shè)計(jì)GUI，這已經(jīng)是業(yè)界最普遍和濫用的方式，也許你已經(jīng)疲憊或厭倦了，但是這種表現(xiàn)方式經(jīng)久不衰的原因正是因?yàn)樗軠?zhǔn)確地體現(xiàn)功能性。

當(dāng)“蘋(píng)果”系統(tǒng)的GUI設(shè)計(jì)從IOS"6升級(jí)為IOS"7時(shí)，它想世人展示了GUI設(shè)計(jì)中的突破與創(chuàng)新，這一大膽的嘗試與改變促使它新的系列產(chǎn)品大獲人心。從以前保守的擬物化設(shè)計(jì)變身為最前沿的扁平化風(fēng)格設(shè)計(jì)。當(dāng)然突破性的改變是基于一些最基本的GUI設(shè)計(jì)原則，既我們上邊提到的邏輯性、一致性和功能性，只是說(shuō)在原則和創(chuàng)新中，我們需要找到一個(gè)平衡點(diǎn)。

我們一再提到用戶習(xí)慣，我們的原則中也是自始至終“以人為本”，利用用戶的習(xí)慣創(chuàng)造GUI設(shè)計(jì)，但是我們卻忽略了人的大腦是完美的設(shè)計(jì)器官，我們不僅能通過(guò)使用習(xí)慣對(duì)事物做出反應(yīng)，面對(duì)新的事物時(shí)，我們通過(guò)特定的方式經(jīng)過(guò)大腦培養(yǎng)新的習(xí)慣同樣可以做出相應(yīng)的回應(yīng)。比如在扁平化設(shè)計(jì)風(fēng)格的確立前，人們固化的思維模式之停留在擬物的設(shè)計(jì)中，但是人們?cè)缫旬a(chǎn)生視覺(jué)疲勞，千篇一律的GUI設(shè)計(jì)不能使用戶在使用過(guò)程中保持愉悅，所以我們有了新的追求和方向便可以打破原有的思維模式，跳出固化的思想圈，創(chuàng)造新的GUI設(shè)計(jì)。不難發(fā)現(xiàn)，GUI的設(shè)計(jì)不斷出新且內(nèi)容形式多樣化，插畫(huà)、涂鴉等表現(xiàn)手法在當(dāng)代界面設(shè)計(jì)中也是越來(lái)越廣泛?？茖W(xué)技術(shù)的進(jìn)步也是促使GUI設(shè)計(jì)出新的手段，3D技術(shù)將傳統(tǒng)的靜態(tài)交互界面設(shè)計(jì)三維化，給GUI設(shè)計(jì)提供了新的創(chuàng)作靈感。

GUI并不是單一的設(shè)計(jì)工作，它的跨學(xué)科性，就注定它的多樣性和可塑造性。也許在創(chuàng)新的過(guò)程中會(huì)遇到很多挑戰(zhàn)和風(fēng)險(xiǎn)，但一個(gè)突破也許就會(huì)成為下一個(gè)能改變用戶使用習(xí)慣的設(shè)計(jì)。人類不斷隨著社會(huì)的發(fā)展，技術(shù)的進(jìn)步而成長(zhǎng)，所以在人機(jī)交互時(shí)代下，對(duì)GUI設(shè)計(jì)的研究與創(chuàng)新更是值得一試的任務(wù)。將未來(lái)把握在自己的手中才是至關(guān)重要的。

參考文獻(xiàn)：

[1]《About"Face"3，交互設(shè)計(jì)精髓》（美）庫(kù)伯（Cooper，A.），（美）瑞寧（Reimann，R.）（美）克洛林（Cronin，D.），劉松濤等譯，北京：電子工業(yè)出版社，2012年3月

[2]《簡(jiǎn)約至上-交互設(shè)計(jì)四策略》（英）Giles"Colborne著，李松峰"秦緒文"譯"人民郵電出版社

[3]人機(jī)交互界面設(shè)計(jì)原則，2012-11-22[OL]http：//onekingwin.blog.163.com/blog/static/119777811201210229166740/