如何設(shè)計出靠譜的baner圖片

如何做好一張靠譜的banner設(shè)計，下面就多方位多角度圍繞例子詳細(xì)解說。

求職某公司電商設(shè)計師一職而做的Banner設(shè)計測試題：

這2張Banner，其實單純從視覺設(shè)計上來說，好像并沒有什么大的問題的，只是看起來比較常見和中規(guī)中矩而已，不算是吸引人的那種。但電商設(shè)計師的職責(zé)可不單只是考慮視覺層面的設(shè)計就夠的，比如只是把一些文案和圖片按一定的設(shè)計原理堆放在一張畫布里而已。

因為我們做的是商業(yè)設(shè)計，所以需要明白做這個Banner設(shè)計的商業(yè)目的是什么，然后弄清楚為了達(dá)到這個目的，什么樣的文案才適合放上去，以及什么樣的設(shè)計效果＋氛圍＋配色＋排版布局更合適。

并且你也得明白以上所有這些內(nèi)容和要素所呈現(xiàn)出來的視覺感受最終都只是為了達(dá)成目的而服務(wù)的，也就是賣貨。

一、當(dāng)我們設(shè)計一張Banner時，到底需要考慮哪些內(nèi)容？

看完前面的內(nèi)容，我們就不難發(fā)現(xiàn)，其實身為一枚電商設(shè)計師，我們是要對在這幅Banner里能看到的所有內(nèi)容負(fù)責(zé)的：

從元素的角度來說

比如文案、商品或模特、背景、氛圍點(diǎn)綴元素等等；

從視覺設(shè)計的角度來說

比如該用什么配色配色、該用什么效果、該采用哪種排版布局等；

從運(yùn)營的角度來說

比如什么信息是該突出展現(xiàn)的，要不要放大、加粗或者用顏色等其他方式凸顯出來，而什么信息是不那么重要的，要不要縮小一點(diǎn)、顏色弱一點(diǎn)等等，是用小細(xì)節(jié)圖還是完整的產(chǎn)品圖可以更好的展示賣點(diǎn)等等；

從色彩心理學(xué)的角度來說

比如我是用暗色調(diào)來渲染一種沉寂神秘的感覺呢？還是用明亮的色調(diào)來渲染一種歡快活躍的感覺呢？是用大面積暖色來渲染熱鬧促銷的感覺呢？還是用大面積的冷色調(diào)來彰顯低調(diào)平靜的感覺呢？等等；

還有從營銷和用戶體驗的角度來說

文案字?jǐn)?shù)多少合適？多大字號合適？這張Banner是要放在什么環(huán)境里展示的？如何讓用戶多看幾眼，如何讓它在這個環(huán)境里脫穎而出？等等；

還有很多其他方面我就不繼續(xù)細(xì)說了，因為以上我提到的所有這些問題其實都在我的書里寫的很清楚了，如果你們手里有我的書，可以翻翻看-《這么設(shè)計能熱賣》。

二、為什么會出現(xiàn)反復(fù)改稿和求職做試題被否的情況？

看完前面的這些內(nèi)容，然后我們再重新回到這位求職者身上，不知道大家發(fā)現(xiàn)其中存在的問題沒有？

嗯，其實我一開始就指出了文案方面存在的問題：

但他并不是很在意，而是覺得文案不應(yīng)該是自己要管的事情，反而是很糾結(jié)于是不是自己的排版太差了，是不是因為自己的設(shè)計效果做的不夠炫酷，是不是自己的設(shè)計做得太low了等等，所以才導(dǎo)致求職的公司沒有給他回應(yīng)。

一直到后面我還想繼續(xù)開導(dǎo)他來著，結(jié)果他還是掉進(jìn)了是不是電商設(shè)計就應(yīng)該做炫酷的效果這個漩渦里出不來。

所以，可以很確信的說，這位求職者現(xiàn)在還只是停留在了很淺顯的視覺層面去做設(shè)計而已，離公司實際需要的電商設(shè)計師該具備的運(yùn)營思維和我上面提到的其他各方面的設(shè)計沉淀差距還很遠(yuǎn)。

這也是很多剛?cè)胄谢蛘吖ぷ髁撕脦啄暌琅f沒有開竅的設(shè)計師所處的現(xiàn)狀：反復(fù)改稿被折磨的不行，但最終還是一直無法到達(dá)運(yùn)營或老板要求。

因為除了技能上的不足以外，很大程度上也是因為缺乏我上面提到的那些思維認(rèn)知方面的東西，所以很難準(zhǔn)確理解別人給出的設(shè)計要求，也很難把這些需求信息準(zhǔn)確的傳達(dá)到消費(fèi)者手里的。

這也是很多電商設(shè)計師求職者得到的待遇：好不容易獲得了面試和做試題的機(jī)會，但是做完試題后就不了了之了，別人壓根就不想繼續(xù)回應(yīng)。

因為人家通過你做出來的測試題就可以判斷你這個人到底符不符合要求：如果單純只是技能上的原因，努努力，可能短時間就可以彌補(bǔ)回來了；但如果是思維方面的原因或者認(rèn)知態(tài)度方面的原因，那企業(yè)一般都會直接放棄這類求職者，因為培養(yǎng)成本太高，這不是短時間能改善的。

從作品和談話內(nèi)容來看，很顯然這位求職者2者都占了。

三、分析一下目前的Banner設(shè)計存在的問題

那回到他做的這個Banner試題本身，我們再詳細(xì)地說一說這個Banner問題到底出在哪里。

問題一：畫面沒有重點(diǎn)

因為“擦地打蠟”這幾個字號非常大而且是粗體，所以是引人注目的；但“一鍵噴水／快速清潔”這幾個字號雖然小但是用了亮黃色，導(dǎo)致信息也非常突出；還有價格698也突出，同時左邊的文案整體的面積和右邊商品圖的面積大小其實相差不大，所以左右的視覺吸引力其實也是相當(dāng)?shù)摹?/p>

那我就問你，從這張Banner看，你的第一視覺注意力是哪里？到底哪里才是重點(diǎn)？

嗯，沒有重點(diǎn)，因為你的設(shè)計里到處都是重點(diǎn)，所以就相當(dāng)于沒有重點(diǎn)。

問題二：文案表述有問題

他這里是將“擦地打蠟”四個字提取出來當(dāng)作大標(biāo)題來用了，但其實“擦地打蠟”只是跟他下面的小字“一鍵噴水／快速清潔”一樣的功能性描述文字，所以它們其實是平級的關(guān)系，但他在這里強(qiáng)行將其中一個功能描述文案提取出來做了突出強(qiáng)調(diào)，這么做也不是不可以，但這個強(qiáng)調(diào)的非常莫名其妙。

我站在一個用戶的角度去思考的話，如果我要買你這個拖地的機(jī)器，本質(zhì)上我要買的的是這個機(jī)器給我?guī)淼牡孛媲鍧嵑捅ｐB(yǎng)服務(wù)、省時省力服務(wù)等等，我在意的是這個，結(jié)果你讓我看“擦地打蠟”？然后還瘋狂促銷698元？

不知道的還以為你這是要提供擦地打蠟服務(wù)，一次698元呢。

但其實你是要賣這個機(jī)器對不對？

所以你這里其實是缺少一個類似于“XXXX拖地機(jī)專場”“XXX拖地機(jī)降價了！”這樣的文案，你要把你賣什么東西說清楚。

問題三：設(shè)計目的沒搞清

關(guān)于文案這一塊的排版，到底要突出什么文字信息，這就取決于你的目的是什么：

如果你想突出功能賣點(diǎn)，那你就把那3個功能賣點(diǎn)文案用一樣的設(shè)計樣式突出展示就好了，然后在產(chǎn)品圖周圍配合著做一些氛圍效果圖，其他的信息都可以處理的比這個信息弱一點(diǎn)；

如果你想突出利益點(diǎn)低價，那你就把價格這塊突出強(qiáng)調(diào)就好了，其他的信息都可以處理的比這個信息弱一點(diǎn)；

如果你想突出這個產(chǎn)品的型號或活動名稱，那你就把“XXX拖地機(jī)降價了！”這塊突出強(qiáng)調(diào)就好了，其他的信息都可以處理的比這個信息弱一點(diǎn)；

如果你想突出這個產(chǎn)品的外觀顏值，那你把產(chǎn)品圖搞精致一點(diǎn)，搞大一點(diǎn)，甚至可以放一些細(xì)節(jié)圖展示，其他的信息都可以處理的比這個信息弱一點(diǎn)；

如果你想突出這個產(chǎn)品的外觀顏值，那你把產(chǎn)品圖搞精致一點(diǎn)，搞大一點(diǎn)，甚至可以放一些細(xì)節(jié)圖展示，其他的信息都可以處理的比這個信息弱一點(diǎn)；

如果你想強(qiáng)調(diào)的是一種使用的場景代入感，那你可以把這個產(chǎn)品放在某個特定的場景環(huán)境里給大家看，用合成或攝影的方式都可以實現(xiàn)，文案排版依舊可以遵循上面的方式；

總之，你要突出展示什么內(nèi)容并沒有標(biāo)準(zhǔn)答案，這是由運(yùn)營目的決定的。

比如我隨手截圖一張?zhí)熵埵醉摰腂anner圖，看似很簡單，但是人家的信息層級關(guān)系很明確啊，雖然文字很多，但是你會跟著他給你的視覺指引走。

所以這個Banner我就看了幾秒我就知道了：“哦，賣智能馬桶的，可以滿1000減500，還能免費(fèi)拆舊換新，點(diǎn)進(jìn)去看看吧！～”

訣竅在于：

相同等級的文案信息在大小、顏色、字形、字號上盡量保持一致，不做得太復(fù)雜；

即便是相同顏色的字體，如果它們里面的信息層級是不一樣的，那么可以根據(jù)文案信息的重要層級做一些大小方面的區(qū)分；

其他著重想突出的文案信息可以通過換個顏色的方式跳出來；

（當(dāng)然我這里的舉例只是和你們探討視覺層級關(guān)系的處理，至于間距方面和美感方面的問題我們這里暫且先不討論。）

總之，你會發(fā)現(xiàn)，一個合格的電商設(shè)計師其實應(yīng)該是一個導(dǎo)演，同時是一名指引者，他在設(shè)計的時候思維是很清晰的：這一步他要你看什么，下一步他要你看什么，最終要把你帶去哪里，然后達(dá)到自己的某種目的。

而且假如自己功力還不夠的情況下，你可以保守一點(diǎn)，一幅畫面里最好只有一個主角，其他都是配角，把層級關(guān)系搞明確一點(diǎn)。

不要一上來就嘩啦嘩啦的全都搞成主角重點(diǎn)了，如果你是導(dǎo)演的話，你這是家里有礦啊還是喜歡搞潛規(guī)則啊，哪來這么多主角啊！～

寫在最后

很多人都對電商設(shè)計有一些誤解，比如一提到電商設(shè)計就覺得這個沒啥技術(shù)含量，再比如一提到電商設(shè)計就覺得要做出什么非常炫酷的效果才牛逼，其實這些思想都是不對的，那只能說明ta們對于電商設(shè)計的認(rèn)知太淺了。

如果你也比較迷糊，那么看完這篇文章，相信應(yīng)該是有一點(diǎn)開竅了吧。

而且越到后面你就越會發(fā)現(xiàn)這里面的奧秘多著呢，涉及到了運(yùn)營、營銷、新設(shè)計、文案、策劃、攝影、修圖、手工等等各種，非常有意思。