李佳

摘 要：擬物化設(shè)計曾經(jīng)在界面設(shè)計的發(fā)展中扮演者引領(lǐng)潮流的角色?！氨馄交O(shè)計”是近年來嶄露頭角的設(shè)計風(fēng)格。文章具體闡述和分析了擬物化設(shè)計盛行和沒落的發(fā)展歷程、原因及扁平化設(shè)計的特點；并針對業(yè)界所爭執(zhí)的孰是孰非的熱議現(xiàn)象表明觀點：好的設(shè)計是適合的設(shè)計，設(shè)計的本質(zhì)不在于外觀形式，而在于強調(diào)信息結(jié)構(gòu)的組織性和優(yōu)良的用戶體驗。

關(guān)鍵詞：界面設(shè)計 扁平化 擬物化

檢 索：www.artdesign.org.cn

Abstract ：Skeuomorphism had led the development trend and played a pivotal role in interface design for decades. The flat design became popular and prevailing recently. This paper not only elaborated the development process of Skeuomorphism， analyzed the reasons for these changes， but described the key features of the flat design simultaneously. The author expressed the view on the arguable “hot spot” in the nature of design， and concluded that “Good design was not just focus on the style， it would serve the object properly， the crucial issue was providing good user experience with organized and logical information.”

Keywords ：Interface Design， Flat Design， Skeuomorphism

Internet ：www.artdesign.org.cn

2013年，“扁平化設(shè)計”一詞在交互設(shè)計業(yè)界大概是被提及最多的大熱詞匯。事實上早在2006年，當(dāng)微軟推出的一款mp3播放器zune的界面時，扁平化的設(shè)計風(fēng)格已初見端倪，但由于產(chǎn)品本身的推廣不力，尚未形成熱潮。2012年，當(dāng)微軟公司揭開windows8的神秘面紗那一刻，其鮮明簡潔的扁平化風(fēng)格界面再次引起業(yè)界及用戶的熱議。一度推崇擬物化風(fēng)格多年的蘋果公司，在公司高層動蕩過后，新任副總裁Johnthan Ive曾表示過厭惡擬物化風(fēng)格，2013年9月全新推出的ios7也正是以其全新的扁平化展示于大眾，全面轉(zhuǎn)化了多年來蘋果公司所塑造的視覺形象。

談及扁平化設(shè)計，與之伴隨的另一詞匯“擬物化設(shè)計”因為與之大相徑庭的設(shè)計原則與表現(xiàn)風(fēng)格，常常被同時提及并與之比較。曾幾何時，擬物化設(shè)計風(fēng)格引領(lǐng)界面設(shè)計潮流多年，可謂風(fēng)聲水起，千萬設(shè)計師瘋狂追尋樂此不疲。而如今又為何遭受扁平化設(shè)計的沖擊，甚至面臨被顛覆的狀況呢？

一、擬物化設(shè)計

（一）什么是擬物化設(shè)計

所謂擬物化（Skeuomorphism），原本是希臘詞匯，在wikipedia里是這樣解釋的：“擬物化是指對象保留了舊時特質(zhì)的裝飾性元素，這些元素對于當(dāng)前對象的功用已不再必要。”擬物化曾一度在材料應(yīng)用領(lǐng)域廣泛使用，比如人造革，仿木紋的塑料地膠，都屬于擬物化。

在數(shù)字界面領(lǐng)域里，擬物化設(shè)計起源于圖形界面（GUI）的視覺隱喻（Visual Metaphor）。往往指界面設(shè)計模仿現(xiàn)實物質(zhì)世界中的事物，以使其外觀讓人感覺熟悉和親切。比如桌面、文件、文件夾、回收站這樣的概念都是基于桌面系統(tǒng)的隱喻。繼1984年蘋果公司的Macintosh推出后，這種隱喻也廣泛應(yīng)用于windows、Mac OS X、Linux等桌面操作系統(tǒng)以及移動裝置，并逐漸被大眾所熟悉?？梢哉f，是擬物化設(shè)計用直觀易理解的物象將數(shù)字世界抽象的概念表現(xiàn)出來，大大加快了普通大眾接受數(shù)字信息的步伐。

對于那些對數(shù)字世界不甚了解的人群，擬物化設(shè)計幫助他們將虛擬世界用戶不熟悉的內(nèi)容與現(xiàn)實世界用戶所熟悉的物象產(chǎn)生聯(lián)系，使其更易理解。蘋果公司的ios系統(tǒng)的人機界面指南里曾經(jīng)說到，“當(dāng)你應(yīng)用中的可視化對象和操作按照現(xiàn)實世界中的對象與操作模仿，用戶就能快速領(lǐng)會如何使用它?！睘榱俗層脩粲X得真實親切，擬物化設(shè)計注重視覺元素的精細、層次、用光等，以期創(chuàng)造出逼真的形象。

（二）擬物化的濫用

當(dāng)擬物化風(fēng)格逐步在界面設(shè)計領(lǐng)域占據(jù)主導(dǎo)地位后，似乎逐步陷入一種怪圈。眾多設(shè)計師投入過多精力到諸如反復(fù)修整皮革背景紋理或反復(fù)調(diào)整投影角度的工作中，反而忽略了交互行為本身。而事實上光影是否真實，質(zhì)感是否逼真并不能使用戶更有效率地完成任務(wù)。眾多界面擬物化的濫用及過度設(shè)計，產(chǎn)生了很多不易用，給用戶帶來負擔(dān)的產(chǎn)品。

擬物化設(shè)計往往試圖給予用戶共鳴，如果產(chǎn)品的外觀展現(xiàn)得越逼真，用戶使用時越容易預(yù)先產(chǎn)生一種與原來對象特性相同的期待。然而由于產(chǎn)品特性、操作方式和原有參照物存在諸多不同，新產(chǎn)品無法給予用戶原本期待的物理反饋。這種逼真感反而會使用戶在進行操作時感到受挫或無所適從。

以Quicktime4播放器界面的音量調(diào)節(jié)設(shè)計為例（圖1）。傳統(tǒng)的真實世界的播放器是用旋鈕來調(diào)整音量的，用大拇指可以很容易地完成操作。可是放置在界面中的旋鈕并不能有真實的觸感，需要用指針艱難地向上滑動，旋鈕暴露的部分很少，可能需要用戶多次拖拽放才能完成操作。雖然設(shè)計者可能也認識到了這個問題，另外添加了可通過鼠標指針調(diào)整音量的功能，用戶需要在旋鈕附近點擊并拖拽。但是這個功能常常不被用戶所知，因為沒有任何提示顯示可以用這種方式操作。顯然，從用戶體驗和人機工學(xué)的角度，這個旋鈕的設(shè)計是失敗的。在其Quicktime5版本中這個音量調(diào)節(jié)的旋鈕被去掉了。因此，不論其表面看來多么逼真，質(zhì)感多么接近現(xiàn)實，只要不能讓用戶覺得好用就不是個好的設(shè)計。endprint

（三）擬物化設(shè)計也有其自身的局限性

擬物化設(shè)計常常用一個具體的物象喚起人們對于某種經(jīng)驗的聯(lián)想，這一具體的物象由于文化的差異性往往不能在所有地域產(chǎn)生同樣的效果。

隨著科技的發(fā)展，曾經(jīng)在一個時間段廣泛普及的參照物本身可能已經(jīng)不再是被頻繁使用，甚至已經(jīng)被歷史淘汰，那么原有的設(shè)計也不得不相應(yīng)作出調(diào)整。至今仍被廣泛使用的儲存圖標，是一個磁盤的圖形，對于很多現(xiàn)在的青少年，他們從未經(jīng)歷過那個需要用3.5寸盤儲存1.44M文件的年代，對于他們來說，這個擬物已經(jīng)失去意義了，他們只是在記住圖形本身而已。

二、扁平化風(fēng)格

（一）時代背景：數(shù)碼產(chǎn)品神秘感不在，人們更關(guān)注效用

在數(shù)碼產(chǎn)品不是那么普及的年代，擁有一臺電腦，一部手機或許是一種奢侈品，而不曾擁有的人如有機會把玩也會對于各個按鈕或圖標試試新鮮，而后再為其逼真細膩的視覺風(fēng)格感嘆一番。而如今隨著科技的發(fā)展，智能手機、觸屏對于大眾已不再陌生。在人人都有電腦，人人有手機的時代，數(shù)碼產(chǎn)品的普及已經(jīng)使得一切不再新鮮，人們更傾向于數(shù)碼產(chǎn)品是否可以快速地幫助他們達到目的，是否高效。與之同時，也已經(jīng)不需要通過擬物化去降低學(xué)習(xí)成本了，擬物的使命至此已經(jīng)終結(jié)。

（二）扁平化風(fēng)格——界面設(shè)計的極簡主義

猶如20世紀60年代，在建筑設(shè)計領(lǐng)域極簡主義風(fēng)格的興起是源于對當(dāng)時代過度裝飾的顛覆一樣，扁平化設(shè)計也以其簡潔明了的風(fēng)格一反擬物化強調(diào)效果、裝飾性的特點，成為了2013年應(yīng)用設(shè)計最顯著的趨勢。

擬物化風(fēng)格在主宰界面設(shè)計多年之后，大眾也逐漸對其從最初的震撼吸引變?yōu)榱?xí)以為常，甚至審美疲勞。風(fēng)格潮流的輪回至此，將扁平化設(shè)計風(fēng)格推到了風(fēng)口浪尖。

扁平化設(shè)計的特點：

1.拒絕特效。扁平化設(shè)計以二維形態(tài)示人，放棄一切裝飾效果。和擬物化設(shè)計強調(diào)的質(zhì)感光影不同，扁平化設(shè)計摒棄一切諸如浮雕、投影、高光等特效，僅以鮮明的色塊和突出的文字信息呈現(xiàn)。

2.簡潔的視覺形態(tài)。扁平化設(shè)計通常盡量使用最簡單的幾何形，如圓形或長方形的形態(tài)特征，使圖形簡潔突出，方便點擊。

3.強調(diào)色彩鮮明。扁平化設(shè)計常常用色鮮明，傾向于有更多色彩的搭配，同一界面的配色可能到6-8種顏色。

4.重視排版。排版不僅僅是關(guān)于視覺美學(xué)，更是一門信息組織的學(xué)問。了解用戶的需求，在合適的地方以適當(dāng)?shù)淖煮w字號呈現(xiàn)，展現(xiàn)清晰的視覺層次，幫助用戶更有效的達到預(yù)期目的，會有助于提高用戶體驗。

5.做減法。包豪斯時期米斯凡德羅所提出了“少即是多”的設(shè)計原則，扁平化設(shè)計可以說是在界面設(shè)計中充分地詮釋了這一理念，即強調(diào)對于一切視覺元素做減法，避免不必要的元素出現(xiàn)在頁面中。

德國著名產(chǎn)品設(shè)計師 Dieter Rams曾經(jīng)提出關(guān)于“什么是好設(shè)計”的十條原則，其中一條就是“盡可能簡潔的設(shè)計——少，但是更好。因為把精力都集中在最精華的部分，設(shè)計應(yīng)回歸純粹，回歸簡約?！?/p>

這樣的特點也正好反映了交互設(shè)計中一貫強調(diào)的可用性原則，用戶需要什么就給他們什么，過多的不必要元素的放置是在制造視覺噪聲，給用戶帶來負擔(dān)。

通過比較部分蘋果ios6和ios7的界面，扁平化設(shè)計的風(fēng)格相對于之前的擬物化顯得更加開闊和敞亮，同樣的篇幅內(nèi)容如果加入3d光影效果，容易顯得擁擠，信息量受限。后者平面化的效果通過單純的色彩變化，去除了視覺噪聲，反而更突出了操作內(nèi)容。（圖2）

（三）扁平化設(shè)計是否適用于所有設(shè)計？

好的設(shè)計是適合的設(shè)計。扁平化設(shè)計的視覺風(fēng)格對于信息量大，層級多的網(wǎng)站來說非常適用，使用戶可以快速清晰地找尋所需的信息。但是對于角色扮演類游戲網(wǎng)站，或者電影宣傳網(wǎng)站就未必是個好的選擇。這種類型的網(wǎng)站，更側(cè)重于營造某種氛圍，使用戶沉浸其中，所以視覺的震撼是必不可少的部分。

另外，一些界面中的細節(jié)，淺淺的陰影或輕微的懸浮效果對于信息分層上還是發(fā)揮了效果，若恪守絕對扁平化的風(fēng)格，所有的視覺元素將會被置于同一平面，用戶在使用時有可能產(chǎn)生疑慮，到底哪些地方可以點擊?？此坪唵蔚谋馄交O(shè)計其實面臨的是更大的挑戰(zhàn)。

三、被誤讀的擬物化和扁平化

由于眾多強調(diào)細節(jié)層次的擬物化的涌現(xiàn)，使得很多時候被大眾將擬物化完全等同于寫實主義，認為擬物化一定是復(fù)雜繁瑣的，立體的，而扁平化就是擬物化的對立面。事實上，是二維還是三維只是表現(xiàn)形式的差異，并不能從本質(zhì)涵義上將二者對立。扁平化的表現(xiàn)形式雖然簡潔，但從其所包含的涵義來說也未必不能是擬物的。比如在蘋果ios7里的camera，clock圖標，就是一個典型的扁平化的表現(xiàn)形式，但是其根本實質(zhì)卻還是擬物的。（圖3）

四、設(shè)計的本質(zhì)是給用戶提供有效的服務(wù)和良好的體驗

設(shè)計，是為了完成任務(wù)，解決問題?？捎眯院陀脩趔w驗比外觀更重要。如何高效地幫助和指導(dǎo)用戶完成他們想做的事，是設(shè)計的根本。用戶看重的是完成任務(wù)流程的順暢程度和完成過程中的感受。

信息的組織性和展示方式很大程度決定了最終接收信息的效果。應(yīng)該確保最重要的信息最先被發(fā)現(xiàn)。相對擬物化風(fēng)格為追求逼真和細節(jié)而帶來諸多視覺元素之間的復(fù)雜關(guān)系，扁平化設(shè)計風(fēng)格視覺元素簡潔單純，更容易突出重點。

一些界面中的細節(jié)，淺淺的陰影或輕微的懸浮效果對于信息分層上還是發(fā)揮了效果，若恪守扁平化的風(fēng)格，所有的視覺元素將會被置于同一平面，用戶在使用時有可能產(chǎn)生疑慮，到底哪些地方可以點擊。解決這樣的問題可以通過大小、空間、距離、色彩的對比讓需要被最先關(guān)注的對象更突出?？此坪唵蔚谋馄交O(shè)計其實面臨的是更大的挑戰(zhàn)。

結(jié)語

在設(shè)計的歷史長河里，潮流終有輪回，一種風(fēng)格盛行到一定程度容易使大眾產(chǎn)生審美疲勞，在此背景下另一種與之迥異的風(fēng)格凸顯出來是時代發(fā)展的必然。扁平化設(shè)計與擬物化設(shè)計談不上孰是孰非，也談不上絕對的對立，討論它們二者誰更好就像爭論到底哪種顏色最美一樣沒有必要。它們只是不同的視覺風(fēng)格，對于設(shè)計師來說，更重要的是研究把什么樣的形式運用在合適的對象上。

參考文獻

1 Alan Cooper， Robert Reimann，David Cronin.About Face 3；交互設(shè)計精髓[M]，劉松濤等譯，北京：電子工業(yè)出版社，2012.

2 Robert Hoekman， Jr.瞬間之美[M]，向怡寧譯，北京：人民郵電出版社，2009.

3 王受之.世界現(xiàn)代設(shè)計史[M]，深圳：新世紀出版社，1996.

4 傅小貞，胡甲超，鄭元攏.移動設(shè)計[M]，北京；電子工業(yè)出版社，2013.endprint