當(dāng)你第一次聽見"扁平化設(shè)計"這個詞的時候,你是不是很不以為然?但事實上扁平化設(shè)計已經(jīng)搖身一變,成為當(dāng)下網(wǎng)站設(shè)計時尚圈的"寵兒"了。在過去幾年的時間里,扁平化設(shè)計發(fā)展速度很驚人,越來越多的網(wǎng)站已在UI(用戶界面)設(shè)計方面走上扁平式設(shè)計的路線。下面小飛就重點介紹一下什么是扁平化設(shè)計,扁平化設(shè)計有什么好處,以及我們在網(wǎng)站上應(yīng)該怎樣應(yīng)用這種設(shè)計或者說在應(yīng)用過程中有哪些注意點,一起來看看吧!
什么是扁平化設(shè)計?
扁平化的核心概念就在于去掉冗余、厚重和復(fù)雜的裝飾效果,重點突出"信息"本身。舉個栗子來說,在非扁平化網(wǎng)頁設(shè)計中,按鈕常常是3D效果的,看到他們你都可以想象出自己按下這個按鈕的景象。但扁平化設(shè)計就不是這樣了,它放棄使用一切能夠做出3D效果的元素比如陰影、透視、漸變等,主要依賴于簡單的圖像和布局。在UI界面上使用扁平化設(shè)計,能夠更加簡單直接的展示信息或事物的工作方式,減少認(rèn)知障礙,能夠給用戶帶來更加良好的體驗。
扁平化設(shè)計的好處:
近幾年,扁平化設(shè)計越來越受歡迎,這種現(xiàn)象背后有幾個主要原因。第一,扁平化設(shè)計很實用,與傳統(tǒng)網(wǎng)站相比,應(yīng)用這種設(shè)計的網(wǎng)站通常加載速度更快,這是因為它沒有動畫或是復(fù)雜的圖形。另一個原因是扁平化設(shè)計更簡約、條理清晰,可以輕松適用于不同的屏幕尺寸。隨著移動設(shè)備在作為網(wǎng)頁瀏覽工具方面越來越流行,在網(wǎng)站中使用扁平化設(shè)計,對很多需要同時面對電腦和移動用戶的站長來說是一個很大的優(yōu)勢。第三個原因是與扁平化設(shè)計所呈現(xiàn)的美感有關(guān)。簡單、用戶友好的布局是扁平化設(shè)計的主要特征,與華麗的設(shè)計相比,很多設(shè)計師和用戶都被扁平化極簡主義的風(fēng)格吸引,心中的天平都在往這邊傾斜。一個很好的栗子就是蘋果公司拋棄了IOS陳舊的設(shè)計,選用扁平化,設(shè)計出更加清晰的外觀。
在網(wǎng)站中怎樣使用扁平化設(shè)計?
在網(wǎng)站中使用扁平化設(shè)計,不僅有上面提到的那些好處,還能讓用戶們知道我們是緊跟設(shè)計潮流的。下面是一些關(guān)于在網(wǎng)站中怎樣使用扁平化設(shè)計的建議:
1.選擇簡單的背景
忘掉那些華麗的或復(fù)雜的磚墻式圖片。在扁平化設(shè)計中,應(yīng)該選用樸素、淡雅的顏色或是色調(diào)相近的顏色。
2.拒絕特效
在扁平化設(shè)計中不要有陰影、高光或是動畫特效。就像我們之前了解扁平化設(shè)計的定義一樣,它就是要避免在設(shè)計中使用任何透視、紋理或能做出3D效果的元素。所有元素的邊界都應(yīng)干凈利落,沒有任何羽化、漸變。
3.使用圖標(biāo)
扁平化設(shè)計經(jīng)常使用圖標(biāo),這是因為圖標(biāo)可以用來提供簡單、流線型的用戶體驗。圖標(biāo)不僅方便用戶點擊,另外由于用戶憑經(jīng)驗?zāi)艽蟾胖烂總€圖標(biāo)代表了什么 ,還可以極大的減少用戶學(xué)習(xí)新交互方式的成本。所以在網(wǎng)站設(shè)計中記得使用圖標(biāo),但是也要確保圖標(biāo)是通用的、大家都知道的,不受地域、種族、文化、語言等因素影響的。如果我們使用的圖標(biāo)不能很快容易被訪問者們理解,使用它們還有什么意義呢?
4.玩轉(zhuǎn)各種圖形
各種各樣的圖形在扁平化設(shè)計中很流行。圓形、正方形和線條不僅是設(shè)計布局美化的一個元素,還可以作為網(wǎng)站內(nèi)容的分界線,讓每個部分內(nèi)容的層次更加分明,有助于訪問者明白網(wǎng)站每個頁面的整體框架。
5.慣用明亮配色
配色在網(wǎng)站中的重要性,相信大家都深有體會了,小飛在這就不多說了。扁平化設(shè)計通常采用比其他風(fēng)格更明亮、絢麗的顏色,就像粉紅色、藍(lán)色、綠色和黃色等在這種設(shè)計中都很常見。但是,這種設(shè)計風(fēng)格往往傾向于使用單色調(diào),甚至是純色,還有一點要注意的是這些顏色的使用不要太過,一個頁面最好不要使用超過3種顏色,太多的顏色會讓網(wǎng)站看起來凌亂、沒有美感。
6.主菜單清晰
主菜單、按鈕以及所有的鏈接都應(yīng)該看起來很簡潔、清晰,不要有任何陰影或強(qiáng)調(diào)效果。一般而言,在扁平化設(shè)計中,按鈕常放在一個簡單的框(矩形或圓形)里面,或者以更加簡潔的設(shè)計方法:什么圖形都不用,只使用文本本身。
7.重視字體排版
目前文本已經(jīng)成為一種重要的可視化元素,扁平化設(shè)計鼓勵在網(wǎng)站上使用大膽、創(chuàng)新的字體和排版,這能讓網(wǎng)頁充滿趣味,不單調(diào)。不過要記得任何時候都不能為了時尚或噱頭犧牲字體的可讀性,如果用戶無法正常瀏覽網(wǎng)站,還談什么排版和設(shè)計風(fēng)格。
8.使用起飛頁的模板
在 起飛頁自助建站平臺(),這有一些扁平化設(shè)計的模板,您只需點擊一下就可以使用它們,能幫您節(jié)約不少時間和精力。
網(wǎng)頁設(shè)計的潮流和大眾的審美觀念一直在變,扁平化設(shè)計的風(fēng)能夠吹多久誰也不知道。我們能做就是緊跟時代的潮流,做好當(dāng)下的事,所以快來起飛頁自助建站平臺做一個屬于自己的扁平化設(shè)計風(fēng)格的網(wǎng)站吧。