怎樣設(shè)計(jì)高大上的紋理背景
以下是分享給大家的紋理背景的巧妙運(yùn)用,供參考欣賞。
1.Tobias Ahlin是一個(gè)設(shè)計(jì)師常常會(huì)光顧的網(wǎng)站,因此網(wǎng)站首頁(yè)不意外的用了一些設(shè)計(jì)師的常用工具拼湊而成的紋理背景。網(wǎng)頁(yè)在造型上使用了書(shū)本的式樣,這也為網(wǎng)站的整體感覺(jué)加了不少分。
2.這樣的網(wǎng)頁(yè)背景是不是很特別呢?像填字游戲一樣的網(wǎng)頁(yè)全局設(shè)計(jì)還是第一次見(jiàn)到,不仔細(xì)看,都很難發(fā)現(xiàn)它竟然是網(wǎng)站首頁(yè)。該網(wǎng)頁(yè)的新奇之處主要在于紋理背景大于頁(yè)面中的內(nèi)容,內(nèi)容部分只是在紋理的基礎(chǔ)上著重變色,效果上卻令人眼前一亮,不禁要感嘆設(shè)計(jì)師豐富的想象力。
3.條紋作為網(wǎng)頁(yè)設(shè)計(jì)中的背景其實(shí)并不奇怪,但該案例的點(diǎn)在于,背景不僅使用了暗色系的條紋,同時(shí)加入了漸變的色彩設(shè)計(jì)效果,很好的襯托了網(wǎng)頁(yè)中的主體文字內(nèi)容,讓網(wǎng)站整體多了幾分空間感。
4.練習(xí)本?Excel表格?Nonono!Solo是個(gè)項(xiàng)目管理系統(tǒng)的介紹網(wǎng)站,表格線的紋理背景設(shè)計(jì)很應(yīng)景的表現(xiàn)出了PM系統(tǒng)嚴(yán)謹(jǐn)簡(jiǎn)潔的特征,簡(jiǎn)約有趣且富有設(shè)計(jì)感。如此形象生動(dòng)的網(wǎng)站,你一定會(huì)對(duì)主推產(chǎn)品好感倍增吧。
5.星星點(diǎn)點(diǎn)的無(wú)規(guī)律紋理設(shè)計(jì),讓背景產(chǎn)生一種環(huán)保再生紙的視覺(jué)感受,搭配優(yōu)雅大方的色彩和精致的圖案細(xì)節(jié),讓網(wǎng)站的水準(zhǔn)因此而上升到另一個(gè)層面。
6.只用純色塊和簡(jiǎn)單內(nèi)容拼湊而成的網(wǎng)站不免令人感到單調(diào)無(wú)味,若在純色背景中加入一些紋理設(shè)計(jì),也許效果就截然不同了。如下案例所示,這是一個(gè)很普通的音樂(lè)電臺(tái)網(wǎng)站頁(yè)面,想象一下面對(duì)著如此有質(zhì)感的畫(huà)面,再用美妙的旋律加以渲染,一定是一種很美好的視聽(tīng)體驗(yàn)吧。
7.漩渦狀的設(shè)計(jì)會(huì)令人產(chǎn)生一種立體的視覺(jué)效果,過(guò)于逼真仿佛身臨其境,帶來(lái)一陣恐懼感。但若是以紋理的狀態(tài)出現(xiàn)就能很好的避免這一問(wèn)題。作為背景,紋理的透明度會(huì)在原有基礎(chǔ)上增強(qiáng),所以讓我們?cè)跒g覽時(shí)更加放松舒適。
8.用真實(shí)的大圖來(lái)代替刻意的紋理作為網(wǎng)頁(yè)背景也是個(gè)不錯(cuò)的選擇,正如下面這個(gè)案例,將月球表面設(shè)置為背景,并且覆蓋足夠滄桑的黃色,令網(wǎng)站的神秘氣息直線上升,但這樣的手法并不多見(jiàn),重點(diǎn)在于找到適用的大圖才行。
9.該網(wǎng)站全局使用了一整張舊舊的再生紙效果,讓網(wǎng)站整體更具有連貫性。簡(jiǎn)單的顏色和懷舊的風(fēng)格仿佛帶我們回到了無(wú)憂無(wú)慮的童年時(shí)期。手繪涂鴉的字體設(shè)計(jì)也與整體搭配的恰到好處,令人記憶深刻。
10.這也是一個(gè)很不錯(cuò)的創(chuàng)意,將世界地圖設(shè)置成背景紋理,并且象征性的顯示出客戶分布。這樣的設(shè)計(jì)會(huì)令人在瀏覽時(shí)感受到一種別樣的包容性。但在使用這些不規(guī)則紋理背景的同時(shí),最好采用透明度低的色調(diào)來(lái)作內(nèi)容文字的顏色。
紋理是一種獨(dú)特的美好,有規(guī)律的平鋪紋理讓網(wǎng)頁(yè)瞬間活潑起來(lái),而隨性的紋理能帶給用戶一種灑脫單純的自由之感,優(yōu)雅的紋理背景著實(shí)能令網(wǎng)頁(yè)中的其他部分更有吸引力。
本文轉(zhuǎn)自anyforweb
本文地址:http://m.likemindfilms.com/tutorial/ps2140.html
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏