您當前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設計教程 >> 交互設計 >> 瀏覽設計教程

淺談扁平化設計—– keep it simple

 

2013可以說是扁平化設計的一年。 扁平化時代之前,設計師的作品往往非常的寫實,非常的有立體感!但是現(xiàn)在即便是擬物設計的引領者蘋果,也不得不轉變設計思路,在iOS 7上開始著手扁平化設計的探索。
p1
什么是扁平化設計?
對于設計師來說,扁平化設計是一種實打實的設計風格,不要花招,不要粉飾。從整體的角度來講,扁平化設計是一種極簡主義美學,附以明亮柔和的色彩,最后配上粗重醒目,而風格又復古的字體。扁平化設計簡化了諸如按鈕、圖標一類的界面元素。
p2
大圖片取代了動效。在極簡主義風格的設計中,設計師通常給予內容充足的空間以供傳達,這樣就能夠簡單、直接的講述內容。從扁平化設計中又衍生出幾個不同的小流派:”似扁平化設計”和”長投影設計”就是最近被反復強調的兩個概念。
p3
p4
“似扁平化設計”(Almost Flat Design)是以扁平化設計為基礎,但是添加了一些簡單的效果,比如簡單的投影,基本的漸變。

“長投影設計”圖標設計中使用較多,一般是一道45度角的陰影從圖標中延伸而出,最近的圖標設計,大部分都采用”長投影設計”。

高效率應用扁平化UI套件(UI kits)
通過UI套件,我們可以初步了解扁平化設計。 套件非常的節(jié)省時間——可以自由選擇套件中的元素,然后進行自己的實驗。大多數(shù)UI套件的格式是PSD,非常易于編輯。
p5
扁平化UI套件推薦
下面推薦的UI套件種類不一,從簡單免費的到復雜收費的,扁平化的UI套件可真是越來越多了。
p6
簡約、支持視網(wǎng)膜(Retina),照片滾動箭頭、按鈕、簡單的圖標,什么都有。大小適中,顏色復古。
p7
由Designmodo出品,黑暗風格,包含了多種按鈕和面板,有點Win8的風格。而且扁平之中帶點擬物風格。
p8
包含了一些非常實用的基本元素,比如社交網(wǎng)絡登錄按鈕,菜單、媒體播放器,配色非常扁平化。
p9
包含了從下拉菜單到導航條再到社交分享工具在內的大量元素。

扁平化圖標推薦
扁平化設計的圖標無處不在,資源也非常豐富。 跟UI套件一樣,大多數(shù)的圖標采用PSD格式,這樣可以根據(jù)個人情況進行修改。 很多圖標的設計非常的具有專業(yè)性,專門為某類應用而設計。這種圖標,用來做按鈕也很合適。 當選擇圖標下載時,記得尺寸大小選擇要合適。有的是矢量圖形,而有的放大時會損失質量。
p10
用途廣泛,涵蓋了歐美幾乎所有流行的網(wǎng)站,并采用了長投影設計。通過用色和投影上的細微差別,達到了不同圖標之間的高辨識度。每種圖標有4種大小——32,64,128以及256。

p11
非常棒的作品,跟SEO相關 的一些圖標,扁平化+長投影,對于一些機構來說非常合適。

多嘗試,你也能做好扁平化設計
p12

[教程作者:admin]
免責聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉載,請注明出處,素材資料僅供個人學習與參考,請勿用于商業(yè)用途!
本文地址:http://likemindfilms.com/tutorial/id1726.html
談談加載(Loading)的那點事
交互設計在產(chǎn)品中所傳遞的身份認同
圖趣網(wǎng)微信
建議反饋
×