扁平化與擬物化設(shè)計(jì)應(yīng)用的比較研究

任葆軒 哈爾濱師范大學(xué)

擬物化設(shè)計(jì)是因?yàn)槠涓叨饶M現(xiàn)實(shí)生活中的物體而得名，而扁平化設(shè)計(jì)強(qiáng)調(diào)設(shè)計(jì)的抽象化，兩種設(shè)計(jì)風(fēng)格獨(dú)立卻又有傳承。在大多數(shù)設(shè)計(jì)師看來(lái)擬物化設(shè)計(jì)可玩性較強(qiáng)，更加體現(xiàn)設(shè)計(jì)師在設(shè)計(jì)產(chǎn)品時(shí)想表達(dá)的初衷，而在用戶體驗(yàn)上多數(shù)人又覺(jué)得扁平化設(shè)計(jì)簡(jiǎn)潔明快。美觀因人而異，用比較的方法研究出擬物化和扁平化的優(yōu)劣。旨在未來(lái)的UI設(shè)計(jì)領(lǐng)域中提供些有意義的借鑒。

1 在手機(jī)app中的設(shè)計(jì)對(duì)比

在手機(jī)的應(yīng)用圖標(biāo)及界面中，擬物化設(shè)計(jì)的設(shè)計(jì)元素更多，在互動(dòng)體現(xiàn)方面更有表現(xiàn)力。喬布斯對(duì)于設(shè)計(jì)有一個(gè)觀點(diǎn):“好產(chǎn)品不需要說(shuō)明書(shū)，無(wú)論是科技達(dá)人還是小孩子都能拿起就用”。擬物化設(shè)計(jì)無(wú)疑符合這一標(biāo)準(zhǔn)，它把人們現(xiàn)實(shí)生活中的操作體驗(yàn)和邏輯帶到虛擬設(shè)備中去，使人們第一次使用也不陌生，降低了學(xué)習(xí)難度。日本設(shè)計(jì)大師深澤直人有個(gè)設(shè)計(jì)理念——無(wú)意識(shí)設(shè)計(jì)。即發(fā)現(xiàn)人們本能、神經(jīng)反射、情緒、經(jīng)驗(yàn)等熟知卻不好表述的元素放大進(jìn)行設(shè)計(jì)，使用戶對(duì)設(shè)計(jì)產(chǎn)品產(chǎn)生熟悉、慣用的感覺(jué)。與其說(shuō)無(wú)意識(shí)設(shè)計(jì)更應(yīng)該說(shuō)成是“潛意識(shí)習(xí)慣”，當(dāng)我們打開(kāi)手機(jī)看到那個(gè)黃色便簽的圖標(biāo)，即使不看使用說(shuō)明，我們也知道那是備忘錄軟件。當(dāng)我們打開(kāi)音樂(lè)播放軟件我們知道通過(guò)如何調(diào)節(jié)聲音大小，因?yàn)槲覀兊募依镎娴木蛽碛心菢诱{(diào)節(jié)音量的錄音機(jī)。這是人們長(zhǎng)期在生活中積攢下來(lái)經(jīng)驗(yàn)和神經(jīng)反射造成的結(jié)果；無(wú)關(guān)美感，擬物化設(shè)計(jì)隨著人們眼光的提高也不再是單純的擬物，而是在擬物的基礎(chǔ)上添加了各種主題風(fēng)格，比如軍事科技風(fēng)、復(fù)古風(fēng)等。這些主題風(fēng)格更能展現(xiàn)設(shè)計(jì)師的功底，擬物化設(shè)計(jì)擁有的視覺(jué)表現(xiàn)力是扁平化設(shè)計(jì)無(wú)法比擬的，吸引力和視覺(jué)沖擊是擬物化突出的特點(diǎn)。

2 在PC軟件中的設(shè)計(jì)對(duì)比

扁平化與擬物化在pc端的應(yīng)用的對(duì)比中，扁平化設(shè)計(jì)的界面在美觀持久度和視覺(jué)引導(dǎo)上有更大優(yōu)勢(shì)。當(dāng)人們對(duì)電腦的使用操作已經(jīng)有了路徑依賴之后，視覺(jué)上的需求就會(huì)降低而使用體驗(yàn)上的要求就會(huì)提高。扁平化的設(shè)計(jì)，單色塊和簡(jiǎn)單的圖形有減少視覺(jué)疲勞的效果。例如Photoshop這款軟件的圖標(biāo)變遷:從20實(shí)際90年代最初的一只眼睛演變成為cs2版本的一支羽毛，到現(xiàn)在深色底淺色字的圖標(biāo)字母。用戶量不斷的增多，圖標(biāo)反而越來(lái)越簡(jiǎn)潔，無(wú)需多余的設(shè)計(jì)只用了深藍(lán)色的底加上淺藍(lán)色的邊框，再在框的中心貼上PS就清楚的告訴用戶這就是Photoshop軟件；唐納德.諾曼說(shuō)過(guò)，設(shè)計(jì)最重要的目的不是為了體現(xiàn)創(chuàng)意，也不是越復(fù)雜越好，設(shè)計(jì)的本質(zhì)是——溝通。扁平化設(shè)計(jì)的簡(jiǎn)潔突出主要元素，給人的視覺(jué)感受也更加干練，當(dāng)用戶打開(kāi)電腦需要進(jìn)行復(fù)雜工作的時(shí)候，扁平化設(shè)計(jì)的圖標(biāo)界面會(huì)減緩人面對(duì)復(fù)雜問(wèn)題的心理壓力；扁平化用清晰的圖形元素創(chuàng)建最簡(jiǎn)潔的視覺(jué)效果，去掉多余的線和框，僅用內(nèi)容本身來(lái)布局內(nèi)容，為內(nèi)容留出呼吸空間，還起到視覺(jué)引導(dǎo)作用。我們現(xiàn)在常用的wps的操作界面就有很強(qiáng)的視覺(jué)引導(dǎo)，簡(jiǎn)單的圖標(biāo)給功能文字留下的很多空間，人們觀看這個(gè)按鈕的功能一目了然。

3 在移動(dòng)終端中的應(yīng)用對(duì)比

在移動(dòng)應(yīng)用上扁平化的設(shè)計(jì)優(yōu)勢(shì)突出，扁平化的設(shè)計(jì)可以在移動(dòng)應(yīng)用的界面上去除多余信息提供更準(zhǔn)確的信息。移動(dòng)應(yīng)用主要是指企業(yè)級(jí)的商務(wù)應(yīng)用，是企業(yè)信息化應(yīng)用場(chǎng)景的完善與擴(kuò)展，目的是在互聯(lián)網(wǎng)之上的延伸。扁平化的設(shè)計(jì)能夠使移動(dòng)應(yīng)用更有效的扁平化模塊化突出功能減少操作。例如北京地鐵查詢系統(tǒng)，每一種顏色代表一條地鐵的線路，應(yīng)用在扁平化設(shè)計(jì)的地圖上清晰明確的告訴旅客每條線路的信息；再比如在智能電視中愛(ài)奇藝的分類界面，棕黃色色塊代表電影、藍(lán)色色塊代表電視劇、粉色色塊代表綜藝娛樂(lè)、黃色色塊代表少兒，這種色塊加文字的扁平化設(shè)計(jì)，除了色彩對(duì)用戶的心理暗示，更加快捷的用文字加以分類。路德維希.密斯.凡德羅提出:“少即是多”。這種思想使得現(xiàn)代主義達(dá)到了空前的高峰，也是UI設(shè)計(jì)里扁平化設(shè)計(jì)的基礎(chǔ)理論。把不需要的裝飾排除掉，只留下基礎(chǔ)的主體，突出主體功能，達(dá)到視覺(jué)上的減法，思想意識(shí)上的加法。

4 結(jié)束語(yǔ)

其實(shí)在UI設(shè)計(jì)中，并沒(méi)有擬物化設(shè)計(jì)與扁平化設(shè)計(jì)好與不好，只有產(chǎn)品本身的優(yōu)與劣。只是以前的UI由于受到當(dāng)時(shí)技術(shù)的限制過(guò)時(shí)了。擬物化設(shè)計(jì)并沒(méi)有被扁平化設(shè)計(jì)宣告死亡，扁平化設(shè)計(jì)也并不是最新的設(shè)計(jì)理念。擬物化設(shè)計(jì)融入了扁平化設(shè)計(jì)，扁平化設(shè)計(jì)也繼承了擬物化設(shè)計(jì)。在未來(lái)的UI設(shè)計(jì)中一定是視覺(jué)展現(xiàn)加用戶體驗(yàn)，是擬物化設(shè)計(jì)與扁平化設(shè)計(jì)共同發(fā)展。

[1]Matt Jones,Gary Marsden ( 美 ) 移動(dòng)設(shè)備交互設(shè)計(jì)，譯.奚丹電子工業(yè)出版社，2008

[2]常海，蔣曉，交互設(shè)計(jì)中的用戶控制桿研究[ J ]. 包裝工程，2010，31（4）：29-31.

[3]The Design of Everyday Things 設(shè)計(jì)心理學(xué)Donald A.Norman 唐納德.A.諾曼，中信出版社，2003