快速赛车开奖怎么玩 www.ynclfi.tw 輪播圖或者說banner圖是用戶在網站首頁最先看到的畫面,所以品牌方和設計師都會比較重視,再加上網頁設計自帶互聯網屬性,又是RGB顏色模式,所以有很多優秀的作品,是學習排版、構圖、形式、配色的好對象,以下便是蔥爺最新收集的一波banner圖設計作品,來看看它們分別有哪些設計技巧值得我們學習。

跟著網頁輪播圖學設計

▲用斜色塊橫跨背景,然后把主體壓在色塊上是一種很經典的設計形式,能夠有效增強視覺沖擊。

 

跟著網頁輪播圖學設計

▲在灰黑的背景上搭配以白色為主、暖色為輔的主體元素。

 

跟著網頁輪播圖學設計

▲把特寫人物或動物五官的圖片作為畫面主體,全貌圖則縮小作為點綴即可,背景盡量簡單、模糊一點,這種形式具有很強的吸引力和感染力,但對圖片質量要求比較高。

 

跟著網頁輪播圖學設計

▲把具有重復元素的圖片平鋪當成背景,如草叢、樹叢、花叢、森林、沙灘等等,通?;嵊脅淮淼男Ч?。

 

跟著網頁輪播圖學設計

▲低飽和度深藍色搭配香檳金,字體選用襯線體,老高級了。

 

跟著網頁輪播圖學設計

▲去底的大圖與不去底的小圖形成內容上的呼應,既能增強對比,又能加強畫面的整體性。

 

跟著網頁輪播圖學設計

▲大面積的紫色與小面積藍色、白色、黃色、玫紅色搭在一起,會顯得比較時尚、年輕。

 

跟著網頁輪播圖學設計

▲把同類型的2-3張圖片分別嵌入到大小相同的圓內,然后把圖片交叉的部分裁成直邊,錯位組合,并把圖片與圖片交接處用直線隔開。此形式給人的感覺既統一又具有變化。

 

跟著網頁輪播圖學設計

▲在黑色背景中搭配高飽和度的漸變色塊,色塊的布局要有大小和疏密對比。

 

跟著網頁輪播圖學設計

▲把背景等分成三份,任意相連兩個色塊使用近似色,另一色塊使用與其對比較強的顏色(可以是色相對比、明度對比或飽和度對比),然后把主體置于形成對比關系的兩個色塊交匯處。另,在標題中建立文字的粗細對比會顯得更精致。

 

跟著網頁輪播圖學設計

▲把背景分為對比鮮明的兩個色塊,還是把主體置于色塊交匯處,然后把圖片屬于相應色塊的部分調成與色塊同色系。

 

跟著網頁輪播圖學設計

▲把標題與內文左對齊,然后用短線把二者隔開,標題與內文距離短線的高度控制在內文文字高度的2-4倍為最佳。

 

跟著網頁輪播圖學設計

▲把去底圖片嵌入圓形色塊中,并把圖片顏色與色塊顏色統一,在排版時,可以把部分標題文字疊加在色塊上。

 

跟著網頁輪播圖學設計

▲把照片疊印在背景色塊中,并使用比較低的透明度,可以使畫面更有細節和空間感。

 

跟著網頁輪播圖學設計

▲把文字或圖形作為產品圖片的背景,可以增加設計感。

 

跟著網頁輪播圖學設計

▲當主體位于橫版畫面的中間時,把主要信息集中排在一側,另一側可以保留大量的留白,只需把標題橫跨左右兩邊,并在留白的一側尾端添加一點小元素就能保持版面的平衡。

 

跟著網頁輪播圖學設計

▲還是橫版,還是主體位于中央,此時兩次的元素可以集中在一個矩形內排版,并嚴格對齊,而主體元素可以適當打破矩形,這樣做可以做到既平衡統一,又有對比和變化。

 

跟著網頁輪播圖學設計

▲用幾何色塊以及圖片排版時,色塊大小不要太平均,而是要有大小對比,(把圖片也看作色塊。)

 

跟著網頁輪播圖學設計

▲用描邊字做底,然后在其基礎上排列文字,把主體元素的另一個形態作為背景。

 

跟著網頁輪播圖學設計

▲用幾何形攝影圖片與去底的輔助元素(樹枝、水草、花草等等)組合在一起,一簡一繁、一剛一柔形成強烈的對比,具有不錯的視覺效果。

 

跟著網頁輪播圖學設計

▲把場景中的元素摳出來一點疊在文字上方,可以加強圖片與文字的關聯,以及畫面的空間感。

 

好看的作品下面還有很多,大家慢慢看,我就不一一分析了:

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

跟著網頁輪播圖學設計

來源于微信公眾號:蔥爺(id:congyenanian)

【設計之家 原創文章 投稿郵箱:[email protected]

相關文章

隨機推薦