热门问题
时间线
聊天
视角

扁平化設計

一种简约的用户界面设计理念 来自维基百科,自由的百科全书

扁平化设计
Remove ads

扁平化設計是一種簡約的UI設計語言,現被廣泛應用於圖形用戶界面上(例如網絡應用程序手機應用程序),在圖形材料,例如海報,藝術作品,指導文檔,各類出版物等方面尤為常用。

Thumb
兩款扁平化交互界面示意圖:一台筆記型電腦與搭載iOS 7系統的平板電腦

定義和目的

Thumb
採用扁平化設計的Windows Phone 8主界面

扁平化作為一種交互界面的設計理念,強調對於三維效果圖像元素使用的最小化(其元素也包括陰影漸變紋理[1],亦專注於使用去除了冗餘信息的圖像元素,排版及純色效果。現在的平面設計師可能更傾向於選擇扁平化的設計風格,這是因為此類設計可以使畫面看起來顯得更為流線型,更加平滑,信息處理的效率也會更高。其次,這種設計也使人們一眼看上去就知道了界面所傳達的信息,兼顧了視覺上的親和力和耐看性[2]。與此同時,在不同屏幕尺寸的電子設備上,扁平化的界面能夠更好地實現畫面尺寸的轉化。正是因為扁平化僅僅使用了簡單的設計元素,所以使用這一設計的網頁會加載得更快,畫面大小的調整也更加輕鬆,在高分辨率的屏幕上各種信息和元素仍然十分醒目。作為一種設計理念,人們經常會將之與仿真設計和富含構思風格進行對比。 [3] [1]

歷史

扁平化設計起初是受到了國際印刷風格(又名:瑞士風格、國際主義平面設計風格[4])、文本用戶界面英語Text-based user interface現代主義,以及包豪斯(Bauhaus)新興風格的影響[1][5][6][7]。當中人們普遍認為國際印刷風格對扁平化設計理念的影響是最為深遠的,上世紀50、60年代的設計風格被認為是扁平化設計的開山鼻祖,但到後來的數碼時代卻又銷聲匿跡了。[8]

2002年,美國微軟公司發布的Windows媒體中心(Windows Media Center)和2006年發布的Zune MP3播放器都包含了扁平化設計的元素。Zune的界面設計風格顯得十分簡約,其界面出現了大號的小字體排版,剪影風格的LOGO和純色風格的字體顏色。之後在2010年發布的Windows Phone 7里,微軟延續了Zune MP3這一設計理念,其中出現了大尺寸、清新明亮的風格、無襯線字體、扁平化的圖標,以及網格狀的菜單。Windows Phone 7的界面設計大獲成功、廣受好評,因此微軟公司之後又發布了基於Metro界面的操作系統Windows 8。這款系統也同樣擁有扁平化的界面。而在網頁交互界面的設計中,純色效果,簡約式的字體、長陰影、和「幽靈按鈕」都是至關重要的設計元素,而其主要的設計則包括網格狀菜單,銳邊風格,明亮的色彩和清晰的排版。微軟公司目前已經將旗下的諸多產品轉移到了Metro界面中,包括Xbox 360Microsoft Office微軟公司的各類網站。[1]

2013年美國蘋果公司發布了iOS 7,其界面首次採用扁平化的設計[9],一改之前舊版本的仿真設計風格。

Remove ads

運用範例

時下常見的扁平化設計的案例包括微軟的Metro界面[10],以及蘋果公司iOS 7的交互界面。

谷歌公司產品界面的質感設計(包括App網頁等)[11]雖然運用到了一些仿真設計的元素,如長陰影,但仍然可以視為一種扁平化的設計。[12][13]

爭議

尼爾森諾曼集團的研究發現,扁平化設計可能導致用戶的導航時間增加達22%[14]

參考資料

外部連結

Loading related searches...

Wikiwand - on

Seamless Wikipedia browsing. On steroids.

Remove ads