如何設(shè)計(jì)網(wǎng)頁(yè)和APP中的背景

陳子木

在設(shè)計(jì)的時(shí)候，讓視覺(jué)主體符合趨勢(shì)是絕大多數(shù)設(shè)計(jì)師都在做的事情，而背景也是一樣的。一個(gè)時(shí)尚而貼合趨勢(shì)的背景，能夠更好地讓網(wǎng)頁(yè)和APP具備恰到好處的氛圍，營(yíng)造出對(duì)的感覺(jué)。現(xiàn)代的視覺(jué)框架讓設(shè)計(jì)師可以更好地迎合用戶(hù)的需求，借助合理的工具創(chuàng)造更好的體驗(yàn)。

如果你正在頭疼如何設(shè)計(jì)背景，下面這8種趨勢(shì)和樣式將是一個(gè)不錯(cuò)的參考和指引。

1.幾何圖形元素

幾何圖形元素在這兩年的設(shè)計(jì)當(dāng)中大出風(fēng)頭，那么在設(shè)計(jì)背景的時(shí)候，它們?cè)趺磿?huì)缺席呢？

幾何圖形本身充滿(mǎn)了童真，擁有著讓人想起小時(shí)候的能力。它們和之前一直流行的扁平化設(shè)計(jì)有著千絲萬(wàn)縷的聯(lián)系，而借助分明的幾何特征，賦予設(shè)計(jì)以現(xiàn)代感，結(jié)合簡(jiǎn)約的配色方案，就能夠營(yíng)造出對(duì)比分明的背景，作為一個(gè)頗為優(yōu)秀的背景畫(huà)布。

幾何圖形營(yíng)造的背景可以華麗無(wú)比，也可以通過(guò)微妙的色彩變化，創(chuàng)造低調(diào)但富有生命力的背景效果。

2.線(xiàn)性圖案元素

從微妙的線(xiàn)條到大膽粗獷的筆觸，線(xiàn)性圖案也越來(lái)越受到設(shè)計(jì)師的青睞。

線(xiàn)性圖案成為時(shí)下流行的趨勢(shì)并不令人意外，它們?cè)诒尘爸凶鳛檠b飾性元素，形式感本就極強(qiáng)，對(duì)于用戶(hù)有著極強(qiáng)的視覺(jué)吸引力，通過(guò)合理的對(duì)比和引導(dǎo)，能夠?qū)⒂脩?hù)的視覺(jué)導(dǎo)向關(guān)鍵的部分。

線(xiàn)性圖案可大可小，可以直觀而清晰，也可以微妙而深沉，設(shè)計(jì)師可以根據(jù)實(shí)際需求來(lái)進(jìn)行調(diào)整。

3.水彩元素

其實(shí)，水彩元素在背景設(shè)計(jì)中的流行才是最令人感到驚訝的，因?yàn)楦鶕?jù)反饋，設(shè)計(jì)師對(duì)于這一元素的態(tài)度其實(shí)是兩極分化的，喜歡者對(duì)其極為熱衷，討厭者則避之不及。

許多人將水彩元素或者水彩風(fēng)視之為一種女性化的設(shè)計(jì)趨勢(shì)，就像上面的案例。實(shí)際上水彩元素可以承載著不同的感覺(jué)，傳遞不同的體驗(yàn)。水彩元素的好處在于，它的微妙變化和多樣的色彩，能夠賦予背景以深度，甚至能夠很好的平衡背景元素。

4.漸變

當(dāng)然，漸變的設(shè)計(jì)也是如今許多設(shè)計(jì)師的心頭好。在扁平化流行后才重新回歸的漸變，和以往相比更加靈活多變。單獨(dú)的漸變色彩可以用作背景，將漸變色覆蓋在視頻或者圖片當(dāng)中，也是常見(jiàn)的用法。結(jié)合一些前端工具，甚至可以使用動(dòng)態(tài)的漸變背景。

有了這么多選擇，可以肯定的是，你最需要的其實(shí)也就是一套靠譜的漸變色配色方案了。

5.氣泡和斑點(diǎn)元素

帶有氣泡和斑點(diǎn)元素的背景，乍一看和包含幾何圖形的背景很相似，但是你很快會(huì)發(fā)現(xiàn)兩者差別還挺大的。通常氣泡和斑點(diǎn)元素的分布會(huì)更加隨意，視覺(jué)上沒(méi)那么均勻完美，更富有動(dòng)感，更重要的是它們通常是動(dòng)態(tài)的。

這種趨勢(shì)通常會(huì)以?xún)煞N方式存在于背景當(dāng)中：

將帶有氣泡或者斑點(diǎn)元素的圖片用作實(shí)際背景，這些元素的功能僅僅是創(chuàng)造視覺(jué)吸引力，為整個(gè)背景在視覺(jué)上增色；

氣泡或者斑點(diǎn)浮動(dòng)在背景之上，就像上方的示例，氣泡和斑點(diǎn)作為移動(dòng)的視覺(jué)元素，豐富了整個(gè)設(shè)計(jì)的層次感，而不僅僅是附著在背景圖片之上，而功能是用來(lái)吸引用戶(hù)注意力。

6.抽象圖形元素

最近一些新興的圖形設(shè)計(jì)工具能夠創(chuàng)造出更加漂亮的背景圖片，不過(guò)這些圖片中的圖形更加肆意放飛，它們不屬于以往我們常見(jiàn)的任何類(lèi)型，這些無(wú)以名狀的圖形元素通常可以被歸類(lèi)于抽象圖形。

抽象圖形元素和背景的結(jié)合同樣在視覺(jué)上有著突出的優(yōu)勢(shì)，更容易形成視覺(jué)焦點(diǎn)，由于許多抽象圖形是借助3D建模的方式構(gòu)建出來(lái)的，渲染效果常常更加富有空間感和深度，為其他的元素提供一個(gè)可展示的、有層次的空間。

雖然抽象圖形元素并不是一個(gè)富有規(guī)則的設(shè)計(jì)，但是它們?cè)谑褂蒙贤ǔＪ怯薪M織且有模式的，這樣的設(shè)計(jì)不會(huì)讓用戶(hù)感到混亂。

7.木紋元素

木紋元素在產(chǎn)品圖片和場(chǎng)景設(shè)計(jì)是非常受歡迎的。

木紋本身會(huì)創(chuàng)造出不平整但是足夠自然、富有肌理的環(huán)境氛圍，這也是為什么在展示產(chǎn)品和場(chǎng)景的時(shí)候會(huì)更加有優(yōu)勢(shì)。這一點(diǎn)上木紋優(yōu)勢(shì)很明顯，也很強(qiáng)大，它像視覺(jué)白噪音一樣，讓用戶(hù)在查看的時(shí)候更容易關(guān)注到它所襯托的視覺(jué)主體。

為了充分利用木紋材質(zhì)，可以嘗試在拍照和取材的時(shí)候選取和視覺(jué)主體構(gòu)成對(duì)比和搭配的木紋素材和實(shí)物，避免喧賓奪主，構(gòu)建出協(xié)調(diào)的設(shè)計(jì)。

8.白色和灰色

白色和淺灰色的背景其實(shí)是一直存在的、持續(xù)發(fā)展的一種設(shè)計(jì)趨勢(shì)。這兩種色彩本身是非常優(yōu)秀的背景畫(huà)板，同時(shí)，也是極簡(jiǎn)主義風(fēng)格下最合適的背景色彩，對(duì)于用戶(hù)而言也足夠簡(jiǎn)約、清晰。它可以為屏幕上所有其他的元素提供足夠的空間感和對(duì)比度。

絕大多數(shù)的白色和灰色的背景都會(huì)帶有一些輕微的紋理，比如淺色的漸變，或者微妙細(xì)膩的圖案。即使沒(méi)有，設(shè)計(jì)師也常常會(huì)借助柔和和輕微的陰影讓前景的元素在白色和灰色的背景上更加醒目。

背景設(shè)計(jì)中這樣的元素是必不可少的，另一方面它們也是無(wú)比重要和強(qiáng)大的。你甚至可以通過(guò)翻新背景來(lái)營(yíng)造出全新的設(shè)計(jì)氛圍，你會(huì)發(fā)現(xiàn)，調(diào)整了背景圖片之后，整個(gè)設(shè)計(jì)項(xiàng)目的感覺(jué)就截然不同了。當(dāng)你不知道如何處理背景元素的時(shí)候，在目前正在流行的背景圖片設(shè)計(jì)趨勢(shì)當(dāng)中，仔細(xì)看看，找到一個(gè)適合你的設(shè)計(jì)的背景風(fēng)格并不難。