複製鏈接
請複製以下鏈接發送給好友

扁平化設計

鎖定
扁平化概念的核心意義是:去除冗餘、厚重和繁雜的裝飾效果。而具體表現在去掉了多餘的透視、紋理、漸變以及能做出3D效果的元素,這樣可以讓“信息”本身重新作為核心被凸顯出來。同時在設計元素上,則強調了抽象、極簡和符號化。 [1] 
例如:Windows、Mac OSiOSAndroid等操作系統的設計已經往“扁平化設計”發展。其設計語言主要有Material Design、Modern UI等。
扁平化的設計,尤其是手機的系統直接體現在:更少的按鈕和選項,這樣使得UI界面變得更加乾淨整齊,使用起來格外簡潔,從而帶給用户更加良好的操作體驗。因為可以更加簡單直接地將信息和事物的工作方式展示出來,所以可以有效減少認知障礙的產生。
扁平化的設計,在移動系統上不僅界面美觀、簡潔,而且還能達到降低功耗、延長待機時間和提高運算速度的效果。例如,Android 5.0就採用了扁平化的效果,因此被稱為“最絢麗的安卓系統”。 [1] 
Flat Design”為“扁平化設計”的英文名,這個概念在2008年由Google提出。但圍繞“Flat Design”這個名字則存在着諸多爭議,你所看到的這個名稱“Flat Design”也並未被大家所完全認可。
不同的公司團體都嘗試用過其他名稱,例如Minimal Design, Honest Design,而微軟公司甚至稱它作 “Authentically Digital”。
中文名
扁平化設計
外文名
Flat Design
核    心
去掉冗餘的裝飾效果
提出者
Google(谷歌)
首個實踐者
Microsoft(微軟)

扁平化設計優缺點

扁平化設計優點

  1. 降低移動設備的硬件需求,延長待機時間;
  2. 可以更加簡單直接的將信息和事物的工作方式展示出來,減少認知障礙的產生;
  3. 隨着網站和應用程序在許多平台涵蓋了越來越多不同的屏幕尺寸,創建多個屏幕尺寸和分辨率的skeuomorphic設計既繁瑣又費時。設計正朝着更加扁平化的設計,你可以一次保證在所有的屏幕尺寸上它會很好看。扁平化設計更簡約,條理清晰,最重要的一點是,更好的適應性。

扁平化設計缺點

扁平化反對者認為:
  1. 降低用户體驗,在非移動設備上令人反感;
  2. 缺乏直觀,需要一定的學習成本;
  3. 傳達的感情不豐富,甚至過於冰冷。

扁平化設計設計案例

生活中處處可見扁平化設計作品,比如蘋果手機,採用稜角分明的線條,加上蘋果的部分應用設計界面,單色鮮明的對比,非常漂亮。
扁平化設計與當下最為覺的擬物化設計形成鮮明對比,Android系統界面曾經均採用擬物化,蘋果iOS系統曾經也採用擬物化,但作為手機領域的風向標的蘋果手機最新推出的iOS使用了扁平化設計,是擬物化基礎上進行的扁平化改造,都有可取之處與詬病,總之都是非常棒的設計美學。而Android的扁平化設計能使得總體視覺與交互變得”温暖“。
在扁平化設計最有力的典範是微軟的Windows以及Windows PhoneWindows RTMetro界面,不得不説Microsoft不愧為扁平化用户體驗開拓者,如此大膽的嘗試與實現,不得不讓人佩服。與扁平化設計相比,在也可以説之前最為流行的是skeuomorphic設計,最為典型的就是蘋果iOS系統中擬物化的設計,讓我們感覺到虛擬物與實物的接近程度,iOS、安卓也已在向扁平化改變。

扁平化設計設計界線

我們發現在Win8 Metro界面中,使用了完全的扁平化設計;在蘋果產品及iOS系統中,看到了部分扁平化設計影子,在Google中,我們也同樣看到了準扁平化設計模式,並且在Google中我們體驗良好,而在Win8 metro中受到的評論並非這麼樂觀,所以不管是屬於什麼設計,設計的美在於是否適合,我不敢説扁平化設計就比誰好,這種非黑即白的理論並不適合。

扁平化設計設計趨勢

越來越多的網站設計已在UI上走扁平式設計的路線。談到設計,無論是一個網站還是一個應用程序,扁平化和極簡的設計正在成為新的趨勢。人們正在原來一直很受歡迎的skeuomorphism設計(模仿實物紋理),蘋果推出iOS時許多設計師都採用它。
但隨着網站和應用程序在許多平台涵蓋了越來越多不同的屏幕尺寸,網站設計正朝着更加扁平化的設計,你可以一次保證在所有的屏幕尺寸上它會很好看。

扁平化設計設計技巧

對於設計師來説,如果你觀察微軟Windows Phone的平台,你可能會發現一個特別的現象:那就是難看的應用不多,但令人印象深刻的應用也不多。應用很有統一感,但是很難張揚個性,以至於有的開發者感嘆,它們看起來都是一個樣子。設計師Johnny Holland將Metro語言比作是包豪斯風格,並且指出,“因為去除了裝飾,使得個性化的空間很小”,這可能給人以“缺乏生命力”的感覺,所以要想設計做出好的扁平化設計,也是非常需要技巧的。
簡單的設計元素
扁平化完全屬於二次元世界,一個簡單的形狀加沒有景深的平面,不叫扁平化都浪費這個詞了。這個概念最核心的地方就是放棄一切裝飾效果,諸如陰影、透視、紋理、漸變等等能做出3D效果的元素一概不用。所有的元素的邊界都乾淨俐落,沒有任何羽化、漸變或者陰影。尤其在手機上,因為屏幕的限制,使得這一風格在用户體驗上更有優勢,更少的按鈕和選項使得界面乾淨整齊,使用起來格外簡單。
強調字體的使用
字體是排版中很重要的一部分,它需要和其他元素相輔相成,想想看,一款花體字在扁平化的界面裏得有多突兀。如一些扁平化網站使用無襯線字體的例子,無襯線字體家族龐大分支眾多,其中有些字體會在特殊得情景下會有意想不到得效果。但注意,過猶不及,不要使用那些極為生僻的字體,因為保不齊它就把你帶進坑裏了。
關注色彩
扁平化設計中,配色貌似是最重要的一環,扁平化設計通常採用比其他風格更明亮更炫麗的顏色。同時,扁平化設計中的配色還意味着更多的色調。比如,其他設計最多隻包含兩三種主要顏色,但是扁平化設計中會平均使用六到八種顏色。另外還有一些顏色也挺受歡迎,如復古色淺橙、紫色、綠色、藍色等。
簡化的交互設計
設計師要儘量簡化自己的設計方案,避免不必要的元素出現在設計中。簡單的顏色和字體就足夠了,如果你還想添加點什麼,儘量選擇簡單的圖案。扁平化設計尤其對一些做零售的網站幫助巨大,它能很有效的把商品組織起來,以簡單但合理方式排列。
偽扁平化設計
不要以為扁平化只是把立體的設計效果壓扁,事實上,扁平化設計更是功能上的簡化與重組。比如,有些天氣方面的應用會使用温度計的形式來展示氣温,或者計算應用仍用計算器的二維形態表現。在應用軟件當中,温度計的形象則純粹是裝飾性的,而計算器的計算方式也並不是最簡單直接的。相比於擬物化而言,扁平風格的一個優勢就在於它可以更加簡單直接的將信息和事物的工作方式展示出來。
參考資料