轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(   sillybuy.com  )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(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ù)

來(lái)源：http://www.cssn.cn/ysx/ysx_sjx/201310/t20131026_611976.shtmll

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

1蘋(píng)果擬物化是外觀設(shè)計(jì)與界面設(shè)計(jì)的統(tǒng)一

為何UI集體變風(fēng)格 扁平化是未來(lái)主流嗎?

    在十九世紀(jì)，由于大規(guī)模的機(jī)械化生產(chǎn)，裝飾品被快速及廉價(jià)的生產(chǎn)出來(lái)，導(dǎo)致商品被過(guò)度裝飾。這種裝飾風(fēng)一直都沒(méi)有停下來(lái)，而且過(guò)度裝飾出現(xiàn)在生活中的各個(gè)角落。以我們所熟悉的電腦以及手機(jī)來(lái)講，由于顯示和樣式技術(shù)允許設(shè)計(jì)人員能夠創(chuàng)建豐富的視覺(jué)界面，導(dǎo)致擬物化設(shè)計(jì)（軟件界面模仿現(xiàn)實(shí)世界中的實(shí)物紋理）和復(fù)雜樣式的過(guò)度使用。所以伴隨著Android 4.0系統(tǒng)問(wèn)世以及手機(jī)硬件配置的快速提升，擬物化設(shè)計(jì)被越來(lái)越多的人所喜歡，當(dāng)然大家最喜歡的還是iOS（扁平化之前的版本）的設(shè)計(jì)。

只有外觀設(shè)計(jì)與界面設(shè)計(jì)統(tǒng)一才會(huì)看起來(lái)美（圖片引自蘋(píng)果官網(wǎng)）

    蘋(píng)果作為“擬物化”設(shè)計(jì)的引領(lǐng)者，曾經(jīng)擬物化的iOS被發(fā)揮到了。然而之所以蘋(píng)果的擬物化會(huì)被大眾覺(jué)得美，并不是單單因?yàn)樗鼒D標(biāo)的高光、陰影、立體等效果。個(gè)人認(rèn)為是產(chǎn)品外觀設(shè)計(jì)與系統(tǒng)界面的統(tǒng)一。就以iPhone 4為例，iOS 4系統(tǒng)的逼真立體擬物化設(shè)計(jì)與iPhone 4玻璃金屬的外觀設(shè)計(jì)搭配在一起，可以說(shuō)相得益彰，所以人們拿著iPhone 4怎么看都覺(jué)得非常漂亮。換句話說(shuō)，如果當(dāng)初的iPhone 4不是玻璃金屬的這種設(shè)計(jì)，換成廉價(jià)的塑料材質(zhì)，你還會(huì)覺(jué)得擬物化的iOS 4會(huì)非常漂亮嗎？

    蘋(píng)果的擬物化設(shè)計(jì)經(jīng)歷三代版本后轉(zhuǎn)變?yōu)楸馄交O(shè)計(jì)，這種轉(zhuǎn)變的原因并非是蘋(píng)果設(shè)計(jì)師們的突發(fā)奇想，而是因?yàn)楫a(chǎn)品設(shè)計(jì)思路的轉(zhuǎn)變以及人們思想觀念的轉(zhuǎn)變。蘋(píng)果的轉(zhuǎn)變讓很多不敢變不想變的廠商也開(kāi)始做出改變。這里筆者就以個(gè)人的理解淺析一下。

1.擬物化的設(shè)計(jì)是為了讓用戶了解手機(jī)的功能

    無(wú)論是蘋(píng)果的擬物化還是其他廠商的擬物化，這種設(shè)計(jì)都是為了讓用戶拿到手機(jī)看第一眼就能直觀的了解各個(gè)圖標(biāo)都是干嘛的。看到“人頭”就知道這是聯(lián)系人、看到音符就知道這是用來(lái)聽(tīng)音樂(lè)的、看到照相機(jī)的圖標(biāo)就知道點(diǎn)擊這個(gè)可以用來(lái)拍照......在用戶使用智能手機(jī)早期，這種擬物化設(shè)計(jì)越逼真越形象就越能教育用戶，所以這也就是為什么前兩年我們看到的眾多智能手機(jī)的UI都是高度擬物化的設(shè)計(jì)。

Jony Ive:用戶不再需要擬物化

    作為蘋(píng)果系統(tǒng)設(shè)計(jì)的負(fù)責(zé)人喬納森·艾維（Jony Ive），在iOS 7被曝出將會(huì)摒棄擬物化采用扁平化設(shè)計(jì)時(shí)，他就向《今日美國(guó)報(bào)》解釋了軟件設(shè)計(jì)的思考過(guò)程?！叭ツ?1月當(dāng)我們坐下來(lái)探討iOS7系統(tǒng)時(shí)，我們認(rèn)為用戶已經(jīng)習(xí)慣了觸摸屏，所以他們不再需要具有物理外形的按鈕。因此我們自由設(shè)計(jì)的靈活度很大，不必過(guò)于拘泥現(xiàn)實(shí)世界。我們嘗試創(chuàng)建的系統(tǒng)環(huán)境不再那么具體化。”從他的回答中不難看出，最初的擬物化更多是因?yàn)橛脩舻恼J(rèn)知來(lái)設(shè)計(jì)，并非沒(méi)有想過(guò)扁平化。

2.跟風(fēng)的背后是相信用戶 回歸用戶體驗(yàn)

    扁平化的iOS 7發(fā)布后，很多人都持不同意見(jiàn)，有人覺(jué)得奇丑無(wú)比，也有人覺(jué)得非常贊。但是當(dāng)爭(zhēng)吵糾結(jié)短暫過(guò)后，大量的蘋(píng)果用戶更新到這一系統(tǒng)。有數(shù)據(jù)測(cè)表明，iOS 7是蘋(píng)果歷代系統(tǒng)中用戶更新速度最快的一個(gè)版本?；谶@種變化，國(guó)內(nèi)手機(jī)廠商在隨后的時(shí)間內(nèi)，迅速的做出轉(zhuǎn)變，集體性的摒棄了之前的擬物化，紛紛推出扁平化的UI。個(gè)人認(rèn)為這些做出轉(zhuǎn)變的廠商們，有一些是跟風(fēng)，有一些則確實(shí)是認(rèn)識(shí)到了扁平化對(duì)于用戶體驗(yàn)的優(yōu)勢(shì)。

扁平化去除了擬物化中的一些高光等效果

    近兩年各個(gè)價(jià)位各個(gè)品牌的手機(jī)層出不窮，幾乎人人都在使用智能手機(jī)，人們對(duì)于智能手機(jī)的一些基礎(chǔ)功能了然于心，即便不是擬物化的設(shè)計(jì)，我們也都能知道這個(gè)圖標(biāo)是什么功能。所以這種“跟風(fēng)”的背后間接的體現(xiàn)出廠商對(duì)于用戶的一種信任，大部分用戶已經(jīng)不再需要繼續(xù)“教育”了。用戶需要是節(jié)省資源回到體驗(yàn)上來(lái)。扁平化將這一部分占用的資源得以釋放，讓系統(tǒng)有更多的能量去處理其他的事情，讓其他功能得到更好的保證，這一點(diǎn)也是用戶所期待的。

扁平化的UI會(huì)減少UI對(duì)系統(tǒng)資源的占用(圖片來(lái)自DownloadBlog.com)

    擬物化的UI好看這一點(diǎn)相信大家都不會(huì)否認(rèn)，但是并非只有這一種形式的才是好看，好看的形式有很多。擬物化的好看背后是大量的、大量的圖標(biāo)，因此這種需要耗費(fèi)系統(tǒng)大量運(yùn)行資源的設(shè)計(jì)是對(duì)用戶體驗(yàn)的一種損傷。

    當(dāng)逼真的紋理、高光、陰影這些元素不再存在后，如何能夠即表達(dá)本身圖標(biāo)含義的同時(shí)又能帶給用戶美感，這是每一個(gè)UI設(shè)計(jì)師所要思考的。扁平化設(shè)計(jì)風(fēng)格與擬物化設(shè)計(jì)風(fēng)格這兩種風(fēng)格并非水火不相容，兩者之間存在很多的交集。

    從目前的設(shè)計(jì)理念來(lái)講，扁平化更多的是去掉了該去的一些東西，所以圖標(biāo)看起來(lái)不像擬物化那樣立體那樣有真實(shí)感。但是扁平化中的一些繪畫(huà)元素則并非必須要以抽象來(lái)表達(dá)，完全可以使用擬物化中的那些具有形象意義的繪畫(huà)。這種設(shè)計(jì)在一些系統(tǒng)UI上我們現(xiàn)在也看到不少，整體看上去同樣是非常漂亮的。

 
扁平化與擬物化可以存在交集

    聚焦內(nèi)容，而不是它的樣式和裝飾。你可能會(huì)認(rèn)為這點(diǎn)是老生常談，但有多少次你在網(wǎng)站上看到一個(gè)現(xiàn)成的主題？主題是始終建立在虛構(gòu)內(nèi)容，所以，就其本質(zhì)而言，絕不可能完美的代表內(nèi)容。虛構(gòu)文本的主題推動(dòng)設(shè)計(jì)師專注于造型和裝飾，而不是內(nèi)容上，因?yàn)槟抢锔揪蜎](méi)有內(nèi)容。只有當(dāng)你在處理實(shí)際的內(nèi)容時(shí)，你才開(kāi)始真正將功能和形式有機(jī)結(jié)合。

    個(gè)人認(rèn)為扁平化是一種極簡(jiǎn)主義的表現(xiàn)形式，但并非全部。所以生硬的套用極簡(jiǎn)的設(shè)計(jì)美學(xué)，將界面設(shè)計(jì)的簡(jiǎn)單而數(shù)字化，時(shí)常會(huì)是個(gè)誤區(qū)。完全的消除視覺(jué)效果，如顏色、不同的背景樣式等未必會(huì)讓界面更容易使用。在某些情況下，這相反的破壞了界面的層次結(jié)構(gòu)和重點(diǎn)，而之前這些層次結(jié)構(gòu)和重點(diǎn)都是建立在陰影和背景顏色之上的。

    所以能夠很好的從功能角度出發(fā)設(shè)計(jì)，在扁平的外表下將部分?jǐn)M物元素很好的融合在一起才會(huì)讓體驗(yàn)和設(shè)計(jì)到達(dá)統(tǒng)一。擬物扁平化或許才是未來(lái)UI的一個(gè)形式，個(gè)人認(rèn)為至少是短時(shí)間內(nèi)的一個(gè)形式，若干年后會(huì)怎么樣這一點(diǎn)沒(méi)有人會(huì)知道