先來看看幾組變化:
過去的很長一段時間內,介面設計的風格都處在循序漸進的改變,”扁平化”的設計卻是在短短十幾個月的時間內迅速流行起來。從本質上看,這不僅僅是一種視覺風格的改變,而是一種設計語言和思維方式的演化。
就像上個世紀在建築領域極簡主義運動對過度裝修的衝擊,扁平化設計可能是一個對已經被使用多年的過度設計、或者過於花哨的網站和介面的一個顛覆。
扁平化設計意味著在介面與表徵圖中材質、陰影、立體感的消失等等。實際上對於介面設計來說,正如人們對於視覺感官的新鮮需求和疲勞度是與生俱來的。
讓介面更加乾淨,易用,輕薄。而不是在使用者沉浸於頁面閱讀時,對使用者產生幹擾。把複雜的頁面梳理的非常易用。
“扁平化” = “雜誌化”?
先來看看兩個頁面:
(圖1) 微軟首頁
(圖2) 《TIME》
時代周刊是美國影響最大的新聞周刊,有世界”史庫”之稱。
(圖1)是微軟的首頁,明顯的扁平化設計。(圖2)是TIME的網站,確然也呈現扁平化的設計風格,但是卻和微軟的首頁風格不一樣。
網頁雜誌化設計,是扁平化更具體的一種體現,並不是去掉漸層,陰影等繁複的修飾,就可以說是雜誌化的網頁設計。
一、 字型&排版 :排布打破常規
雜誌化設計,建立在整齊而美觀的文字排版基礎之上,文字排版為內容建立結構和節奏感。用不同的字型,和字型的大小、顏色,進行設計。
平面雜誌的官網設計風格都會和雜誌的設計風格靠攏,並且比起其他資訊類網站風格更鮮明,有著自己雜誌的元素融入在網頁設計中。
(圖3)《ELLE》
著名法國時裝品牌ELLE,以時尚導向,是女性化的、現代的、積極向上、親切的、潮流而又充滿生活氣息。
二、布局:視覺的引導
扁平化用清晰的圖形元素建立最簡潔的視覺效果,去掉多餘的線和框,僅用內容本身來布局內容,為內容留出呼吸空間。
雜誌化的頁面,不同的地區,善於用線分割頁面,實線,虛線,粗線,細線,不同明度的線,分割巧妙。
(圖4)《VANITYFAIR》(名利場)
美國著名時尚雜誌。報道內容多為明星私生活,同時其新聞、評論、隨筆等內容也具有一定深度。
三、功能按鈕 :沉浸於內容中
按鈕,翻頁,捲軸等功能操作沉浸於整體內容之中,不突兀。
(圖5) 功能按鈕沉浸於整體設計中
四、留白的藝術:負空間的設計魅力
留白——設計中負空間的重要性與魅力。利用介面空間的留白來增強內容。
留白空間是介面的重要組成部分,留白是內容的一部分,以及內容意境的一種伸展,優秀的留白空間設計,使內容變得更加美好,富有憧憬。
(圖6)《紐約客》(The New Yorker)
是一份美國知識、文藝類的綜合雜誌。
無論寫實的擬物設計或寫意的扁平化設計,如何圍繞需求,讓人們沉浸在他們喜歡的內容中。
作為產品人與設計師,要關心的不僅僅是風格與形式,而是更加美好的體驗。”使用者”並非僅僅只是”使用者”,他們是心懷希望,夢想美好體驗的人。你所打 造的產品是為了協助人們去實現他們各自的夢想。你該如何看待使用者,協助他們激發自己內在的天賦與價值,你將贏得他們的心。這不就是我們所追求的麼。