創(chuàng)意底紋背景網(wǎng)頁設(shè)計推薦-激發(fā)設(shè)計師、建站者的靈感

時間：2023-05-19 12:48:01 | 來源：網(wǎng)站運營

時間：2023-05-19 12:48:01 來源：網(wǎng)站運營

創(chuàng)意底紋背景網(wǎng)頁設(shè)計推薦-激發(fā)設(shè)計師、建站者的靈感：最近這段時間，到處都能看到好看的底紋。你會發(fā)現(xiàn)它們被放在好看的包裝上，或者是用在一些有名出版物的封面上，或者是被印在漂亮的紡織物上。



如果你最近在網(wǎng)上閑逛，你可能會發(fā)現(xiàn)底紋還被用在了網(wǎng)頁設(shè)計里。雖然他們被用在網(wǎng)頁上不同的部分，但是設(shè)計師們非常喜歡用它們來做背景。如果你也喜歡底紋，或者想要尋找一些靈感，請參看下文。



在本文中，你可以看到不同方法或不同風(fēng)格的精彩案例，它們也許會讓你才思如泉涌。



01. 使用你的網(wǎng)頁的設(shè)計元素



想知道什么元素適合用來設(shè)計你的網(wǎng)站底紋嗎？可以參考這個網(wǎng)站：Café Frida。



如你所見，這個可愛的底紋是由美麗的白色花朵填充整個網(wǎng)頁布局，非常令人愉悅。



02. 使用對稱的底紋



我們很多人都喜歡對稱的美。就像網(wǎng)站http://www.forbetter.coffee，它利用了這個特點，使用對稱的底紋。從網(wǎng)頁的中間畫一條線，你可以看到兩邊是相同的。



03. 使用線條繪制底紋



有時候，設(shè)計師喜歡用顏色來表達(dá)，他們往往不記得簡單的線條有多漂亮?？纯催@個網(wǎng)站 LETTERS, INC.以及它的復(fù)雜底紋。



如果你點進(jìn)去這個網(wǎng)站，你可以欣賞到有著底紋中圖案特征的不同的精妙動畫。



04. 在復(fù)雜的底紋中使用柔和的顏色



當(dāng)你投身于網(wǎng)頁設(shè)計時，你一定要記住網(wǎng)頁設(shè)計的功能——應(yīng)該是支持網(wǎng)頁，并且?guī)椭W(wǎng)頁突出它的信息。



復(fù)雜的底紋有時候會喧兵奪主，讓用戶獲得信息變得艱難。如果你在做一個復(fù)雜的底紋背景，你可以像Recognising a talented industry.這樣做，使用柔和的顏色。



05. 使用照片作為元素



| | /是一個倫敦的設(shè)計機(jī)構(gòu)，他們善于設(shè)計難以置信的迷人作品。你可以到他們的網(wǎng)站去看看他們的獲獎作品。



觀察他們是怎樣用照片作為元素來設(shè)計底紋的，就像氣泡一樣，當(dāng)你觀看不同部分時它們都會發(fā)生變化。是不是很酷呢?



06. 讓你的底紋動起來



動畫已經(jīng)在UI和網(wǎng)頁設(shè)計中流行起來。如今，豐富的的動畫是高品質(zhì)移動應(yīng)用和網(wǎng)頁的標(biāo)志。



如果你已經(jīng)做了一個簡單的背景底紋，讓它動起來吧。你可能會創(chuàng)造出優(yōu)雅的美麗的作品，就像谷歌風(fēng)投在See how GV invested in 2014做得那樣。



07. 使用透明度和圖層



Join The Dots | Garbett Design使用很多透明的波點組成的藍(lán)色底紋。當(dāng)你往下滑動時，每個波點的內(nèi)容都會改變。這是一個簡單但是有效的增加底紋的趣味性的方法。



08. 使用簡單的色板



底紋沒必要為了有意思而包含豐富的色彩。有時候簡單的色板和有趣的形狀就已經(jīng)可以創(chuàng)造出漂亮的底紋了，就像POKE London那樣。



09. 活潑一點



使用抽象的、隨機(jī)的元素來構(gòu)建底紋，就像Carbure Digital Workshop這樣。他們將有趣的元素用明亮的顏色放在黑色的背景上，并且加上了動畫，使得網(wǎng)頁整體活潑又時尚。



10. 讓你的底紋運動起來



Sourisseaux Partners - Corporate Psychologists的底紋會隨著你的鼠標(biāo)移動而運動。這種運動并非很劇烈，但是足以引起你的注意。這是一個給你的網(wǎng)站增加趣味性的好辦法。



11. 用字母作為設(shè)計元素



Matt Luckhurst在他的網(wǎng)站http://mattluckhurst.com/上用他名字里的字母和一些不同的設(shè)計元素創(chuàng)造了一個漂亮的底紋。通常，當(dāng)我們提及底紋時，我們會忘記在底紋中還可以使用字母作為元素，而且字母是非常有價值的。字母會幫你創(chuàng)造出不同的東西。



如果你曾經(jīng)努力地想要知道哪種元素是你想要的底紋，不要忘了考慮一下字母元素。



12. 把你的底紋變成交互的一部分



Sam Skinner用一些列很酷的圖標(biāo)組成了網(wǎng)頁的底紋，而且你可以點擊這些圖標(biāo)來查看他的作品。如果你簡單地點擊一個圖標(biāo)，你將在圖標(biāo)和sam skinner之間畫出一條線。很難描述他是怎樣的，所以點擊Sam Skinner你就明白了。是不是很酷？



13. 使用動畫循環(huán)

你真的有必要看看這個優(yōu)秀的設(shè)計——Jam3 | Toronto Digital Design & Production Company。它用朝一個方向運動的三角形創(chuàng)造了這個背景底紋。



移動你的鼠標(biāo)會影響三角形的流動，一旦你停住不動，它們會回到原來的軌道。如果你將鼠標(biāo)滑過每個字母，字母也會收到影響，就像吸鐵石那樣。是不是很棒呢？



14. 變換背景底紋



誰說只能用一種底紋的? Jamie Wolfond網(wǎng)站中，每當(dāng)你點擊都會改變底紋。



點擊他的網(wǎng)址看看底紋變換和他其他的優(yōu)秀作品吧。如果你設(shè)計了幾個不同的方案，但不確定用那個，你可以試試全部都用。



15. 保持簡單



看看BORHEH的設(shè)計，通過運用輕微的方向改變，他們創(chuàng)造了讓人震驚的圖案。



如果你認(rèn)為你需要讓你的設(shè)計更加深入，考慮一下改變你的圖案上或者是設(shè)計元素上某部分的方向，也許你會有新的發(fā)現(xiàn)。



16. 創(chuàng)建一個明亮的色板



當(dāng)你為你的背景底紋創(chuàng)建色板時，不妨試試大膽的顏色。Lemonade使用的明亮的黃色，在細(xì)節(jié)處用了不同明度的黃色。這是一個確保背景不會有太多明亮色而導(dǎo)致雜亂無章的好方法。



17. 不要忘記經(jīng)典的底紋



有時候，簡單又經(jīng)典的底紋，像是Custom Print Shop, Printing Service: New York, NY: Print Mor這樣的，或許能走得更遠(yuǎn)。不要猶豫了，試試這些經(jīng)典底紋吧，他們能夠調(diào)劑平淡的布局。但是千萬要注意不要用太多，否則他們會看起來像是紋理。



18.用簡單幾何圖形來設(shè)計


是不是不想用太復(fù)雜的元素來創(chuàng)建你的底紋呢?可以嘗試用基本的幾何圖形來達(dá)到不一樣的效果。看看這個例子Kelli Anderson，它結(jié)合了兩種幾何圖形創(chuàng)造出有趣的背景圖案。



19.使用字體或文字


將文字當(dāng)作設(shè)計元素用在你的背景底紋里吧，如果這些文字和網(wǎng)頁的主題聯(lián)系緊密，一定會讓設(shè)計更強(qiáng)大。HackFwd // 10 Big Lessons from HackFwd就是一個很好的案例。



20.根據(jù)主題來設(shè)計



圍繞著網(wǎng)站的主題來設(shè)計背景底紋，像Wiski這樣。他們設(shè)計了描繪美麗的白色山坡邊緣紋理的背景。你可以從你設(shè)計的網(wǎng)頁中受到啟發(fā)，圍繞它創(chuàng)建背景。



總結(jié)



以上就是我們幫你找的擁有創(chuàng)意底紋背景的網(wǎng)站案例。



為了跳出慣性思維的怪圈，不要忘了多多從線下的資源找靈感。參觀一下畫廊，博物館，甚至是當(dāng)?shù)氐膱D書館。有時候，最好的靈感并未出現(xiàn)在屏幕里。



設(shè)計愉快！