隨著扁平化設(shè)計的普及,在網(wǎng)頁實(shí)際設(shè)計中越來越多地用到陰影、漸變和紋理等元素。什么樣的紋理可以適配當(dāng)前的網(wǎng)站項目呢?優(yōu)秀的背景紋理能夠增加整個網(wǎng)站在視覺上的深度和豐富度,盡管許多設(shè)計師仍在使用扁平風(fēng)的背景,比如單色的背景,但是合理的加入紋理能夠讓你的設(shè)計更加出彩。
在紋理的使用上,最主要的訣竅是要讓它足夠微妙,不影響前景的內(nèi)容,這樣才有足夠的可讀性。當(dāng)然,多微妙合適,需要探索和嘗試,只要讓整個設(shè)計足夠平衡就行。一起來看看如下7個小技巧。
1、結(jié)合當(dāng)前設(shè)計趨勢的紋理
結(jié)合時下流行的設(shè)計趨勢來設(shè)計紋理,往往能夠讓整個設(shè)計呈現(xiàn)出富有時代感的體驗。
幾何圖形元素是時下流行的設(shè)計元素之一,將幾何圖形融入到背景當(dāng)中,毫無疑問可以非常吸引人。
紋理的層次對于整體的效果是有所支撐的。值得注意的是,背景中的紋理和圖案、背景以及前景元素之間的對比。
2、簡單易懂的紋理
真正優(yōu)秀的背景紋理,在絕大多數(shù)時候甚至是不會被用戶注意到的。它應(yīng)該是一個幾乎不可見的元素,并且有助于提高整體的可讀性和可用性,同時提供足夠的視覺深度。
簡單而低調(diào)的背景紋理是提升整個設(shè)計的可用性的最佳方式。在去年的Github宇宙會議的頁面上,設(shè)計師就采用了簡單的黑色背景加上白色圓點(diǎn)的紋理設(shè)計,營造出夜空的效果。在夜空的映襯之下,多彩的LOGO和漸變的按鈕有著良好的可識別度。
簡單的背景紋理通常有著小而緊密的重復(fù)的圖案,它可以是任何顏色,這個思路讓背景紋理不會作為焦點(diǎn)存在,而是作為襯托其他元素的重要工具。
3、紋理可以更大,更大膽
紋理可以很微妙,很小,但是也同樣可以很大。大膽一點(diǎn),選擇更大的紋理或者說圖案,同樣能夠產(chǎn)生不錯的效果。
這種超大的圖案所構(gòu)成的紋理能夠作為背景來使用,前景應(yīng)該有更重的元素,比如一定數(shù)量的文本,或者是圖片等相對較重的視覺內(nèi)容。這樣的背景紋理/圖案其實(shí)總體處理起來會比較棘手,因為它有一定的機(jī)率會讓用戶注意到并且分散注意力。
為了確保這種超大的紋理圖案不影響正常的效果,最好是注意分析用戶習(xí)慣,并且匹配整體的內(nèi)容,如果頁面的流量或者轉(zhuǎn)化率下降那么一定是用戶沒有獲取到其中的信息。
4、使用圖片來構(gòu)建紋理
背景紋理并不一定非得是那種精心制作的小圖案,有些細(xì)節(jié)豐富的圖片同樣可以作為背景紋理,它能夠增加視覺層次,提升吸引力。
這種設(shè)計的訣竅在于,圖片需要淡入到背景當(dāng)中。
5、使用色彩變化來創(chuàng)造紋理
使用不同明暗飽和度的同系色彩可以構(gòu)建出形狀或者文字,同樣能夠達(dá)到效果。色彩的變化同樣能夠創(chuàng)造出有深度的視覺效果。
6、讓背景動起來
絕大多數(shù)的背景紋理的技巧都是靜態(tài)背景的設(shè)計技巧,但是背景和紋理同樣可以是動態(tài)的。
為了避免喧賓奪主,動態(tài)的背景紋理應(yīng)該是很微妙的,否則會影響前景主要信息的傳達(dá)。配色應(yīng)該是柔和的。
動態(tài)的網(wǎng)站背景紋理可以是動態(tài)的圖片或者被調(diào)整過的視頻。動態(tài)的背景是吸引用戶注意力的好辦法,只不過要適度就好了。
7、使用漸變來制造紋理效果
現(xiàn)如今的漸變幾乎成了時尚的代名詞,漸變色彩可以在背景中替代紋理存在,也能結(jié)合圖片和其他的元素來使用。
幾乎所有的色彩組合都能夠創(chuàng)造出漸變效果,想要借助漸變創(chuàng)造出視覺深度和紋理的體驗并不難。
|