廣告學(xué)畢業(yè)論文_淺析界面設(shè)計從擬物化向扁平化的變革

1、<p><b>　　本科畢業(yè)論文</b></p><p><b>　?。?0 屆）</b></p><p>　　淺析界面設(shè)計從擬物化向扁平化的變革</p><p>　　所在學(xué)院 </p><p>　　專業(yè)班級 廣

2、告學(xué) </p><p>　　學(xué)生姓名 學(xué)號 </p><p>　　指導(dǎo)教師 職稱 </p><p>　　完成日期 年 月 </p><p><b>　　內(nèi)容提要</b&g

3、t;</p><p>　　在手持移動設(shè)備迅速包裹人類生活的時代，越來越多的元素進(jìn)入到小屏幕中，人們對于手機等移動終端設(shè)備的依賴變得越來越強，智能化手機時代已經(jīng)全速到來，科技的發(fā)展使得界面容納的東西變得越來越多，為適應(yīng)這種概念，界面設(shè)計的發(fā)展也在發(fā)展著巨大的改變，曾經(jīng)主流的擬物化設(shè)計風(fēng)格不再適用，扁平化設(shè)計應(yīng)運而生，在近1-2年里，扁平化正在迅速替代擬物化設(shè)計，推動界面的的巨大變革。</p><

4、p>　　本文主要論述界面設(shè)計從擬物化向扁平化的發(fā)展，從四個大部分進(jìn)行剖析，包含變革產(chǎn)生的發(fā)展背景，關(guān)于擬物化與扁平化的介紹分析，過渡階段以及未來發(fā)展趨勢預(yù)測。通過對四個部分及其子類的論述，總結(jié)界面設(shè)計從擬物化向扁平化發(fā)展的原因及歷程，并對每一發(fā)展階段的特點進(jìn)行分析和概括，解讀這一巨大變化帶來的影響。</p><p>　　關(guān)鍵詞 扁平化 擬物化 UI設(shè)計 移動</p><p>&

5、lt;b>　　目 錄</b></p><p>　　前言（引言）………………………………………………………………………1</p><p>　　發(fā)展背景…………………………………………………………………………2</p><p>　?。ㄒ唬M物化設(shè)計的定義及由來………………………………………………………2</p><p>　

6、　1、擬物化設(shè)計的定義……………………………………………………………………2</p><p>　　2、擬物化設(shè)計的由來與現(xiàn)狀……………………………………………………………3</p><p>　?。ǘ┍馄交O(shè)計的定義及由來………………………………………………………4</p><p>　　1、扁平化設(shè)計的定義……………………………………………………………………4<

7、;/p><p>　　2、扁平化設(shè)計的由來與現(xiàn)狀……………………………………………………………4</p><p>　　二、現(xiàn)階段擬物化設(shè)計與扁平化設(shè)計存在的優(yōu)缺點……………5</p><p>　　（一）擬物化設(shè)計的優(yōu)缺點……………………………………………………………5</p><p>　　1.優(yōu)點……………………………………………………………………

8、………………5</p><p>　　1.缺點……………………………………………………………………………………6</p><p>　?。ǘ┍馄交O(shè)計的優(yōu)缺點……………………………………………………………6</p><p>　　1.優(yōu)點……………………………………………………………………………………6</p><p>　　1.缺點…………………

9、…………………………………………………………………7</p><p>　?。ㄈ└鶕?jù)現(xiàn)階段界面設(shè)計的發(fā)展對比分析……………………………………7</p><p>　　三、從擬物化設(shè)計到扁平化設(shè)計的過渡發(fā)展階段………………8</p><p>　?。ㄒ唬?006到2010年——物理世界和虛擬世界交接的時代………………………8</p><p>　　（

10、二）2010到2013年——以擬物化設(shè)計為主的前扁平化時代……………………9</p><p>　?。ㄈ?013年9月至今——扁平化的逆襲…………………………………………10</p><p>　　三、界面設(shè)計的未來趨勢——扁平化設(shè)計…………………………11</p><p>　?。ㄒ唬┍馄交O(shè)計的空間表達(dá)…………………………………………………………11</p&g

11、t;<p>　　1．色彩對比營造空間感………………………………………………………………12</p><p>　　2.圖形的關(guān)系形成立體空間…………………………………………………………12</p><p>　?。ǘ┍馄交O(shè)計的美學(xué)思想………………………………………………………13</p><p>　?。ㄈ﹪鴥?nèi)界面設(shè)計的新未來…………………………………

12、……………………13</p><p>　　結(jié)語…………………………………………………………………………………16</p><p>　　注釋…………………………………………………………………………………17</p><p>　　參考文獻(xiàn)…………………………………………………………………………18</p><p>　　論文摘要（中文）………………

13、………………………………………19 </p><p>　　論文摘要（英文）……………………………………………………20</p><p><b>　　前言（引言）</b></p><p>　　目前國內(nèi)外關(guān)于擬物化與扁平化的爭論很多，界面設(shè)計的發(fā)展正處于更新?lián)Q代的時期，大多爭論都圍繞擬物化與扁平化誰優(yōu)誰劣的問題進(jìn)行探討，關(guān)于擬物化向扁平化發(fā)展

14、的分析總結(jié)較少，且因扁平化的設(shè)計風(fēng)格相對較新，對其介紹及分析的文獻(xiàn)相對匱乏，基本目前國內(nèi)外的研究現(xiàn)狀，本文從界面設(shè)計的變革本身作為出發(fā)點，結(jié)合最新的趨勢對擬物化和扁平化進(jìn)行綜合解析，并對界面設(shè)計的各個發(fā)展階段進(jìn)行解讀，希望能夠為界面設(shè)計的發(fā)展分析提供參考。目前界面設(shè)計對于智能產(chǎn)品的發(fā)展起到至關(guān)重要的作用，而關(guān)于這方面的研究還相對薄弱，大部分內(nèi)容都是泛泛而談，本文希望能夠較為詳細(xì)的解讀界面設(shè)計這場變革的諸多因素。</p>&

15、lt;p><b>　　一、發(fā)展背景</b></p><p>　　界面設(shè)計的發(fā)展經(jīng)過了漫長的過程，從較早的圖形界面逐漸豐富，加入人機交互后，就擺脫了原來屬于平面設(shè)計的影子，成為一個新的設(shè)計領(lǐng)域，界面的呈現(xiàn)方式也從靜態(tài)轉(zhuǎn)向動態(tài)，不再是簡單的圖形單一的色彩，更酷炫的設(shè)計，給人更多意想不到的驚喜。當(dāng)互聯(lián)網(wǎng)開始普及，尤其當(dāng)移動互聯(lián)網(wǎng)火速包裹人們的日常生活時，界面設(shè)計也在發(fā)生著順應(yīng)時代的變化，沒有

16、什么東西是一成不變的，變化本身就是前行，2000年后的十幾年里，我們見證了科技時代對我們生活的改變，尤其近幾年里智能化手機時代的開啟，使得人類的生活完全進(jìn)入一個新的階段，正是這種變化，成就著界面設(shè)計的今天，也促成了界面設(shè)計從擬物化向扁平化的轉(zhuǎn)變。</p><p>　　2013年9月蘋果發(fā)布IOS7系統(tǒng)，一改以往蘋果的擬物化界面設(shè)計風(fēng)格，采用了更為簡潔的扁平化設(shè)計，IOS7的發(fā)布重新定義了扁平化設(shè)計在人們眼中的樣子

17、，也帶來一場關(guān)于擬物化設(shè)計與扁平化設(shè)計的爭論。這不是一次突如其來的轉(zhuǎn)變，扁平化設(shè)計已經(jīng)存在很久，是界面設(shè)計的必然發(fā)展趨勢，近兩年來，大面積的扁平化風(fēng)格設(shè)計鋪天蓋地的涌向人們的視野，人們越來越多的談?wù)撈鸨馄交?，一直被忠誠信奉的擬物化設(shè)計時代似乎開始變成過去式，尤其當(dāng)一直將擬物化設(shè)計做的完美的蘋果也將界面設(shè)計的風(fēng)格轉(zhuǎn)向扁平化的時候，人們更加質(zhì)疑擬物化設(shè)計的價值。經(jīng)常有人談?wù)摂M物化和扁平化誰優(yōu)誰劣，立場各異， 有人說擬物化設(shè)計沒有未來，也有人

18、說扁平化設(shè)計其實很丑，對于這兩種風(fēng)格的認(rèn)識，需要我們用理性的眼光來看待，這不僅僅是視覺設(shè)計的改變，還涉及到用戶體驗，交互設(shè)計，響應(yīng)式設(shè)計等諸多問題，我們不能單純的各自評說這兩種設(shè)計風(fēng)格孰好孰壞，它們并不是沖突的，而是界面設(shè)計發(fā)展中環(huán)環(huán)相扣的環(huán)節(jié)，它們關(guān)乎到界面設(shè)計與交互體驗的未來。擬物化設(shè)計為扁平化設(shè)計的出現(xiàn)提供了先決條件，培養(yǎng)了用戶在智能化時代下使用產(chǎn)品的習(xí)慣，在人們熟知了解駕輕就熟的時候，才能推動界面設(shè)計</p>&l

19、t;p>　?。ㄒ唬M物化設(shè)計的定義及由來</p><p>　　1、擬物化設(shè)計的定義</p><p>　　擬物化設(shè)計（Skeuomorphism）是指模擬現(xiàn)實物品的造型和質(zhì)感，通過疊加高光、紋理、材質(zhì)、陰影等各種效果對實物進(jìn)行再現(xiàn)（也可適當(dāng)程度變形和夸張）[1]， 更簡單的說，其實就是在界面設(shè)計中模仿原型物體的外形、特征或場景，來讓用戶在使用的過程容易辨識和操作，它所呈現(xiàn)的是三維的立體

20、效果。例如我們手機中的照相應(yīng)用，大部分圖標(biāo)會設(shè)計成現(xiàn)實生活中相機鏡頭的樣子，閱讀應(yīng)用的界面會模仿書架的造型，在翻頁的交互中模擬現(xiàn)實生活中人們翻書的動作，這些都是擬物化設(shè)計。</p><p>　　2、擬物化設(shè)計的由來與現(xiàn)狀</p><p>　　人們在日常生活中經(jīng)常使用的物品，會通過熟悉形成習(xí)慣和記憶，將這種已經(jīng)被熟悉的外形和使用習(xí)慣放在虛擬的界面設(shè)計中，能夠使用戶在較短的時間里掌握并使用。擬

21、物化是一種具象的設(shè)計風(fēng)格，它給人熟悉的親切感，創(chuàng)造了舊有經(jīng)歷與新體驗的聯(lián)系，不會讓用戶因為陌生而恐懼，能夠迅速拉近產(chǎn)品與用戶的距離。我們很難找出擬物化設(shè)計的概念到底從何時而來，常常會把它與蘋果聯(lián)系到一起，蘋果的確是擬物化設(shè)計的完美表達(dá)者，幾乎將擬物化設(shè)計自然融合到它的界面設(shè)計與外觀設(shè)計當(dāng)中，其實擬物化設(shè)計不僅僅存在于圖形界面中，生活里很多設(shè)計都采用了擬物化，按動單反快門時的音效，家里壁紙的木質(zhì)紋理等等。擬物化設(shè)計是伴隨界面發(fā)展的重要成員

22、，來源于懷舊和還原，因其仿真的特點更加具有情景的帶入感，較早時期更多的被應(yīng)用在游戲中，游戲設(shè)計師采用木質(zhì)或者金屬的貼圖樣式設(shè)計來增強游戲界面的情景體驗，使得玩家在游戲中有身臨其境的歸屬感，而廣受歡迎，但在早期界面設(shè)計中關(guān)于擬物化設(shè)計的應(yīng)用卻并不常見。發(fā)展至后來，直到iPhone的出現(xiàn)，才將擬物化設(shè)計慢慢應(yīng)用開來。擬物化在界面設(shè)計的應(yīng)用初期，經(jīng)歷了很多錯誤的階段，設(shè)計師總是將擬物化做的過于懷舊，過渡的想要向經(jīng)</p><

23、;p>　?。ǘ┍馄交O(shè)計的定義及由來</p><p>　　1、扁平化設(shè)計的定義</p><p>　　扁平化設(shè)計（flat design）是指在設(shè)計中放棄一切裝飾效果，諸如陰影，高光，透視，紋理，漸變等等能做出3D效果的元素，通過抽象、簡化、符號化的設(shè)計元素來表現(xiàn)[2]。扁平化設(shè)計是偏向平面的二維設(shè)計風(fēng)格，但并不全是平面的，它依然能夠通過顏色的關(guān)系圖形的疊加等營造出空間感。</

24、p><p>　　2、扁平化設(shè)計的由來與現(xiàn)狀</p><p>　　相較于擬物化設(shè)計，扁平化設(shè)計更像是繪畫藝術(shù)中的抽象派，最早可追溯到20世紀(jì)四五十年代的瑞士風(fēng)格（國際主義平面設(shè)計風(fēng)格），注重網(wǎng)格無襯線字體的使用，大背景圖片配上簡潔字體，是一種高度功能化、理性化的平面設(shè)計方式，其在六七十年代發(fā)展成熟，直到80年代逐漸消退。國際主義由現(xiàn)代主義發(fā)展而來，在風(fēng)格上與現(xiàn)代主義十分接近，但由于二者的時代背景

25、發(fā)生了巨大的改變，所追求的中心和目的都不同程度偏離，現(xiàn)代主義主要以功能為設(shè)計的核心訴求點，是為大眾服務(wù)的探索形式，而國際主義極其推崇幾何的形式，不要裝飾，以“少就是多”為設(shè)計的核心，與權(quán)勢效益相互關(guān)聯(lián)，背離了現(xiàn)代主義的民主性色彩，使其在后來的發(fā)展中沒有存活下來，但可以說，國際主義確實在一段時間內(nèi)風(fēng)靡。除了國際主義對扁平化設(shè)計影響較深，扁平化還有著濃重的極簡主義的影子。極簡主義（Minimalism）以簡單到極致為追求，在感官上追求簡約整

26、潔，品味和思想上則顯得更為優(yōu)雅[3]，扁平化設(shè)計吸取了極簡主義的核心思想，回歸到界面的最簡單形態(tài)，去除冗余的效果給人們造成的視覺負(fù)擔(dān)，加深對色彩的感知。扁平化設(shè)計使用更少的按鈕和選項，使界面更加易用，簡潔清晰 。像瑞士風(fēng)格在流行</p><p>　　二、現(xiàn)階段擬物化設(shè)計與扁平化設(shè)計存在的優(yōu)缺點</p><p>　　界面設(shè)計發(fā)展到今天，UI（User Interface）的概念在國內(nèi)還是一個

27、相對陌生的詞匯，之前的很長一段時間，人們都將精力放在軟件產(chǎn)品的技術(shù)上，尋求更多的創(chuàng)新和突破，發(fā)展到現(xiàn)在為止，技術(shù)層面已經(jīng)相當(dāng)成熟，且應(yīng)用產(chǎn)品越來越多，功能越來越復(fù)雜，產(chǎn)品如何在用戶心里贏得地位，已經(jīng)不能僅僅依靠技術(shù)層面，更加流暢的用戶體驗與出色的界面設(shè)計變得更為關(guān)鍵，人機交互的時代，界面是用戶與產(chǎn)品接觸的最直接方式，適合時代發(fā)展的界面設(shè)計風(fēng)格會更容易被用戶接受，哪一種用起來更順手更合理，會成為用戶選擇使用產(chǎn)品的重大判斷。因此，必須了解擬

28、物化設(shè)計與扁平化設(shè)計風(fēng)格在現(xiàn)階段各自有什么樣的優(yōu)缺點，才能讓我們對界面設(shè)計與交互體驗的未來有正確的判斷。</p><p>　?。ㄒ唬M物化設(shè)計的優(yōu)缺點</p><p>　　到目前為止，擬物化設(shè)計的風(fēng)格仍在被大量使用，錘子科技的創(chuàng)始人羅永浩對擬物化設(shè)計的信奉便十分執(zhí)著，他曾經(jīng)說要做超越蘋果的精致設(shè)計，追求更完美的細(xì)節(jié)。其實擬物化設(shè)計在現(xiàn)代界面設(shè)計發(fā)展中仍然會是關(guān)鍵的一個環(huán)節(jié)，它的優(yōu)缺點已經(jīng)十

29、分明顯，也決定著它在未來的發(fā)展步伐。</p><p><b>　　1、優(yōu)點</b></p><p>　?。?）能夠有效降低學(xué)習(xí)成本，易理解，難度低，容易操作。人對信息的處理、學(xué)習(xí)和記憶都是有限的，用戶通常不愿意花費太多的時間在弄懂產(chǎn)品這件事上，擬物化設(shè)計很好的解決了這個問題，有效的降低了用戶使用產(chǎn)品時的操作成本及學(xué)習(xí)負(fù)擔(dān)，更容易被用戶接受和認(rèn)可。</p>

30、<p>　?。?）細(xì)節(jié)完美，更加美觀，具有親切感。擬物化設(shè)計在細(xì)節(jié)上追求精致，盡量還原生活中原型物品的外觀與使用場景，添加的高光陰影漸變等，營造出真實的質(zhì)感，能夠讓用戶在使用時因其外觀而覺得親切，按鈕的質(zhì)感及交互效果，讓用戶能夠快速辨識其可點擊性，完成操作。</p><p><b>　　2、缺點</b></p><p>　?。?）擬物化設(shè)計模擬界面與功能設(shè)

31、計不一致。應(yīng)用程序在界面設(shè)計上模擬實際生活中的外形和場景，但在功能上常常并不能做到與現(xiàn)實生活中的操作完全一致，這樣容易讓用戶產(chǎn)生誤解，從而降低用戶的體驗。</p><p>　?。?）適用性低。設(shè)計的復(fù)雜性在響應(yīng)式設(shè)計上需要花費更多的成本，且適配不同的屏幕，無法保證都有很好的效果。</p><p>　?。?）信息化時代，復(fù)雜的設(shè)計造成對信息接收的干擾?，F(xiàn)代社會，人們的生活變得忙碌而急促，時間

32、變得碎片化，人們希望能夠更加準(zhǔn)確高效的獲取信息，而擬物化設(shè)計復(fù)雜的視覺效果會對信息的獲取形成阻礙。</p><p>　　（4）擬物化設(shè)計會限制功能本身的設(shè)計。擬物化設(shè)計追求的是還原物理世界的原型，這使得它的設(shè)計被限定在物理世界的規(guī)則中，這對于功能的設(shè)計形成限制，阻礙創(chuàng)新。</p><p>　?。ǘ┍馄交O(shè)計的優(yōu)缺點</p><p>　　扁平化設(shè)計在近兩年流行起來，

33、成為適用性非常強的設(shè)計風(fēng)格，2013年在設(shè)計領(lǐng)域中，淘寶一直憑借扁平化引領(lǐng)著業(yè)界的設(shè)計風(fēng)格，我們幾乎能夠看到各類不同性質(zhì)的產(chǎn)品和網(wǎng)站對扁平化設(shè)計的使用，越來越多的人開始選擇追隨扁平化，的確，在界面設(shè)計的發(fā)展中，扁平化體現(xiàn)出更多的優(yōu)勢所在。</p><p><b>　　1、優(yōu)點</b></p><p>　?。?）降低視覺負(fù)擔(dān)和信息干擾。去掉冗余的復(fù)雜裝飾后，能夠讓用戶更

34、加專注內(nèi)容本身。</p><p>　?。?）可移植性。簡約的設(shè)計適合設(shè)計方案的移植，能夠適配不同的屏幕，對響應(yīng)式設(shè)計來說十分有益。</p><p>　?。?）易用，高效，有助于功能的開發(fā)和創(chuàng)新。扁平化設(shè)計因為采用略為抽象的表達(dá)方式，脫離擬物化懷舊還原的特性，讓功能的設(shè)計變得自由，有助于產(chǎn)品的創(chuàng)新。</p><p><b>　　2、缺點</b>&

35、lt;/p><p>　?。?）學(xué)習(xí)成本增加，表達(dá)冰冷。扁平化設(shè)計使得界面風(fēng)格從具象走向抽象，這樣難免會增加用戶的學(xué)習(xí)成本，用戶需要花費更多的時間來對其進(jìn)行理解和摸索，且傳達(dá)給用戶陌生的感覺，在感性層面上會比較冰冷。</p><p>　　（2）平面化的設(shè)計容易造成使用障礙。因扁平化設(shè)計使得所有元素都處于同一個維度上，過于相似，用戶在使用時通常無法辨別其哪些元素具有可點擊可操控的可能，會喪失對部分

36、功能的判斷。</p><p>　?。ㄈ└鶕?jù)現(xiàn)階段界面設(shè)計的發(fā)展進(jìn)行對比分析</p><p>　　“有些東西在某些場合最合適，沒有什么在所有場合都合適?！?lt;/p><p>　　根據(jù)現(xiàn)階段界面設(shè)計的發(fā)展來看，扁平化設(shè)計的確比擬物化設(shè)計更適合一些。擬物化設(shè)計的初衷是為了減少用戶的學(xué)習(xí)成本，但科技前行的腳步已經(jīng)遠(yuǎn)遠(yuǎn)超乎我們的想象，我們所用的手機已經(jīng)不僅僅是打電話收發(fā)短信的

37、工具，它集眾多功能與一體，很多功能我們在物理世界已經(jīng)找不到對應(yīng)的參照物，界面承載的東西越來越多，越來越豐富，擬物化設(shè)計已經(jīng)不能完整的表達(dá)它們具有的含義，會束縛功能的設(shè)計，而扁平化設(shè)計很好的解決了這個問題，因其抽象的風(fēng)格反而使表達(dá)變得自由，可以承載更多的功能于一個產(chǎn)品上。在手持移動設(shè)備占據(jù)人們生活越來越大的比重時，屏幕的限制，過度的裝飾反而會使屏幕看起來擁擠難看，并使信息獲取遇到障礙?，F(xiàn)代生活的節(jié)奏正處于高速前行的階段，高效、短時、準(zhǔn)確成

38、為人們所追求的關(guān)鍵，人們對智能手機以及互聯(lián)網(wǎng)已經(jīng)十分熟悉，再使用擬物化會造成用戶的審美疲勞，形成視覺負(fù)擔(dān)，且阻礙技術(shù)的發(fā)展，而扁平化設(shè)計舍棄人們固有的邏輯思維，其簡約的風(fēng)格可承載的東西也會變多。</p><p>　　因此我們看出，在現(xiàn)階段界面設(shè)計的發(fā)展中，扁平化設(shè)計比擬物化設(shè)計更為合理切更加適用。</p><p>　　三、從擬物化設(shè)計到扁平化設(shè)計的過渡發(fā)展階段</p><

39、;p>　　界面設(shè)計從擬物化向扁平化的發(fā)展過程中，經(jīng)過了漫長的沉淀的過程，像瑞士風(fēng)格流行前曾經(jīng)沉寂過一段時間一樣，扁平化風(fēng)潮來襲之前也經(jīng)過了漫長的等待過程，在此期間，擬物化設(shè)計作為主導(dǎo)的設(shè)計風(fēng)格也在不斷矯枉過正的前行，就像我們到一個陌生的環(huán)境，總是需要時間去接受適應(yīng)和熟悉，界面設(shè)計的發(fā)展也是一樣。</p><p>　?。ㄒ唬?006到2010年——物理世界和虛擬世界交接的時代</p><p

40、>　　擬物化設(shè)計在圖形界面的發(fā)展歷程中扮演著重要的角色，在計算機和手機并不普及的時代里，擬物化設(shè)計的出現(xiàn)對人們而言是再合適不過的，它讓用戶在使用中能夠快速掌握操作方法，將物理世界的使用方式與虛擬世界良好的結(jié)合起來，有較強的帶入感，所以較早出現(xiàn)在游戲界面中的擬物化設(shè)計，讓游戲玩家能夠很快進(jìn)入游戲情景中。在互聯(lián)網(wǎng)發(fā)展的洪流中，人們需要擬物化設(shè)計來銜接現(xiàn)實世界與虛擬世界的關(guān)系。</p><p>　　2006年的時

41、候，微軟第一次提出了全新的界面設(shè)計風(fēng)格——Metro,被應(yīng)用在了Zune音樂播放器中，這是扁平化設(shè)計初次出現(xiàn)在人們的視野中，這與當(dāng)時主流的界面設(shè)計風(fēng)格有極大的不同，大字體結(jié)合背景圖片，在當(dāng)時并沒有引起太多的注意。</p><p>　　2007年，蘋果公司在WWDC大會上發(fā)布IOS系統(tǒng)，界面設(shè)計采用擬物化設(shè)計的風(fēng)格，得到很多人的鐘愛。喬布斯一直是擬物化設(shè)計的虔誠信奉者，專注在擬物化的細(xì)節(jié)設(shè)計上，因此iPhone也是

42、擬物化設(shè)計的完美表達(dá)者，之后幾款I(lǐng)OS系統(tǒng)的版本中，蘋果一直堅持?jǐn)M物化的風(fēng)格，并不斷嘗試創(chuàng)新進(jìn)行豐富和完善，盡管在此期間，仍然有很多設(shè)計顯得失敗，但對于擬物化設(shè)計的發(fā)展有著重要的推動作用。</p><p>　　2009年，Google推出Chrome瀏覽器，圖標(biāo)的設(shè)計結(jié)合了蘋果的擬物化設(shè)計與微軟的Metro風(fēng)格，是類扁平化設(shè)計中的經(jīng)典案例，這一事件的發(fā)生，讓業(yè)界開始思考扁平化設(shè)計 。</p><

43、;p>　　2010年時，微軟將Metro帶入到手機系統(tǒng)中，推出Windows Phone 7,極簡的界面設(shè)計反而被很多人詬病幾乎沒有設(shè)計感，與當(dāng)時主流的擬物化設(shè)計有天壤之別，排斥與批評讓扁平化設(shè)計在市場中迅速沒落，但同時也因為它的爭議性，讓人們迅速知道了這種界面設(shè)計風(fēng)格。</p><p>　　從2006年到2010年，是界面設(shè)計發(fā)展過程中物理世界與虛擬世界交接的時代，大部分人對手機的功能使用還在較為基本的階

44、段，隨著通訊設(shè)備功能的豐富和完善，人們需要不斷的花費更多的時間去適應(yīng)這種改變，熟悉了解并且駕馭，因此擬物化設(shè)計充當(dāng)著引導(dǎo)者的角色，帶給人們酷炫的視覺界面，更具親切感的操作行為，有效降低了用戶在使用中需要花費的不必要時間，而抽象的扁平化設(shè)計，過渡的簡化界面會讓用戶感到迷茫，這也是這四年的時間，扁平化設(shè)計曇花一現(xiàn)的重要原因。</p><p>　　（二）2010到2013年——以擬物化設(shè)計為主的前扁平化時代</p

45、><p>　　2011到2012年，蘋果相繼發(fā)布IOS5、IOS6，依然沿用擬物化的設(shè)計風(fēng)格，到6.0版本發(fā)布后，蘋果公司的設(shè)計團隊幾乎將擬物化的界面設(shè)計風(fēng)格做到了極致，倍受果粉的鐘愛，蘋果的確將細(xì)節(jié)做的足夠完美，以至于讓眾多UI設(shè)計師想不出更好的詮釋方案，也正是在擬物化設(shè)計達(dá)到巔峰的時候，智能化手機時代已經(jīng)全速到來，大屏幕全觸屏，炫酷的交互方式，在這樣的熱潮下，各種應(yīng)用軟件同時應(yīng)運而生，這也使得移動互聯(lián)網(wǎng)開始興起，

46、人們對手持移動設(shè)備的鐘愛遠(yuǎn)遠(yuǎn)超過PC機，伴隨著這種變化，界面設(shè)計的發(fā)展也不會還停留在過去，必然要順應(yīng)時代的發(fā)展做出恰當(dāng)?shù)母淖?，這也是帶動其從擬物化向扁平化設(shè)計風(fēng)格發(fā)展的環(huán)境因素。</p><p>　　在此期間，安卓已經(jīng)開始摒棄擬物化的設(shè)計風(fēng)格，2011年10月發(fā)布的4.0版本，我們能夠看到安卓在界面設(shè)計風(fēng)格上已經(jīng)選擇走向扁平化，谷歌提到“中性、平面、簡潔，使用單一的視覺隱喻，使用戶可以很容易的識別和理解它的目的。

47、”盡管在當(dāng)時，很多人認(rèn)為谷歌這樣的做法，只是為了與蘋果對抗想出的對策，并沒有太多人追隨，但改變已經(jīng)發(fā)生，并預(yù)示著扁平化設(shè)計已經(jīng)開始得到更多決策者的關(guān)注。</p><p>　　盡管在這個階段中擬物化仍然是主流的設(shè)計風(fēng)格，扁平化依舊飽受爭議，但我們也能夠從中看到，有少部分人已經(jīng)開始認(rèn)可扁平化設(shè)計，并對擬物化設(shè)計提出質(zhì)疑，這無疑對扁平化設(shè)計的發(fā)展起到了重要的推動作用。</p><p>　?。ㄈ?/p>

48、2013年至今——扁平化的逆襲</p><p>　　2013年，win8與IOS 7相繼發(fā)布，均將界面設(shè)計的風(fēng)格指向扁平化。向來固執(zhí)堅持的微軟，在界面設(shè)計中依然沿用扁平化風(fēng)格，早已在人們的預(yù)想之中，而一貫信奉擬物化設(shè)計的蘋果，改換方向，投身扁平化的洪流，卻完全讓人意外。IOS 7 采用全新的扁平化設(shè)計風(fēng)格，盡管在發(fā)布后的一段時間里，倍受爭議，卻帶來了一場關(guān)于擬物化設(shè)計與扁平化設(shè)計的思考，人們終于不再一味批評和否定

49、，開始用理性的思維來審視這種轉(zhuǎn)變，越來越多的人覺察到扁平化設(shè)計相較于擬物化設(shè)計存在的巨大優(yōu)勢，界面設(shè)計的發(fā)展也是從此時開始進(jìn)入一個全新的階段——扁平化設(shè)計時代。</p><p>　　扁平化設(shè)計之所以能在沉寂之后完成逆襲，變身公眾的焦點，有很多必然的促成因素，主要可以歸結(jié)于以下幾個方面：</p><p>　?。?） 審美疲勞。隨著智能化時代的發(fā)展，擬物化設(shè)計的功能屬性變得越來越薄弱，裝飾性較

50、強，而用戶時間的碎片化又使其在信息捕捉的過程中形成干擾，造成審美疲勞。扁平化設(shè)計風(fēng)格的簡約清晰特點恰好解決了這一問題。</p><p>　　（2）形式服務(wù)于功能，適應(yīng)時代的發(fā)展 。全觸屏?xí)r代的到來，用戶可以隨心掌控界面，人機交互變得更加繁瑣，因此用戶體驗顯得尤為重要，合理的界面設(shè)計是為交互而服務(wù)，創(chuàng)造更舒適的體驗。扁平化設(shè)計在這個發(fā)展過程中可以承載更多的內(nèi)容和功能需求，更能適應(yīng)時代的發(fā)展。</p>

51、<p>　　（3）蘋果、微軟與谷歌的推動。IT業(yè)的巨頭們對扁平化設(shè)計的相繼使用，加快了扁平化設(shè)計的發(fā)展進(jìn)程，同時帶來了業(yè)界對于扁平化的思考，認(rèn)識到扁平化設(shè)計的優(yōu)勢所在，使其成為主流的設(shè)計趨勢。</p><p>　　自從IOS 7發(fā)布以來，重新定義了扁平化設(shè)計，在過去的一年里，我們可以看到扁平化所占據(jù)的大片江山，很多網(wǎng)站和應(yīng)用為適應(yīng)這種轉(zhuǎn)變，紛紛轉(zhuǎn)向扁平化設(shè)計的陣營，擬物化設(shè)計開始變成邊緣地帶，但不可否認(rèn)

52、的是，盡管扁平化設(shè)計更適合這個時代的需求，仍然需要擬物化設(shè)計來做輔助才能很好的傳達(dá)，也同樣要依靠擬物化設(shè)計積攢沉淀的資源來發(fā)展，沒有擬物化設(shè)計培養(yǎng)了用戶的使用習(xí)慣，扁平化設(shè)計也不會被用戶所接受。</p><p>　　從擬物化設(shè)計向扁平化設(shè)計的轉(zhuǎn)變，經(jīng)過很長時間的積淀過程，受到很多因素的牽制，遭遇很多阻礙，當(dāng)今對于擬物化設(shè)計與扁平化的爭論仍在進(jìn)行，盡管扁平化設(shè)計已經(jīng)流行開來，但仍然處于剛剛起步的階段，需要時間的沉淀

53、和積累。而擬物化的未來的發(fā)展也需要我們理性來思考，盡管擬物化設(shè)計已經(jīng)不太適應(yīng)時代的需要，卻也不會變得一無是處，仍然需要它存在的地方和場合，也許在未來科技的發(fā)展中，越來越多的生活物品成為新的信息載體，墻、玻璃、鏡子被賦予功能，擬物化設(shè)計就不再適用，甚至?xí)@得格格不入，但不可否認(rèn)它在界面發(fā)展中至關(guān)重要的作用。</p><p>　　四、界面設(shè)計的未來趨勢——扁平化設(shè)計</p><p>　　現(xiàn)今，

54、扁平化設(shè)計的風(fēng)潮才剛剛開始，至少在未來的某一段時間內(nèi)，界面設(shè)計的主流都會是扁平化，而擬物化設(shè)計將會逐步退出市場成為界面設(shè)計的輔助元素。我們很難說，扁平化設(shè)計的壽命會有多長，在什么時刻會被新的設(shè)計風(fēng)格所取代，畢竟科技的步伐已經(jīng)超過我們的想象，在未來，當(dāng)越來越多的生活物品被賦予新的科技，成為載體，變?yōu)榭捎|控可感知的產(chǎn)品時，也許就會出現(xiàn)新的設(shè)計風(fēng)格來取代扁平化，但我們從現(xiàn)在仍然可以看出，至少在未來的5到10年里，扁平化會是最適合的界面設(shè)計風(fēng)格

55、。現(xiàn)階段，擬物化向扁平化的變革依然處在過渡階段，關(guān)于二者的爭論還在進(jìn)行，至少在現(xiàn)在，扁平化還不能夠完全替代擬物化，它還在成長的少年時代，還有很大的空間能夠發(fā)揮和拓展，它的巔峰還沒有來，在未來的一段時間，扁平化設(shè)計發(fā)展的核心都在于讓自身更完善。</p><p>　?。ㄒ唬┍馄交O(shè)計的空間表達(dá)</p><p>　　扁平化設(shè)計去掉擬物化設(shè)計的漸變、高光、陰影、紋理等能夠營造出立體空間的元素，使用

56、完全平面簡約的表達(dá)方式，雖然不再像擬物化設(shè)計那樣具有強烈的真實質(zhì)感，但也并非像微軟Metro界面那樣完全色塊化，其實除了微軟所表達(dá)的扁平化，我們大多能夠看到的扁平化設(shè)計風(fēng)格都是像IOS 7和安卓等更為豐富的表達(dá)方式。扁平化設(shè)計依然能夠營造空間感，在構(gòu)圖上，將擬物化設(shè)計依靠漸變、羽化、陰影等方式營造的立體空間進(jìn)行平面設(shè)計處理，比如陰影可以采取顏色的顏色層疊的明暗變化來表現(xiàn)，空間的層次關(guān)系可以通過顏色的對比來表現(xiàn)，高光可以使用單色規(guī)則的形狀

57、來完成，扁平化設(shè)計并沒有丟失空間感，它仍然像擬物化一樣有很多層次關(guān)系，只不過這些關(guān)系通過顏色和形狀就可以表達(dá)，不必使用紋理等裝飾性元素進(jìn)行限定，正因為扁平化設(shè)計這種自由的表達(dá)方式，使得扁平化設(shè)計比擬物化設(shè)計更具有創(chuàng)造的可能，因其不用局限于物理世界的規(guī)則，采用抽象的表達(dá)方式，在風(fēng)格上有無限的拓展空間。</p><p>　　1.色彩對比營造空間感</p><p>　　扁平化設(shè)計在色彩的運用上十

58、分挑剔，大多數(shù)扁平化設(shè)計喜歡采用高純度、高明度或者低明度、高純度的配色方案，給人清新明朗的感覺。實際上，每一種顏色都有自己的情感，對于我們的眼睛而言，看見不同的顏色會有不同的心里感受，因此當(dāng)扁平化將空間的表達(dá)進(jìn)行平面化的時候，勢必會對顏色的運用要求更多。顏色的色相、純度、明度以及色調(diào)基本上就決定了界面的空間感覺，紋理材質(zhì)都可以通過顏色的對比來進(jìn)行合理的表達(dá)。色彩的明暗關(guān)系能夠很好的表達(dá)色彩之間的層次，營造立體的感覺，陰影的部分用較暗的顏

59、色，高光的部分用較亮的顏色，這樣就可以使扁平化的圖形元素在疊加后通過顏色來制造空間感。色彩對視覺感官有著決定性的作用，因此在扁平化中如何運用好色彩的關(guān)系顯得尤為重要。</p><p>　　2.圖形的關(guān)系形成立體空間</p><p>　　扁平化設(shè)計因為去掉裝飾性的輔助元素，除了色彩能夠營造空間感以外，圖形的運用關(guān)系也十分重要，比如一個矩形的按鈕，在下方疊加同樣大小不同顏色的另一個矩形，將下層

60、的矩形向下移動幾像素，那么就會給人可點擊的感覺，在視覺層面上就會有空間的延伸。圖形的層次運用能夠形成透視，制造空間感，使其具有三維的屬性，盡管使用的依然是純色的平面圖形，但是通過圖形的疊加依然能夠形成縱深感，規(guī)則的圖形不斷重復(fù)或者散落分布都可以制造出紋理的感覺，相同的圖形錯落分布給人層次感，因此圖形的關(guān)系運用對扁平化設(shè)計而言同樣起著相當(dāng)重要的作用，其與顏色相互輔助，就營造出扁平化設(shè)計的空間表達(dá)。</p><p>

61、　　扁平化設(shè)計至關(guān)重要的兩個表達(dá)元素——色彩和圖形關(guān)系，使得扁平化設(shè)計有了豐富的層級，即使去除了擬物化設(shè)計的裝飾性元素，采用完全平面的元素，仍然可以表達(dá)空間感。</p><p>　?。ǘ┍馄交O(shè)計的美學(xué)思想</p><p>　　扁平化設(shè)計從瑞士風(fēng)格和極簡主義中發(fā)展而來，因此在設(shè)計的美學(xué)層面一直追求簡約的美，從微軟的UI設(shè)計中我們可以看到濃重的極簡主義影子，單色塊動態(tài)磁鐵的設(shè)計，甚至不需要

62、任何多余的裝飾元素，幾乎回歸到圖形和文字最簡單的狀態(tài)。極簡主義(Minimalism)其實最早起源于家居設(shè)計，是第二次世界大戰(zhàn)之后60年代所興起的藝術(shù)流派，以最原初的物自身或刑事展示于觀者面前為表現(xiàn)方式，意圖消彌作者借著作品對觀者意識的壓迫，其實這和扁平化設(shè)計不謀而合。擬物化設(shè)計來自懷舊的設(shè)計美學(xué)，極力還原物理世界的一切，使其限制了產(chǎn)品自身的功能以及用戶的使用習(xí)慣，將使用者限定在一個框架內(nèi)，且復(fù)雜的裝飾元素造成視覺負(fù)擔(dān)，扁平化的出現(xiàn)就像

63、極簡主義，為了打破這個格局而誕生，解鎖擬物化設(shè)計試圖固定的條框，無論是從產(chǎn)品本身，亦或是從用戶的角度而言，都是一種解放，簡化視覺元素，減少冗余的裝飾在用戶使用產(chǎn)品的過程中形成的視覺疲勞，并對功能設(shè)計進(jìn)行釋放，不必拘泥于物理世界的規(guī)則，介入新的設(shè)計理念，使得交互變得更為順暢。</p><p>　　盡管扁平化設(shè)計最初的目的是為了簡化，但在其不斷的發(fā)展中，我們也可以看到它正在變得更加豐富，并不像一部分人認(rèn)為的那樣缺失設(shè)

64、計感，反而可以像擬物化設(shè)計一樣承載更多的細(xì)節(jié)，體現(xiàn)它的簡約之美，正因為它不必像擬物化設(shè)計一樣遵循物理世界的規(guī)則，才需要它花費更多的時間來思考每一種層級關(guān)系的表達(dá)，如何讓界面在扁平化的表達(dá)下仍舊具有引導(dǎo)的意義及合理性，從美學(xué)的層面，也需要設(shè)計花費更多心思，越是簡約的東西越發(fā)能夠體現(xiàn)設(shè)計感，對設(shè)計的要求也就更多，如何運用簡單的元素最好的表達(dá)，顯得尤為重要。扁平化設(shè)計的簡約之美，是繁復(fù)的擬物化設(shè)計的回歸，越是復(fù)雜越是容易限制，而回歸簡約則是一

65、種釋放。</p><p>　?。ㄈ﹪鴥?nèi)界面設(shè)計的新未來</p><p>　　其實UI（User Interface）的概念在國內(nèi)還是相對比較陌生的詞匯，即便有些專業(yè)的設(shè)計人員也不是十分清楚，在近幾年的發(fā)展中才慢慢被重視起來，其很大原因來源于我們的智能科技水平相對較弱，相較于微軟、谷歌、蘋果等科技巨頭，我們一直都處于模仿它們達(dá)到創(chuàng)新的邊緣，因此使得國內(nèi)界面設(shè)計的發(fā)展都處于輔助技術(shù)的層面上，

66、人們對界面的概念也相對較弱，很多對UI設(shè)計的認(rèn)知停留在美術(shù)設(shè)計的階段，但其實UI的涵蓋范圍比人們想象的大的多，它除了視覺設(shè)計以外，還包括交互體驗等等多個部分，近些年來，手持移動設(shè)備的迅速擴散，移動應(yīng)用軟件功能的相似，使得各大產(chǎn)品不能完全依靠功能的優(yōu)勢來贏得用戶的青睞，而用戶體驗及人機交互方式變得尤為重要，也是能夠使用戶對產(chǎn)品忠誠的關(guān)鍵因素，正是這種變化，讓越來越多的產(chǎn)品開始關(guān)注界面設(shè)計，選擇花費更多的設(shè)計做更好的體驗。在未來的某一段時間

67、里，界面設(shè)計都會是智能移動終端相互競爭的武器，而移動互聯(lián)網(wǎng)時代的到來，必定會讓競爭更加激烈，這也是為什么扁平化設(shè)計如此重要的原因，手持移動設(shè)備的屏幕相對PC會小很多，而其功能卻不會比PC少，反而可能會因為下載應(yīng)用的繁多而讓屏幕看起來更擁擠，因此扁</p><p>　　國內(nèi)界面設(shè)計的發(fā)展還處于相對起步的階段，未來還有很大的空間可供發(fā)揮，近年來，國內(nèi)智能手機的發(fā)展已經(jīng)不僅僅是依靠國外的技術(shù)，在很多點上都有自主的創(chuàng)新，

68、界面設(shè)計作為技術(shù)的輔助與表達(dá)，是產(chǎn)品與用戶接觸的最直接的方式，好的用戶界面設(shè)計決定著產(chǎn)品的壽命，因此，我們可以看到界面設(shè)計在發(fā)展中具有無限的可能性，也必定會越來越光明。</p><p>　　未來一段時間內(nèi)，扁平化都會作為界面設(shè)計的主流趨勢，并廣泛覆蓋到界面設(shè)計中，甚至可能作為一種新的風(fēng)格流派被應(yīng)用在平面設(shè)計、三維設(shè)計或者繪畫中去，它的合理存在性，對界面設(shè)計的發(fā)展大有益處，它同擬物化設(shè)計一樣是界面設(shè)計發(fā)展重要的一環(huán)

69、，并非像人們所爭論的那樣：二者是對立的設(shè)計風(fēng)格，其實它們不過都是界面設(shè)計在發(fā)展順應(yīng)時代潮流而做出的改變，像王朝更換君主一樣，是必然要發(fā)生的事情，而扁平化作為新的界面設(shè)計的領(lǐng)軍者，會在未來的發(fā)展中創(chuàng)造更多的可能。</p><p><b>　　結(jié) 語</b></p><p>　　通過以上文字的論述，本文對界面設(shè)計從擬物化到扁平化的各個階段進(jìn)行了總結(jié)分析，就國內(nèi)外的界面設(shè)

70、計發(fā)展與形勢進(jìn)行了相對全面的概述，對于擬物化設(shè)計與扁平化設(shè)計的優(yōu)劣勢進(jìn)行了詳細(xì)的論證，并對未來的界面設(shè)計的發(fā)展趨勢進(jìn)行相對理性預(yù)估，能夠解決目前國內(nèi)關(guān)于界面設(shè)計擬物化還是扁平化的爭論問題。</p><p><b>　　注 釋</b></p><p>　　[1] UI設(shè)計，扁平化還是擬物化. </p><p>　　http://www.uisd

71、c.com/flat-or-quasi-materialized 2014年4月20日訪問</p><p>　　[2] 扁平化設(shè)計.百度百科. http://baike.baidu.com/view/6931513.htm </p><p>　　2014年5月1日訪問</p><p>　　[3] 極簡主義.百度百科. http://baike.baidu.com/v

72、iew/362841.htm </p><p>　　2014年5月1日訪問</p><p><b>　　參考文獻(xiàn)</b></p><p>　　[1] 周陟.UI進(jìn)化論. 清華大學(xué)出版社，2010，4-68.</p><p>　　[2] 張劍. 扁平化 UI 中的空間表達(dá).藝術(shù)科技 2014，（1）</p>

73、<p>　　[3] 楊帆. 基于扁平化的界面設(shè)計美學(xué)思想的探討.藝術(shù)科技 2014，（1）</p><p>　　[4] 馬娜娜. 簡潔而不乏味———淺談扁平化界面設(shè)計. 大眾文藝,</p><p>　　2013( 16) : 137-138.</p><p>　　[5] 冰塵. 扁平化設(shè)計的前世今生 http://tech.qq.com/a/2014032

74、4/000211.htm </p><p>　　2014年5月4日訪問</p><p>　　[6]米拉.UI設(shè)計，扁平化與擬物化的進(jìn)化史 </p><p>　　http://www.woshipm.com/pd/48977.html 2014年5月6日訪問</p><p><b>　　論文摘要（中文）</b></p

75、><p>　　時代的發(fā)展，使得界面設(shè)計成為新的關(guān)注領(lǐng)域脫穎而出。為解決目前國內(nèi)關(guān)于界面設(shè)計風(fēng)格的爭論問題，本文以擬物化向扁平化的過渡發(fā)展作為論點，論述界面設(shè)計趨勢的層層發(fā)展過程，采用對比的方法，來詳細(xì)論述擬物化設(shè)計與扁平化設(shè)計的發(fā)展背景、現(xiàn)狀、及未來發(fā)展趨勢，對二者過渡的各個階段進(jìn)行總結(jié)，并對未來的發(fā)展進(jìn)行相對正確的預(yù)估。</p><p>　　扁平化作為界面設(shè)計的新趨勢，正在逐步取代擬物化，關(guān)

76、于二者的爭論持續(xù)存在，本文從相對客觀的角度對二者進(jìn)行詳細(xì)的剖析與對比，得出這場變革是時代發(fā)展的必然趨勢，在界面設(shè)計的發(fā)展中，擬物化設(shè)計具有的獨特屬性已經(jīng)越來越薄弱，而扁平化設(shè)計的出現(xiàn)是適應(yīng)時代而生的，體現(xiàn)出更多的優(yōu)勢，二者并不矛盾，是界面設(shè)計發(fā)展中的重要環(huán)節(jié)，在不同的時代背景下有著各自的重要意義與影響。</p><p><b>　　論文摘要（英文）</b></p><p&

77、gt;　　With the development of the times, People began to focus on the interface design. The purpose of this paper is to solve the disputed issue of the interface’s style. This paper intends to the development from the ske

78、uomorphism to the flat design as the transition point, using contrast to describe details of the background, current status, and future trends.</p><p>　　Flat design as the new tends , is gradually replacing