您當前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設計教程 >> 設計欣賞 >> 瀏覽設計教程

20個網(wǎng)頁設計中的彩色濾鏡效果

在當今這個充斥著先進的特效和精妙風格的世界中,誰曾料到,像純色和漸變這樣簡單的手法,竟能夠催化出創(chuàng)造力,并極大提升網(wǎng)站的美學水準?現(xiàn)代網(wǎng)頁設計師們,證明了優(yōu)雅的插畫、精致的圖形和壯麗的照片,都能在彩色濾鏡效果下很自然地得到強調(diào)。氣氛煥然一新,網(wǎng)站開始變得光彩奪目。的確,它有助于解決某些問題。

首先,彩色濾鏡能給網(wǎng)站耳目一新的外觀,卻不會增加負擔 。其次,它通過搭配傳遞各種情緒的色彩,很好地豐富了設計。第三,作為一層低透明度的遮罩,它不會掩蓋主背景的魅力,對于想要輕微淡化輪播圖或視頻區(qū)域,卻仍希望其吸引力不減的人 ,這點尤其有用。最后,它為前面的內(nèi)容提供了堅實的基礎(chǔ),兼顧了可讀性。

這種方案能非常協(xié)調(diào)地與各種元素協(xié)作:提供強烈反差的白色、極受歡迎的扁平風格元素,還有為項目增添精致微妙感的輪廓式圖形。

這里有些杰出的網(wǎng)頁設計,示范了如何正確地運用這項技巧。

 

Zimya

Zimya

著陸頁帶有一層美妙的半透明漸變,立刻喚起積極溫暖的感覺。從紫紅色到橙黃色,遮罩層華麗的顏色令人著迷。

 

Red Collar

Red Collar

平滑的半透明漸變極大地豐富了背景圖——這家機構(gòu)的視覺象征。它增添了幾分獨特,不僅與整個場景形成互補,也形成了熱情洋溢的氛圍。

 

Ingram Cole and Land

Ingram Cole and Land

這個網(wǎng)站基于一些非常棒的賞心悅目的效果,這不僅指它的動畫,還有成功貫穿整個網(wǎng)站設計的照片處理手法。從紫色到粉色,溫暖而微妙的漸變,使歡迎頁面看起來相當美妙奢華。

 

Adopt Wales

Adopt Wales

設計師在視頻背景上覆蓋了一層迷人的粉色漸變,營造了親切友好的氛圍。顏色與透明度的選擇很好地突出了上面的元素。

 

Snippet App

The Snippet App

對于更喜歡創(chuàng)造冷靜與便捷的整體感觀的人而言,藍與白的結(jié)合是非常有用的。設計師實際上用了三種色調(diào),不過這兩者占據(jù)主要地位。

 

Joyce Van Herck

Joyce Van Herck

Joyce Van Herck是名高端藝術(shù)家,她的在線作品集網(wǎng)站嵌入了優(yōu)美的幾何圖形。甜美的半透明漸變使斜線擁有活力,加強了這種愉悅的氛圍。

 

Electric Mainline

Electric Mainline

和前面提到的Snippet App很像,設計師運用了藍白混合。不論如何,低透明度的遮罩層,使用戶欣賞其背后那張扮演主角的背景圖。

 

Solid Giant

Solid Giant

使用粉色是為了解決幾個問題。首先,它能有效地突出標語、logo、導航和微妙的白色幽靈按鈕;其次,它建立了一種輕松的氛圍;最后,它體現(xiàn)了品牌特征。

 

Invelab

Invelab

同樣,設計師試圖在背景與前景之間營造完美的對比,同時也將注意力引向工作室的圖片。明亮的紫色有效地與白色形成互補。

 

M2B

M2B

歡快的半透明漸變強化了網(wǎng)站的視覺表現(xiàn)。正由于采用了這種方式,全新的色彩使得背后的圖片陡然增色。而白色被用作一種補充色,使內(nèi)容看起來醒目。

 

Lovedays

Lovedays

設計師在歡迎頁面上運用了扁平風格 。極簡設計只包含了幾個輪廓式元素、簡潔的字體、樸素的按鈕,還有城市背景圖。后者與半透明的藍色相配合,增加了可讀性。

 

Numero Neuf

Numero Neuf

首頁的特色是大量基于圖片的導航,每一項都覆蓋了一層黑色半透明濾鏡。這種方式很常用:如果你想為文字營造完美的對比,并淡化菜單項,很自然就應該將注意力引向某個選中的項。

 

Evoluzione Telematica

Evoluzione Telematica

綠色使人聯(lián)想到正能量,此處就是這么用的。明亮的色調(diào)與白色共同建立了一種積極的形象。

 

The Place

The Place

這位設計師借極簡主義的方式重現(xiàn)了優(yōu)雅。所選的顏色反映了網(wǎng)站的個性,統(tǒng)一了視頻樣式。

 

Obbaki Foundation

The Obbaki Foundation

顏色可以提升感觀的協(xié)調(diào)程度。它豐富了網(wǎng)站的主題,同時輕而易舉加入了一些戲劇性效果,對整體氛圍有一定貢獻。

 

Studio Up

Studio Up

這個機構(gòu)通過迷人的效果展現(xiàn)了一個視覺差滾動的介紹頁面,向普通用戶證明了他們熟稔網(wǎng)頁流行趨勢。每一頁都有其獨特的顏色,覆蓋在動態(tài)的背景上,用以突顯其內(nèi)容。

 

Hype Agency

The Hype Agency

設計師在焦點區(qū)域揮灑了一整片的橙色,為網(wǎng)站營造了恰當?shù)姆e極的氛圍。另一種顏色則是白色,非常明亮并融入其中。

 

Louis Currie

Louis Currie

Louis Currie不滿足于單一顏色;他用了一整套不同的蠟筆色調(diào)交替展示。這個網(wǎng)站絕對能體現(xiàn)他敏銳的色彩感與協(xié)調(diào)感。

 

Grey Group

Grey Group

華麗的青綠色覆蓋了首頁,像一層沒有重量的輕紗,強化了這個網(wǎng)站井然有序的外觀。輪廓式圖形和幽靈按鈕很好地突出并積極配合主色調(diào)。

 

Papertelevision

Papertelevision

薄薄一層明亮多彩的顏色賞心悅目,伴隨著每個主要部分。首頁的深紫色幾乎不容易注意到,但它仍然能使頁面活潑有趣。

 

結(jié)論

彩色濾鏡——這種從前在平面設計中的基本技巧,在網(wǎng)頁設計中重獲新生。雖然色彩輕微地稀釋了設計,它也帶來了一絲精致和特別的魅力,同時兼具功能性。

[教程作者:十萬個為什麼]
免責聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請注明出處,素材資料僅供個人學習與參考,請勿用于商業(yè)用途!
本文地址:http://irelandcustomcontracting.com/tutorial/de2138.html
20個激發(fā)您設計靈感的藍色網(wǎng)頁設計
導航的智慧!35個網(wǎng)頁側(cè)邊欄創(chuàng)意設計欣賞
圖趣網(wǎng)微信
建議反饋
×