第3章　Banner釋義及組成要素

為了方便大家理解整本書的內容走向，在這里先做一些基本的科普，首先從一些關于Banner的基礎知識說起。

如果你想從事電商設計方面的工作，Banner設計應該作為入門基礎來掌握和了解，專題頁／首頁／詳情頁／海報設計等其實都可以看作是在Banner設計的基礎上衍生而來的。

另外考慮到看這本書的人，可能不都是做電商設計的，也有做網頁的、做品牌的、做平面的、做UI的，甚至還有運營和管理者，而Banner的適用范圍非常廣，同時，確實也有很多人對Banner缺乏正確的認知，把它想得太過簡單，又或者把它想得太過復雜，鑒于這些現實存在的問題，我決定借助本章，帶大家重新認識以及了解一下Banner。

這樣一來，也許在你看完本章后，會在以后做設計的過程中多一些點子，或者在指導需求的時候、跟上下游交流的時候，做到有條理地、有理有據地說出自己的觀點，并給出修改意見或解決方案，做個有思想、有見解的人。

3.1　Banner的釋義和運用范圍

Banner其實就是展示于各種電子屏幕上的利用互聯網傳播的各種尺寸大小和形狀的廣告，其作用就是展示／宣傳／廣而告之。

下面給大家舉一些例子，方便大家理解，下面圖中框出的位置，以及你能看到的部分圖片，其實都可以理解為Banner，如下圖所示。

所有紅框所示的部分其實都可以看作是不同尺寸不同投放位置的Banner，包括其他網站上能看到的可單擊的圖片，幾乎都可以視作是Banner。

還有幾乎所有App上的可點擊的圖片也都可以看作是Banner，比如網易云音樂，如下圖所示。

很多App的廣告彈出框或啟動引導頁，以及開屏廣告頁也都可以視作是豎版的Banner，如下圖所示。

其實就連我們看到的海報和雜志封面都可以理解為豎版的Banner，如下圖所示。

甚至你在公眾號封面及底部里看到的那些二維碼圖片都可以當作是Banner，比如我給自己做了兩張，如下圖所示。

其實每次只要做分享或講座，我自己的演說PPT也都是當作Banner來做的，都會依照相應的主題或當時的氛圍情景來做。這樣下來，每次帶給觀眾的感受也就會不一樣，雖然工作量加大，但是一方面我自己不會感到枯燥，另一方面大家也會覺得新鮮一些。

是不是很神奇？“噢，原來Banner的運用范圍這么廣啊！”

對，不過更精彩的內容在后面，我們接著往下看。

3.2　Banner的組成要素

一個最常規、最完整的Banner，一般有六個組成部分：文案、模特、商品、背景、點綴元素、LOGO，我給大家簡單做了一個示例，如下圖所示。

注釋：點綴元素的類型有很多種，可以是一些裝飾性的文字點綴，也可以是一些圖形或非主要產品的相關點綴，甚至是一些光影效果。這個會在后面著重講解，大家可以先大致了解一下。

需要說明的是，以上是屬于組成元素比較完整的Banner，并不是每個Banner都是由所有這些元素組成的，其實只需要包含以上至少一個要素，就可以視作一個Banner了，比如有的Banner可能什么都沒有，連背景也沒有，只放了一個LOGO而已，有的Banner只放了產品而已，連文案都不需要。

不知道大家理解了沒有呢？如果沒有完全理解，我們再接著往下看。

3.3　Banner賞析

辨別優劣的前提是先多看，那么應該怎么看呢？這里主要從“定位方向”和“表現手法”兩個方面來欣賞Banner。

3.3.1　先說定位方向

高冷大牌，自信到連文案都不需要，如下圖所示。

文藝范Banner，仿佛是活在自己的世界里，注重自我表達，如下圖所示。

新品首發Banner，可以稍微熱情一點。

時尚類Banner，可以稍微酷一點。

小清新Banner，可以可愛一點。

另類型Banner，可以搞怪一點。

低價促銷Banner，可以瘋狂、活潑一點。

假想同樣是賣女裝，不同類型定位的Banner傳達給人的感受，是不一樣的，有的特別冷淡，有的特別熱情，它們在視覺上帶給我們的差異感受其實就是來源于定位方向的不同。

另外，這里也可以再跟大家分享一些網易云音樂的Banner，先看下圖，后面再給大家說感受。

大家注意到了嗎？大概是因為音樂這種東西很多時候都是在抒發一種情感的緣故，或喜或悲或惆悵，同時音樂又是跟藝術相通的，所以這些音樂類的Banner圖看起來在排版方面都比較靈活自由，往往字體設計也非常考究，有藝術感，畫面多帶有一種情緒，可以很抽象，這種Banner非常適用于一些走文藝路線的電商品牌，所以大家也可以參考一下。

像下面這個Banner，從模特打扮和設計風格來看，這些人是玩搖滾的，同時還透露著一股文化底蘊，果不其然，他們確實就是一個民謠搖滾樂隊——布衣樂隊。

再看看同是網易旗下的產品——網易考拉海購，它有些賣貨類的Banner大家可以看下，非常常規，這些不同的視覺感受其實也都是基于Banner目的的不同和遵循一些便于平臺管理的規范而決定的。

3.3.2　Banner的表現手法

很多設計師可能并沒有意識到，其實為了達到某種效果或目的，實現方法是多種多樣的，去用自己最擅長或最感興趣的方式去實現就好，只要能達到目的和效果就行。

比如，做出一個Banner都有哪些表現手法呢？

1．攝影：Banner可以直接拍出來

2．三維建模：Banner可以直接建模渲染出來

3．插畫：Banner可以直接畫出來

4．合成：Banner可以直接合成出來

5．手工：Banner可以直接用手工做出來（比如紙雕／軟陶／針線活等）

以上所有的表現手法都是可以互相結合運用的（后面會詳細講解的，這里只是大致地讓大家了解一下），總之，方法是活的，看大家怎么利用自身的優勢去發揮和創造吧。