藍(lán)藍(lán)設(shè)計(jì)( m.sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

來源：http://www.csdn.net/article/2013-02-21/2814219-flat-design-vs-Skeuomorphism

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點(diǎn)這里

如果關(guān)注一下設(shè)計(jì)界正在發(fā)生什么，你會察覺到，目前圍繞擬物化設(shè)計(jì)（skeuomorphism） 和扁平化設(shè)計(jì)的討論正愈演愈烈。毫無疑問，扁平化設(shè)計(jì)會是 2013年移動應(yīng)用設(shè)計(jì)的13大精髓之一，無論是單就界面設(shè)計(jì)而言還是整體的App設(shè)計(jì)，扁平化設(shè)計(jì)都在2012年逐漸盛行起來，也成為了2013年最為顯著的趨勢。在越來越多的人開始采用扁平化設(shè)計(jì)的同時，仍有不少人支持?jǐn)M物化設(shè)計(jì)，那么兩種設(shè)計(jì)風(fēng)格存在哪些優(yōu)勢與不足呢？

首先這里有一個簡單的測試，你能分辨出下圖中，哪一副圖中的應(yīng)用采用了擬物化設(shè)計(jì)么？

如果你一口咬定右圖是采用了擬物化設(shè)計(jì)的應(yīng)用的話，那么很遺憾，你答錯了。想要正確的區(qū)分它們的確是一個棘手的問題，事實(shí)上，這兩款應(yīng)用都用了擬物化設(shè)計(jì)。

擬物化設(shè)計(jì)

這個晦澀的名字指的是一種特殊的設(shè)計(jì)風(fēng)格，它會將過去的一些特性加入的設(shè)計(jì)中，即使這些特性并不具有任何功能性的需求。例如，添加了事先錄制好的快門聲的拍照應(yīng)用，或者帶有鐵環(huán)和紙張等設(shè)計(jì)元素的日歷應(yīng)用。

另一方面，與擬物化設(shè)計(jì)相對的是最近開始流行的“扁平化設(shè)計(jì)”，其中微軟的Metro UI就是一個最典型的例子。扁平化設(shè)計(jì)體現(xiàn)了視覺極簡主義，避開紋理與光影效果，而是采用簡單的圖形與色彩。

擬物化設(shè)計(jì)風(fēng)格的趨勢，以及最近對這種設(shè)計(jì)風(fēng)格表示強(qiáng)烈反對的呼聲，都可以追溯到同一款產(chǎn)品上：iPhone。

在iPhone出現(xiàn)之前，擬物化的用戶界面設(shè)計(jì)是不常見的，大多只會出現(xiàn)在視頻游戲中。為了保持游戲的帶入感，游戲設(shè)計(jì)師早就開始使用木質(zhì)、金屬和石頭等材質(zhì)構(gòu)建新的用戶界面了。隨著iOS的問世，蘋果決定采用更多擬物化的設(shè)計(jì)。但是我相信，他們有理由這樣做。

首先，擬物化設(shè)計(jì)的視覺美感是無法忽視：當(dāng)然，那些皮革質(zhì)感的紋理與翻頁動畫效果現(xiàn)在看起來很俗氣，近幾年我們也被他們禁錮住了設(shè)計(jì)思路，但是iPhone首次展示出了人們在其他操作系統(tǒng)中所未見過的豐富的視覺效果。而且不要忘了，對于iPhone的用戶來說，它是一款全新意義的設(shè)備。擬物化設(shè)計(jì)是一種連結(jié)過去與未來的途徑，使人們可以輕松地適應(yīng)新設(shè)備。由于日歷應(yīng)用看上去與真實(shí)日歷相似，即使最后發(fā)現(xiàn)滑動手勢無法翻頁，取而代之的是按鈕，用戶也能第一眼看到它就知道它有什么功能。正如 iOS Human Interface Guidelines里提到，“當(dāng)你應(yīng)用中的可視化對象和操作按照現(xiàn)實(shí)世界中的對象與操作仿造，用戶就能快速領(lǐng)會如何使用它?！?nbsp;

擬物化設(shè)計(jì)的癥結(jié)

雖然蘋果一再聲稱擬物化設(shè)計(jì)有助于改善應(yīng)用的用戶體驗(yàn)，但實(shí)際上，這樣的界面設(shè)計(jì)方式有時會降低用戶體驗(yàn)。首先應(yīng)用程序與現(xiàn)實(shí)中的實(shí)體物品有著顯著的不同。比如上面舉出的例子，兩個計(jì)算器應(yīng)用都是擬物化風(fēng)格的，為什么這么說呢？因?yàn)樗麄兌紡?fù)制了現(xiàn)實(shí)中計(jì)算器的布局，只不過右邊的應(yīng)用更貼近現(xiàn)實(shí)物品。

一般來說，采用擬物化設(shè)計(jì)的應(yīng)用都會試圖模仿一個現(xiàn)實(shí)物品的外觀與功能，然而應(yīng)用的工作方式卻與現(xiàn)實(shí)物品不同，這會直接影響產(chǎn)品的用戶體驗(yàn)，出現(xiàn)所謂的“恐怖谷”現(xiàn)象（ uncanny valley：1970年由日本機(jī)器人專家森昌弘提出，當(dāng)機(jī)器人與人類相像超過95%的時候，哪怕她與人類有一點(diǎn)點(diǎn)的差別，都會顯得非常顯眼刺目，讓整個機(jī)器人顯得非常僵硬恐怖，讓人有面對行尸走肉的感覺）。

一個很典型的例子就是蘋果為iPad設(shè)計(jì)的通訊錄應(yīng)用。它就像iBooks一樣，從視覺上暗示用戶這是一“本”通訊錄。然而當(dāng)你去觸摸界面邊緣試圖翻頁時，卻得不到任何反饋，因?yàn)樵谶@個酷似真實(shí)通訊錄的應(yīng)用中，瀏覽信息的操作依然需要滑動或點(diǎn)擊，而不支持翻頁，這完全打破了先前視覺效果帶來的暗示。

通訊錄應(yīng)用

當(dāng)你從參照物身上汲取設(shè)計(jì)元素時，同時也不可避免地把參照物本身的局限性帶到產(chǎn)品中，即使這些限制已經(jīng)沒有存在的理由了。當(dāng)應(yīng)用程序模擬現(xiàn)實(shí)物品的外觀時，在一定程度上放棄了應(yīng)用在數(shù)字媒介端獨(dú)特優(yōu)勢，而這樣的模擬行為就束縛了能力的發(fā)揮。舉個例子，日歷應(yīng)用都具有一個特點(diǎn)，每一頁日歷都是按照月份逐一顯示的，這是由于真實(shí)日歷具有這個特性，它限制了日歷應(yīng)用的默認(rèn)顯示方式。盡管在數(shù)字媒介上并沒有對如何顯示進(jìn)行限制，但許多日歷應(yīng)用仍然堅(jiān)持每一頁只顯示一個月的傳統(tǒng)。

對于一個采用擬物化設(shè)計(jì)的產(chǎn)品來說，如果做得足夠好，產(chǎn)品在視覺上將于真實(shí)世界的物品產(chǎn)生強(qiáng)烈的共鳴。但同時，擬物化設(shè)計(jì)的優(yōu)勢也是其劣勢：共鳴越是強(qiáng)烈，越像真實(shí)的物品，它所帶來的局限性也就越發(fā)明顯，這也阻礙了產(chǎn)品的改進(jìn)與革新。

另一方面，除了模仿現(xiàn)實(shí)物品的應(yīng)用以外，還有一些采用擬物化設(shè)計(jì)的應(yīng)用，他們在界面中加入皮革、木紋、磨砂等精巧的元素。這種應(yīng)用看上去美觀，但是往往需要開發(fā)者付出更多的勞動。以幾乎所有閱讀應(yīng)用都支持的翻頁效果為例。從技術(shù)角度講，如果想要做出細(xì)致的翻頁效果，比如讓也叫隨著手指在屏幕中的滑動產(chǎn)生變化，這不僅需要用CALayer組合成各種層效果，還要涉及許多算法。然而對于用戶來說，普通的橫向平移或滾動翻頁的翻頁方式對用戶的使用不會造成任何障礙。

iBook翻頁效果

盡管擬物化設(shè)計(jì)存在著一些問題，我仍然認(rèn)為擬物化沒有錯。錯的是對擬物化的處理不當(dāng)，錯的是品味惡俗的擬物化。著名iOS應(yīng)用設(shè)計(jì)師 Loren Brichter在近期的一次采訪中指出：擬物化設(shè)計(jì)并不是一無是處的。我們需要以人的方式與設(shè)備進(jìn)行交互。那些華而不實(shí)的紋理裝飾只是視覺設(shè)計(jì)問題，我希望這種“為裝飾而裝飾的”濫用問題可以逐漸減少。

盡管在應(yīng)用設(shè)計(jì)中越來越多人開始使用扁平化設(shè)計(jì)，但這并不意味著它就是無懈可擊的。還是那句話，設(shè)計(jì)風(fēng)格終歸只是工具，最終的目標(biāo)才是關(guān)鍵，敬請期待下篇。