您當前位置:圖趣網(Tuquu) >> 網頁設計教程 >> 設計理論 >> 瀏覽設計教程

怎么做出高逼格Banner設計

  有人對我說做設計一定不要直接用圖片,一定要摳圖,不要偷懶,不摳圖是做不好設計的,可是到后來我發(fā)現有時候我們不用摳圖,也可以做出好看的設計或好的設計,我就有個疑問:為什么做設計一定要摳圖才行呢?

  所以這次我們可以試著捋一下在不摳圖的情況下可以怎么玩設計,看能不能帶來一些啟發(fā),這次我也依然會以Banner設計來舉例說明。

  攝影與Banner設計之間的聯(lián)系是什么?

  一般來說,如果攝影師和設計師能配合溝通一起去做設計是最好的,尤其當涉及到很多產品或模特拍攝的時候,無論是在電商行業(yè)還是在廣告行業(yè),前期都需要溝通好策劃方向以及構圖色調等,因為攝影部分的工作做得越到位,設計部分的工作量就越小,項目也越順暢,如果攝影部分的工作不到位,到設計那一步就麻煩大了,有可能需要返工重拍或者花費大量時間精力去修改和調整,這樣子就得不償失了。

  首先,商業(yè)攝影涉及到的工作內容和知識點有哪些呢?

  比如,拍攝目的/創(chuàng)意策劃/選道具或選模特/構圖/配色/修片等

怎么做出高逼格Banner設計    圖趣網

  其次,Banner設計涉及到的工作內容和知識點有哪些呢?

  比如,活動目的/文案策劃/風格確定/選圖或選模特/構圖/修圖/配色等

944757d7bcae0000012e7e8b8ed1.jpg

  所以其實原則上來講,攝影和做Banner設計是沒什么區(qū)別的,攝影是把一堆東西放置在取景框里,最終出來一張照片,這個照片可以傳遞某種信息或情感,可以吸引到別人的注意或某種欲望和共鳴。

  而Banner設計則是將所有的文案信息/產品或模特/背景/點綴物等,放置在一張畫布里,最終出來一張圖片,這張圖片也是要傳遞某種信息或情感的,也可以吸引到別人的注意或某種欲望和共鳴。

28d757d7bcc60000018c1b830c4b.jpg

  (是的,我又把這個重復了八百遍的圖放出來了~~)

  所以,我們其實可以將Banner視作是一張照片+幾排文字。接下來我們先看幾個示例:

  還有我之前發(fā)過的一組日本的Banner圖設計:

  看完是不是覺得超簡單?仿佛就是攝影師把圖拍好,都不用設計師摳圖調色修圖什么的,設計師啪啪啪打幾個字,一個Banner就這么出來了呢對不對?!!!~

  好了,我知道很多設計師巴不得每次做個Banner就跟打字那么容易就好了,那么這個其實也不是不可能,我們還是先來看下這類Banner都有些什么共同特點吧,我們先把它們摸個遍,哦不對,把它們先摸透徹~~下次我們也就知道該怎么做了。

  那么怎么分析呢?我們主要從以下幾個方面去分析:

  (1)照片類型

  (2)適合的品類

  (3)適合的活動主題

  (4)排版樣式

  (5)字體選擇

  接下來我們一個個來看:

  (1)照片類型:從上面幾個示例可以看出,其實基本上任何色調任何類型的照片都是可以直接加文字做出一張Banner,不過這種照片(加上文字后其實就是一張Banner)最好還是能簡潔時尚點,講求構圖和留白,允許設計師有加文字的空間,更重要的一點是,照片中能有個主體,無論是產品還是模特。

  我們可以將Banner文字去掉看下,如下圖所示:

d1e557d7bdc30000018c1be37524.jpg

  (2)適合的品類:服飾箱包/美妝護膚/珠寶首飾/奢侈品/母嬰食品保健等等任何能拍成照片的品類都可以,因為這類Banner往往比較時尚簡潔,所以任何允許將Banner做的比較時尚簡潔的品類都可以。

  (3)適合的活動主題:這種照片類Banner適合好幾種活動主題,比如時尚類/森女系/日系/大牌新品上市等等不是特別火熱低價促銷類型的Banner設計。

  不過如果你能將場景搭建得比較有熱鬧氣氛然后直接拍一張照片,最后配合一些俏皮的文字其實也是可以的,比如下面這樣的Banner其實都可以通過手工搭場景或3D建模的方式得到(這個話題方向我們后面再單獨講一下,如果感興趣的話):

675457d7bf530000018c1b3b06a8.jpg

  下面這個是今年京東618的某個活動Banner,雖然是用PS+AI做的,但是用手工搭建場景+攝影的方式或者3D建模的方式其實也是可以做出來的。

348857d7bfe80000012e7e5b8a9c.jpg

  (4)排版樣式:基本就是左右排版/上下排版或劇中排版了(其實說實話不管怎么樣排版都可以,拍的時候給這張照片足夠的留白空間就好了即使不留白也可以通過加蒙層或者虛化的方式添加文字),下面我給大家演示下:

653657d7c0010000012e7e13f5bb.jpg

  (5)字體選擇:字體是分氣質的,字體的選擇跟Banner的氣質其實也是有關聯(lián)的,比如女性化的字體會纖細瘦長一點,男性化的會粗獷尖銳一點,中性化的字體適用范圍會比較廣所以不會有太明顯的傾向性等等,大家可以簡單看下下方的示例:

c82957d7c01a0000012e7e57e596.jpg

  當然還有英文手寫體在我們的Banner設計中也常常會用到,會讓畫面更加時尚隨性,如下圖中的英文字體enjoy:

ca7857d7c02f0000012e7e1c9c77.jpg

  不過需要注意的是,很多好看的字體都是有版權的,如果私自商用都是會侵權的,所以要么用免費字體,要么購買字體版權要么就自己設計或自己寫了,下面有一些免費字體可以給大家看下(由灰晝前輩二次整理的)。

77b957d7c0420000012e7e1a1dc2.jpg

  好了,以上給大家講的是如何啪啪啪打幾個字就能用一張照片出一張Banner,那么其實我們還可以有更多玩法的,比如同樣是不用摳圖,但是我們可以把一張圖剪裁一下,模糊處理一下,或者旋轉一下,疊加處理一下,再或者是多張圖片混在一起玩等等這些情況又可以出來很多種花樣,適合的品類和活動主題就又多了起來,同樣的,先看幾個實例:

  (1)將1張照片通過剪裁,制造時尚感:

  (不知道誰截的圖,直截了一部分,大家先將就著看下好了~)

  看完以上示例我們會發(fā)現這種照片的玩法有什么規(guī)律呢?

  (1)照片要求:照片背景要干凈簡潔,且照片所占面積要夠大,色彩明度等要與背景區(qū)分開,形成對比。

  (2)適合的品類:任何適合往時尚方向作圖的品類,比如服飾箱包/美妝護膚/進口食品/母嬰保健等

  (3)適合的活動主題:時尚促銷/新品上市/時尚大牌/森女系等非低價熱鬧促銷的主題。

  (4)排版樣式:比較注重自由排版,在這里文字已經是畫面里的某一種元素,而不止是傳達信息的作用。

  (5)字體選擇:比較適合放一些干凈利落的規(guī)規(guī)矩矩的字體(無論是有襯線還是無襯線字體)或者手寫體,會顯得比較時尚,且氣質符合活動或品牌產品自身的調性氣質,切忌做一些夸張的字體變形或用一些奇形怪狀的字體。

  你們可以想象一下明星走紅毯或出席活動的各種造型,比如下面這些范冰冰的造型,哪一個更耐看顯的更高檔時尚?

698a57d7c07b0000012e7eb47b7f.jpg

  (女神版范冰冰和ladygaga版范冰冰)

  哈哈哈哈哈哈,回到正題,我們接著繼續(xù)往下看~

  (2)2張照片左右拼接,形成對比:

946757d7c0980000018c1b593c71.jpg

  (3)3張照片錯落有致(不過字體效果有點不搭。。):

1ab357d7c0a80000012e7ee0117b.jpg

  (4)4張照片排排放,同時可以有一些傾斜角度或顏色的變化,避免呆板:

828057d7c0b60000018c1b2761c4.jpg

  (5)多張照片并排排列:

5b3957d7c0c60000012e7e3c61b0.jpg

  (6)同樣是多張照片并排排列,但是是作為紋理疊加到背景里:

abf657d7c1030000012e7ef43e84.jpg

  (7)同樣是一張或多張圖片作為紋理疊加到背景里,但是會在畫面里加入一些圖形形狀:

e48a57d7c0f10000018c1bf97bdd.jpg

  (8)用文字來剪裁照片,作為紋理:

242357d7c1200000018c1bbb5bb5.jpg

  總結:

  以上關于如何在不摳圖不合成的情況下做出一張高逼格Banner的分享內容到這里就結束了,興許對你會有所幫助吧!

  (3)適合的活動主題:這種照片類Banner適合好幾種活動主題,比如時尚類/森女系/日系/大牌新品上市等等不是特別火熱低價促銷類型的Banner設計。

  不過如果你能將場景搭建得比較有熱鬧氣氛然后直接拍一張照片,最后配合一些俏皮的文字其實也是可以的,比如下面這樣的Banner其實都可以通過手工搭場景或3D建模的方式得到(這個話題方向我們后面再單獨講一下,如果感興趣的話):

675457d7bf530000018c1b3b06a8.jpg

  下面這個是今年京東618的某個活動Banner,雖然是用PS+AI做的,但是用手工搭建場景+攝影的方式或者3D建模的方式其實也是可以做出來的。

348857d7bfe80000012e7e5b8a9c.jpg

  (4)排版樣式:基本就是左右排版/上下排版或劇中排版了(其實說實話不管怎么樣排版都可以,拍的時候給這張照片足夠的留白空間就好了即使不留白也可以通過加蒙層或者虛化的方式添加文字),下面我給大家演示下:

653657d7c0010000012e7e13f5bb.jpg

  (5)字體選擇:字體是分氣質的,字體的選擇跟Banner的氣質其實也是有關聯(lián)的,比如女性化的字體會纖細瘦長一點,男性化的會粗獷尖銳一點,中性化的字體適用范圍會比較廣所以不會有太明顯的傾向性等等,大家可以簡單看下下方的示例:

c82957d7c01a0000012e7e57e596.jpg

  當然還有英文手寫體在我們的Banner設計中也常常會用到,會讓畫面更加時尚隨性,如下圖中的英文字體enjoy:

ca7857d7c02f0000012e7e1c9c77.jpg

  不過需要注意的是,很多好看的字體都是有版權的,如果私自商用都是會侵權的,所以要么用免費字體,要么購買字體版權要么就自己設計或自己寫了,下面有一些免費字體可以給大家看下(由灰晝前輩二次整理的)。

77b957d7c0420000012e7e1a1dc2.jpg

  好了,以上給大家講的是如何啪啪啪打幾個字就能用一張照片出一張Banner,那么其實我們還可以有更多玩法的,比如同樣是不用摳圖,但是我們可以把一張圖剪裁一下,模糊處理一下,或者旋轉一下,疊加處理一下,再或者是多張圖片混在一起玩等等這些情況又可以出來很多種花樣,適合的品類和活動主題就又多了起來,同樣的,先看幾個實例:

  (1)將1張照片通過剪裁,制造時尚感:

  (不知道誰截的圖,直截了一部分,大家先將就著看下好了~)

  看完以上示例我們會發(fā)現這種照片的玩法有什么規(guī)律呢?

  (1)照片要求:照片背景要干凈簡潔,且照片所占面積要夠大,色彩明度等要與背景區(qū)分開,形成對比。

  (2)適合的品類:任何適合往時尚方向作圖的品類,比如服飾箱包/美妝護膚/進口食品/母嬰保健等

  (3)適合的活動主題:時尚促銷/新品上市/時尚大牌/森女系等非低價熱鬧促銷的主題。

  (4)排版樣式:比較注重自由排版,在這里文字已經是畫面里的某一種元素,而不止是傳達信息的作用。

  (5)字體選擇:比較適合放一些干凈利落的規(guī)規(guī)矩矩的字體(無論是有襯線還是無襯線字體)或者手寫體,會顯得比較時尚,且氣質符合活動或品牌產品自身的調性氣質,切忌做一些夸張的字體變形或用一些奇形怪狀的字體。

  你們可以想象一下明星走紅毯或出席活動的各種造型,比如下面這些范冰冰的造型,哪一個更耐看顯的更高檔時尚?

698a57d7c07b0000012e7eb47b7f.jpg

  (女神版范冰冰和ladygaga版范冰冰)

  哈哈哈哈哈哈,回到正題,我們接著繼續(xù)往下看~

  (2)2張照片左右拼接,形成對比:

946757d7c0980000018c1b593c71.jpg

  (3)3張照片錯落有致(不過字體效果有點不搭。。):

1ab357d7c0a80000012e7ee0117b.jpg

  (4)4張照片排排放,同時可以有一些傾斜角度或顏色的變化,避免呆板:

828057d7c0b60000018c1b2761c4.jpg

  (5)多張照片并排排列:

5b3957d7c0c60000012e7e3c61b0.jpg

  (6)同樣是多張照片并排排列,但是是作為紋理疊加到背景里:

abf657d7c1030000012e7ef43e84.jpg

  (7)同樣是一張或多張圖片作為紋理疊加到背景里,但是會在畫面里加入一些圖形形狀:

e48a57d7c0f10000018c1bf97bdd.jpg

  (8)用文字來剪裁照片,作為紋理:

242357d7c1200000018c1bbb5bb5.jpg

  總結:

  以上關于如何在不摳圖不合成的情況下做出一張高逼格Banner的分享內容到這里就結束了,興許對你會有所幫助吧!

  (3)適合的活動主題:這種照片類Banner適合好幾種活動主題,比如時尚類/森女系/日系/大牌新品上市等等不是特別火熱低價促銷類型的Banner設計。

  不過如果你能將場景搭建得比較有熱鬧氣氛然后直接拍一張照片,最后配合一些俏皮的文字其實也是可以的,比如下面這樣的Banner其實都可以通過手工搭場景或3D建模的方式得到(這個話題方向我們后面再單獨講一下,如果感興趣的話):

675457d7bf530000018c1b3b06a8.jpg

  下面這個是今年京東618的某個活動Banner,雖然是用PS+AI做的,但是用手工搭建場景+攝影的方式或者3D建模的方式其實也是可以做出來的。

348857d7bfe80000012e7e5b8a9c.jpg

  (4)排版樣式:基本就是左右排版/上下排版或劇中排版了(其實說實話不管怎么樣排版都可以,拍的時候給這張照片足夠的留白空間就好了即使不留白也可以通過加蒙層或者虛化的方式添加文字),下面我給大家演示下:

653657d7c0010000012e7e13f5bb.jpg

  (5)字體選擇:字體是分氣質的,字體的選擇跟Banner的氣質其實也是有關聯(lián)的,比如女性化的字體會纖細瘦長一點,男性化的會粗獷尖銳一點,中性化的字體適用范圍會比較廣所以不會有太明顯的傾向性等等,大家可以簡單看下下方的示例:

c82957d7c01a0000012e7e57e596.jpg

  當然還有英文手寫體在我們的Banner設計中也常常會用到,會讓畫面更加時尚隨性,如下圖中的英文字體enjoy:

ca7857d7c02f0000012e7e1c9c77.jpg

  不過需要注意的是,很多好看的字體都是有版權的,如果私自商用都是會侵權的,所以要么用免費字體,要么購買字體版權要么就自己設計或自己寫了,下面有一些免費字體可以給大家看下(由灰晝前輩二次整理的)。

77b957d7c0420000012e7e1a1dc2.jpg

  好了,以上給大家講的是如何啪啪啪打幾個字就能用一張照片出一張Banner,那么其實我們還可以有更多玩法的,比如同樣是不用摳圖,但是我們可以把一張圖剪裁一下,模糊處理一下,或者旋轉一下,疊加處理一下,再或者是多張圖片混在一起玩等等這些情況又可以出來很多種花樣,適合的品類和活動主題就又多了起來,同樣的,先看幾個實例:

  (1)將1張照片通過剪裁,制造時尚感:

  (不知道誰截的圖,直截了一部分,大家先將就著看下好了~)

  看完以上示例我們會發(fā)現這種照片的玩法有什么規(guī)律呢?

  (1)照片要求:照片背景要干凈簡潔,且照片所占面積要夠大,色彩明度等要與背景區(qū)分開,形成對比。

  (2)適合的品類:任何適合往時尚方向作圖的品類,比如服飾箱包/美妝護膚/進口食品/母嬰保健等

  (3)適合的活動主題:時尚促銷/新品上市/時尚大牌/森女系等非低價熱鬧促銷的主題。

  (4)排版樣式:比較注重自由排版,在這里文字已經是畫面里的某一種元素,而不止是傳達信息的作用。

  (5)字體選擇:比較適合放一些干凈利落的規(guī)規(guī)矩矩的字體(無論是有襯線還是無襯線字體)或者手寫體,會顯得比較時尚,且氣質符合活動或品牌產品自身的調性氣質,切忌做一些夸張的字體變形或用一些奇形怪狀的字體。

  你們可以想象一下明星走紅毯或出席活動的各種造型,比如下面這些范冰冰的造型,哪一個更耐看顯的更高檔時尚?

698a57d7c07b0000012e7eb47b7f.jpg

  (女神版范冰冰和ladygaga版范冰冰)

  哈哈哈哈哈哈,回到正題,我們接著繼續(xù)往下看~

  (2)2張照片左右拼接,形成對比:

946757d7c0980000018c1b593c71.jpg

  (3)3張照片錯落有致(不過字體效果有點不搭。。):

1ab357d7c0a80000012e7ee0117b.jpg

  (4)4張照片排排放,同時可以有一些傾斜角度或顏色的變化,避免呆板:

828057d7c0b60000018c1b2761c4.jpg

  (5)多張照片并排排列:

5b3957d7c0c60000012e7e3c61b0.jpg

  (6)同樣是多張照片并排排列,但是是作為紋理疊加到背景里:

abf657d7c1030000012e7ef43e84.jpg

  (7)同樣是一張或多張圖片作為紋理疊加到背景里,但是會在畫面里加入一些圖形形狀:

e48a57d7c0f10000018c1bf97bdd.jpg

  (8)用文字來剪裁照片,作為紋理:

242357d7c1200000018c1bbb5bb5.jpg

  總結:

  以上關于如何在不摳圖不合成的情況下做出一張高逼格Banner的分享內容到這里就結束了,興許對你會有所幫助吧!

[教程作者:佚名]
免責聲明:本站文章系圖趣網整理發(fā)布,如需轉載,請注明出處,素材資料僅供個人學習與參考,請勿用于商業(yè)用途!
本文地址:http://m.likemindfilms.com/tutorial/di339.html
分析微信朋友圈三天可見隱含的設計原因
定然的十三年網頁設計經驗分享
圖趣網微信
建議反饋
×