淘寶Benner圖如何做做淘寶對設計一竅不通肯定在平時的開店過程中會遇到很多的困難，但是沒關系，現(xiàn)在開始學也不晚，今天要大家講解的是最基本的問題，淘寶Benner圖如何做？

一、先了解普遍意義上的色彩是指什么？

簡單點來說，色彩即顏色，顏色可以分成有彩色和五彩色兩大類，看有彩色主要看色相／純度／明度三個方面的屬性，無彩色也就是白色／黑色／各種深淺不同的灰色，也可以說無彩色是飽和度為零色彩。

色相，即可以明確表示顏色色別的名稱，比如紅橙黃綠藍靛紫：

色彩有冷暖之分，我大致用溫度的概念標注一下，其中“0”是指中性色，“－0”是指中性偏冷，“＋0”是指中性偏暖（這里的溫度是我自己為了具體化冷暖的概念而標記的，主要是方便大家理解，所以不用去糾結(jié)這個數(shù)值準不準確哈哈，你明白他們代表很冷／很熱／一般冷／一般熱就好了！～）。明度，就是指色彩的明亮程度（通俗點講，在某種色彩里添加的白色越多就越明亮，添加的黑色越多就暗）。

要想做好電商設計，最基礎學問最大的當屬Banner設計了，所以我們還是從Banner設計開始說起，先回顧一下Banner是由哪些部分組成的。

二、再回顧一下Banner的組成要素有哪些？

Banner組成要素包含4個方面：文案 、商品／模特、背景、點綴物。

三、Banner的作用是什么？

宣傳／展示／廣而告之／準確傳達信息。

四、那么在Banner設計中影響到信息傳達的有哪些因素呢？

(一)整體畫面的氣質(zhì)是否對路；

(二)信息之間的層級關系是否準確；

(三)是否考量了Banner所投放的環(huán)境。

接下來，我們針對上面3個因素一個一個來講解：

(1)整體的畫面氣質(zhì)是否對路

這里指的畫面氣質(zhì)就是指給人傳遞出一種什么樣的感覺，比如說用戶看了你這個Banner之后會感覺它很熱鬧／很素雅／很高冷／很年輕有活力／很潮／很壓抑／很恐怖／很高貴等等這些感覺，那么下面我舉幾個例子：

Banner舉例：很熱鬧的畫面氣質(zhì)（關鍵詞：低價促銷／周年慶／節(jié)假日促銷等搞活動的性質(zhì)）

總結(jié)觀察：畫面由暖色變?yōu)槔渖螅瑫l(fā)現(xiàn)熱鬧的畫面氣質(zhì)銳減，所以在表現(xiàn)熱鬧氣質(zhì)的Banner設計中，除了畫面形式比較活潑或者動感以外，我們也常借助大面積的暖色（紅／橙及附近區(qū)域）來渲染熱鬧氛圍，讓人感覺喜慶或者熱血沸騰，然后控制不住就買買買～對于服飾的Banner氣質(zhì)的畫面千萬不要把畫面堆得太滿，一定要記得留白和搭配優(yōu)雅纖細些的文字（有襯線或者無襯線字體均可），或者比較有文化底蘊的字體，千萬不要用五大三粗的文字或者把畫面塞得滿滿的。

我們知道一個Banner包含有好幾個部分，文案／模特或商品／背景／點綴物，而最終他們組合成為一個Banner，其層級是存在主次之分的，可以分為下面幾種情況：

1、以產(chǎn)品或模特為主角（主要突出產(chǎn)品或模特）；

2、以活動標題為主角；

3、以利益點為主角。

而背景和點綴物永遠不可能是主角，他們只能是配角，同時在這里顏色不是一個獨立的分析要素存在，它應該是伴隨著平面的知識點來說，所以這里我也會順帶一點平面方面的知識點，舉幾個例子：

（一）以產(chǎn)品或模特為主角（主要突出產(chǎn)品或模特 ），我們有三個方向可以去發(fā)揮：

（1）讓商品（模特）的顏色與背景顏色絕對地區(qū)分開來，讓它成為天空（畫面）中最閃亮的一顆星～也就是我們說的色彩對比，色彩對比又包含三種：明度對比／飽和度對比／色相對比，假設下圖中的圓就是商品或模特。我們再去色看一下對比的效果，如下圖（去色是我們常用的一種查看信息是否突出的方法，令外還有一種距離觀察法查看對比效果，比如你也可以離屏幕站遠一點查看，或者人保持不動縮小畫布查看）：

這樣看，哪個對比效果好些？是不是一目了然了？不過還是要說明一點，明度飽和度里任何一項要素發(fā)生改變，其他要素也是跟著改變的，比如說你增加了一個顏色的明度，代表你在這個顏色里增加了白色，那么相對應的這個顏色的純度飽和度肯定也就下降了，不知道我說這些你們明白了沒有？（默默點根煙～惆悵臉～）

對了，我還要在這里繼續(xù)插一句嘴：色彩對比不會單獨存在，它的運用永遠是依附于下面兩種方式存在的（增大商品模特面積或者增加商品模特數(shù)量）：

（2）通過留白或者大小對比的方式讓商品（模特）體積或面積足夠大。

（3）通過一定的擺放規(guī)律，讓商品（模特）數(shù)量足夠多，因為數(shù)量多了總面積自然也就大了嘛～。

（二）以活動標題為主角

跟上面的道理類似，可以運用增大標題面積或者同時結(jié)合色彩對比的方式使標題突出成為主角：

（三）以利益點為主角

道理同上（有時候我們做Banner會直接用利益點作為大標題，這種就會使Banner的低價促銷的氣息會更濃烈些）

總結(jié)來說，但我們講色彩的時候，其實也是在講平面構(gòu)成，當我們在講色彩三要素（明度／純度／色相）的其中一項的時候，其實也意味著在同時考慮其他要素，因為色彩不會單獨存在，色彩要素也不會單獨存在（我重復這么多遍，也是操碎了心呢～～）。

是否考量了Banner所投放的環(huán)境？

當我們講到環(huán)境的時候，往往會講到外部環(huán)境和內(nèi)部環(huán)境，也就是站在全局去考慮問題和站在自我的角度去考慮問題，如果你是要在某平臺投放 Banner，那么這個平臺對你來說就是大環(huán)境，具體到你投放的那一小塊Banner位置就是小環(huán)境。

從平臺設計師的角度出發(fā)，她肯定是希望你所有的Banner放在這個平臺頁面里，整體是融合的，不突兀的 ，比如下面的萬件好禮免費送和專屬活動這塊的小Banner，用不同色相表示不同會場或主題，但是每一個色彩的明度飽和度是相似的，設計形式也一樣都有自己的規(guī)范，這就給人整體統(tǒng)一協(xié)調(diào)的感覺：

五、色彩在Banner設計中所起到的作用

（一）點綴作用（渲染氛圍用）；

（二）突出主體（梳理信息層級）；

（三）平衡畫面（整體視覺協(xié)調(diào)）；

（四）延續(xù)風格（涉及到風格統(tǒng)一調(diào)性的時候）；

（五）塑造畫面氣質(zhì)（傳遞恰當?shù)那榫w給用戶）。

就以上五種作用，我在下面會分別舉例說明：

（一）點綴作用（渲染氛圍用）

當你做了一個冷色調(diào)的頁面拿給你的主管或需求人看，他說畫面太冷清的時候，而你又懶得改顏色改形式等等，總之你非常懶不想動，那么不妨試下下面這樣周圍點綴些暖色的方式（色彩依附的形狀和大小面積你自己斟酌咯～只需要記住點綴物是配角，他是烘托氣氛用的，永遠不要搶了主角的風頭，要不然導演不給你這配角安排角色了，怕不怕？）。

（二）突出主體（梳理信息層級）

這個通過色彩對比來突出信息層級的作用其實我在前面的知識點里已經(jīng)講了哦，翻回到前面去看下吧，我就不繼續(xù)說一遍了。

（三）平衡畫面（漸變色使得整體視覺協(xié)調(diào)）

我們有時候會看到一些Banner強調(diào)的是整體畫面的協(xié)調(diào)感覺，并不會重點去突出強調(diào)什么，整個畫面給人感覺特別舒服，那是因為他們往往采用的是類似色對比或者鄰近色對比，亦或者是采用相似明度和飽和度的不同色相的漸變調(diào)和。

（四）延續(xù)風格（涉及到風格統(tǒng)一調(diào)性的時候）

通過色彩來延續(xù)風格的作用往往在平臺做一些比較大型的活動，涉及到多個不同品類不同分會場的時候會運用到，我看到一些店鋪電商品牌也慢慢規(guī)范化了之后也會用到這種方式以保持品牌統(tǒng)一調(diào)性性，也就是保持設計風格一致，色彩的明度純度接近，只是改變色相，以不同的色相代替不同的品類或者分會場來設計Banner圖。

（五）塑造畫面氣質(zhì)（傳遞恰當?shù)那榫w給用戶）

比如我們前面提到的很活力／很可愛／很高貴／很素雅等等，我這里也不繼續(xù)描述了哦，文章開頭都有提到過的。

淘寶Benner圖如何做，優(yōu)秀案例欣賞

六、如何在Banner設計中使用色彩

色彩不會獨立存在，他必定是依附于其它構(gòu)成和表現(xiàn)形式而存在，比如平面構(gòu)成、立體構(gòu)成等，所以我將從下面幾個方面來論述：

（1）當色彩運用在不同的面積；

（2）當色彩運用于不同的形狀；

（3）當色彩運用在不同的肌理；

（4）當色彩運用于不同的色彩；

（5）當色彩運用于不同的主題；

（6）當色彩運用于不同的環(huán)境。

總結(jié)：

我們需要知道色彩是一種情緒的表達，也許要學會舉一反三（其他顏色可以以此類推無論），另外無論是有彩色還是無彩色它們都不會獨立存在，它必定是依附于其它表現(xiàn)形式而存在，比如與平面構(gòu)成、立體構(gòu)成結(jié)合運用。

轉(zhuǎn)載請注明出處（本文轉(zhuǎn)載于：http://m.qdxinzhong.com/school/infos19892.html）