設計社區不停討論關于扁平風格。
這種風格很帶感。但大多數設計師不能彰顯這種風格,或者直接討厭這種風格。
我很現實,創件有用的設計才是好的設計。由于最近流行的扁平風格,而去設計這個風格,但它不適合所有的項目,所以別硬套這種設計風格我們來看一下,這有五個很獨特的扁平風格的例子。我們分析一下,再”戲說”一下什么叫扁平化設計風格。
扁平化設計以其形命名。平的設計就是其獨特的二維風格,簡單地平。
這一概念點綴― ―陰影、棱臺、壓花 、漸變或其他工具的添加深度工作。每個元素或框中,從圖像幀到按鈕的導航工具,是脆,缺乏羽化的邊緣或陰影 。
不添加額外的元素并看起來更加逼真,不同于skeuomorphic設計項目中使用技巧來使元素更逼近3D 。扁平化的圖層在反映在其他項目中,不設計另類的背景圖片、前景圖像或按鈕、文本和導航 。
那么它是如何工作的捏?平面設計有獨特的外觀和感覺,但沒別的了。它需要設計明確的層次結構和元素放置,使用戶可以更加容易專注項目,理解交互。雖然越來越多的網站使用扁平化設計風格,或許移動設計和應用中的風格更受歡迎。較小的屏幕占用,少的按鈕和選項,讓扁平界面的應用使用起來嘎嘎容易 (so easy?)。
平面設計使用一些簡單的用戶界面元素如按鈕和圖標。設計師只需找些簡單的形狀,如矩形、 圓形或正方形,保持每個形狀孤立。形狀邊緣可以完美地方角化或者包含一點點曲率。
每個 UI 元素應該只是簡單和容易單擊或切換。對用戶很直觀的互動,沒有一些為設計而作的過度設計。
除去簡單的樣式,鼓勵大膽的去可點擊的按鈕上色。但不要混淆簡單元素和簡單設計,扁平設計的概念也可以像其他設計方案一樣復雜。
需要獲得幫助開始你的設計嗎(譯者注:下面是廣告)?Designmodo 提供了各式各樣的 UI 工具包使用平面樣式 ―― 從 Square UI Free和Flat UI Free,包含一些簡單的 PSD/HTML 用戶界面工具包與基本組件,到Square UI 和Flat UI Pro 完整打包 PSD/HTML 用戶界面包的網站和應用的設計項目。
由于元素在平面設計中的簡單特性,排版是極其重要的。
字型的定格應和整體方案的設計相符― ―高度點綴的字體可能看起來奇怪反對一種超簡單的設計。使用加黑字體和簡單地和高效的單詞來使最終產品具有一致性,可以在可視化方式和文本上作些努力 。
考慮一個簡單無襯線(sans serif)類型族有很多變化和權重的主版式的使用平面設計的站點。添加一些別致的觸點,一個新奇的字體來作為設計的元素,但小心別使用過火的專業字樣 。
字體設計中還應該告訴用戶如何使用該設計。標簽按鈕和其他元素增加引入的易用性和交互性 。
顏色是平面設計的很大一部分。不同于其他網站設計,扁平設計中顏色調色板往往是強調很多更亮 、更鮮艷。
扁平設計中的顏色 調色板的項目通常包含更多的 色調。雖然大多數顏色調色板最專注于兩三種顏色,但扁平設計中調色板通常使用六至八個顏色。
扁平設計中色調趨向充滿活力― ―想想顏色轉盤― ―沒有淡色或最純色。初級和次級的顏色是最受歡迎的。另外,一些特定顏色的使用頻率較高,在重復的扁平設計中,方位色,復古的顏色― ―包括鮮肉色、紫色、綠色和藍色― ― 這些是較受歡迎。
扁平化的設計本質上是簡單的,它與整體簡約的設計方法相得益彰。
在網站的整體設計中避免太多花哨的東西。簡單的顏色與文字就已足夠。如果你要添加視覺效果,選擇簡單的圖像。
有些零售網站,比如Svpply(見上),使用效果很棒的扁平化設計,這是將一些條目放在一個簡單的背景上做到的。(提醒一下這些圖片確實具有一些自然深度,但仍然和諧融入到整個扁平化的設計中)
一個更多設計師都傾向于贊同的風格,就是“接近”扁平化的設計。
在“接近”扁平化的設計中,使用了扁平化風格的基本主題,但是一些特效被添加到設計方案中。例如按鈕,可能包含輕微的梯度或者陰影。設計師通常挑選一種特效并專門用在一種“接近”扁平化的項目中。
這個風格,相對于一些扁平化設計背后的、無特效思想中的剛性,容納了更多一些的彈性。
設計師們因為附加的深度和紋理而喜歡它。用戶們喜歡它是因為,這個風格沒有那么生硬,并且有利于引導適當的交互。另一方面,設計師們不喜歡它是因為,它以一種方式結合了兩種風格,而這種方式可能缺少了對于一個真正風格的定義。
新聞熱點
疑難解答