扁平化設計面面觀

扁平化設計#


以下內容由網絡搜索整理,正文附部分原文鏈接。

1.什么是扁平化設計

扁平化設計:在進行設計的過程中,去除高光,陰影,羽化,表面質地等所有具有三維突出效果的風格和屬性。主要因為微軟的Metro,ios7的推動讓這一設計大為風行。

rich design豐富設計風格:通過添加各種設計裝飾,比如下落陰影、梯度等,讓整體設計顯得很豐富。

擬物化設計:通過模擬物理實物來讓設計更加逼真。

2.為什么扁平化##

原文鏈接

一切都是為了需求

產品的所有設計不只是風格選擇,都應該符合<strong>戰略需求</strong>,扁平化也是其中之一。它不僅是視覺上的——只是最直接影響的是視覺而已——它包含了<strong>整個產品系列的邏輯和思路</strong>。

比如:

1.強化內容,而不是內容的載體(比如交互)。最終用戶是消費內容的。掌握高質量內容的廠商就會利用這點來拉開差距。這方面差的,就強調別的好了。

1.Apple掌握大量高品質的第三方應用,但是從交互層面出發,他們家的光頭哥的理念一直是:最好的設計是讓人覺察不到的。所以應該在有限的空間里,更好的服務和展現內容。因此才有去掉按鈕邊框,顯示圖片時盡可能不要加邊框等等,ios7的設計指導

2.而Android的設計思路完全不同,它的核心競爭力是信息本身,因此它想去APP化,在各個設備中用信息流來傳達價值(所以他的設計語言更強調卡片化,甚至去視覺交互化,如google now)。

2.多場景適用性,比如車載系統,穿戴設備。這其中又包括了不同設備的性能處理,無數種類型的分辨率,以及不同場景下的視覺差異(比如日照情況)。對于有相關產品的廠商,就會推廣更適合的設計方案,而扁平化是順理成章能解決以上問題的方法。在有大量不同場景需求時,用擬物化是找死。比如錘子手機的生態圈只有手機,在相對獨立的情況下,這個問題不會很突出的顯示出來。到時候如果需要更整個Android生態建立更豐富的關聯的時候——而這一天一定會到來——他也不得不采用扁平化【這是一個預言】。

3.更小的開發成本,第三方開發者生態環境。同一個產品,適配以上不同需求時的開發成本需要控制。生態環境越豐富的廠商,越看重這一點,因為給開發者制造麻煩,就意味著更糟糕的內容。扁平化在適應多種設備的時候,是最少成本和智能的解決方案。

3.扁平化的擴展,不只是一種視覺風格##

在管理學中很早就有扁平化組織的概念,在現在的網頁,應用設計中,扁平化發展至今已經不僅僅指一種視覺風格,更核心的理念是產品功能的扁平化,信息內容的扁平化,即信息層級的扁平化

信息層級的扁平化代表著用戶在第一層級界面只需要看到核心內容區,和最穩固最根本的功能。其他的內容是收起到第二層級第三層級甚至更深的。

那么如何去鑒定最穩固最根本的功能呢?

問自己,哪些東西是這個應用(或網頁、軟件)沒掉了就沒有辦法用的?比如一個正在打電話中的界面,對方名字、對方頭像、撥號盤、靜音、掛斷、通話時長等等哪些是沒了就不行的?如果能分清楚這個層級,才能真的做出扁平化的設計。

4.扁平化的設計原則

原文鏈接

1.拒絕特效

顧名思義,扁平化設計僅僅采用二維元素。所有元素都不加修飾——陰影、斜面、突起、漸變這樣會帶來深度變化的設計都是不應該的。從圖片框到按鈕,再到導航欄都干脆有力,需要極力避免羽化、陰影這樣的特效。現實主義、3D、擬物化更是扁平化設計的大敵。

扁平化設計依賴于清晰的層次結構和元素布局,優秀的扁平化設計應該能幫助用戶理解產品以及交互。


2.僅使用簡單的元素

扁平設計中使用到很多簡單的UI元素,比如按鈕和圖標。設計師更常用矩形、圓形、方形等簡單的形狀。元素獨立。正角、直角、圓弧都非常常見。

UI元素應該在保持高可用性的前提下盡可能的簡單,保證應用或網站直觀、易用,無需引導。為了同時達到簡單但直觀的效果,你可以嘗試為按鈕填充深色,以鼓勵用戶點擊。


3.注重排版
因為扁平化設計要求元素更簡單,排版的重要性就更為突出了。字體的大小應該匹配整體設計,高度美化的字體會與極簡設計原則相沖突。字形上可以應該使用粗體,文案要求精簡、干練,最終保證產品在視覺上和措辭上的一致性。

字體選擇上可以使用簡單的無襯線字體,通過字體大小和比重來區分元素。同時你也可以使用新奇的字體作為點綴,但一定要記得不能過火。

排版的目的在于幫助用戶理解設計。標簽按鈕等其它元素更注重增強易用性和交互性。


4.關注色彩

扁平化設計的項目擁有更多的色調。一般的網站很少會使用3種以上的色調,但是在扁平化設計中,平均會使用6-8種顏色。

扁平化設計的色調偏通常更有活力——色彩更純。其主要、次要顏色通常都是非常大眾化的顏色,然后再配以幾種其它顏色。扁平化設計的另一個趨勢在于復古顏色的使用——淺澄色、紫色、綠色、藍色——都極為流行。


5.“準”扁平化設計

在準扁平化設計中,基調仍然是扁平風格的,但會在設計方案中添加一種,且僅添加一種特效,無論是陰影也好、梯度也好……

這種設計風格比嚴肅的扁平化更加靈活。設計師們喜歡它,因為可以添加深度和紋理;用戶喜歡它,因為它能有助于直觀的交互。但反過來,也有設計師不喜歡它,因為“準”扁平風格是另兩種風格的混合體,缺乏明確的定義,所以更難用好。


5.扁平化的問題#

設計就是把原本無聊的物品變得有趣。

扁平化最大的弊端是會逐漸同質化、單一化、無聊化,極少的元素,讓應用很難個性化。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 2017年初,咨詢公司Nielsen Norman做了一項調研。 他們找來了71名用戶,分別跟蹤他們在瀏覽9組網站...
    北郵老土閱讀 1,768評論 1 11
  • 1 UI設計基礎 1.1 為iOS而設計 1.1.1 iOS包含以下3條設計原則: 遵從,UI應該有助于人們理解內...
    Willry閱讀 3,636評論 1 48
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,548評論 25 708
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,814評論 1 92
  • 欲望是 個坑,它會讓你一直受于躺下的誘惑中,直到你徹底躺下,你可以一直試著躺著,在你有足夠意志力時但生活的真相是你...
    jieking閱讀 404評論 0 0