前幾天，我受到了一次打擊，之前海鹽的緊固件的專場上線后，實際的效果與我原本的設(shè)計相去甚遠(yuǎn)。究竟是什么原因造成了這樣的差異呢？在經(jīng)過一些對照比較后發(fā)現(xiàn)，問題就出在“Banner的設(shè)計”上。線上的版本只是將一些簡單的未經(jīng)處理的圖片放了上去，話說術(shù)業(yè)有專攻，倒也是為難了運(yùn)營的同學(xué)。一個好的頁面是由若干個優(yōu)秀的點(diǎn)組成，今天在這里就以首頁Banner工業(yè)品類為例，進(jìn)行模板化的粗淺總結(jié)，以期望對往后在保證Banner設(shè)計質(zhì)量的前提下提高工作效率有所幫助。

　　我將一塊好的Banner設(shè)計總結(jié)出了3大條件：

　　1.明確的信息傳達(dá)；之所以將這一條列為第一點(diǎn)是因為Banner最主要的目的在于告

　　訴用戶我們要干什么，我們要告訴他們什么。在網(wǎng)絡(luò)世界里，我更傾向認(rèn)為其是一個能真正體現(xiàn)個人意志的地方，如果我們不能在最短的時間內(nèi)把我們想說的傳達(dá)給用戶的話，那用戶會毫無顧慮的選擇離開，而不用考慮什么“情面”。在具體的Banner設(shè)計中，信息的傳達(dá)方式無外乎2種——圖片和文字；圖片是一種最直接的傳達(dá)模式，也是用戶理解成本最低的信息接受渠道，因此圖片一定要選擇明晰的，一眼看上去就知道到底在賣什么，要表達(dá)什么。

　　而文字，是要進(jìn)一步的告訴用戶，我們這個是干什么呢，能給用戶帶來什么，是打折呢還是新貨上市？因此，我們要按照我們的利益點(diǎn)的輕重來依次展現(xiàn)，例如我們最大的賣點(diǎn)就是“2折銷售”，那么毫無疑問，“2折銷售”的字樣一定要大，要醒目，其余的則需要相應(yīng)的弱化。

　　2.合適的創(chuàng)意；一直以來我都認(rèn)為我們做的其實是“戴著腳銬”的設(shè)計，我們需要在一定的框架內(nèi)進(jìn)行設(shè)計，否則網(wǎng)站的整體性從何談起，畢竟我們做的是設(shè)計不是藝術(shù)。

　　那Banner具體如何來“創(chuàng)意”呢？（之所有選擇“創(chuàng)意”這個詞，是因為“設(shè)計”包含文字排版，整體創(chuàng)意等，而這里說的是具體的創(chuàng)意）也許Banner的創(chuàng)意有千萬種，但是有一種是較容易實現(xiàn)并能在之后的其他設(shè)計中通用的，這便是“氛圍的營造”。所謂“氛圍的營造”就是指根據(jù)具體產(chǎn)品的特性來烘托周圍的氣氛，這個氣氛可以是一個很小的相關(guān)元素，例如下圖，所有的設(shè)計都在于機(jī)器迸發(fā)出的火花，這雖然只是一個元素，但是卻可以讓死氣沉沉的工具“活起來”，最為關(guān)鍵的是這個元素承載了多種電動工具的“共性”，換句話說就是在不同的電動工具的Banner設(shè)計中都可以使用到。

　　3.優(yōu)良的素材；很多時候，一個拙劣的素材會毀掉一個很好的創(chuàng)意，可以說素材是Banner設(shè)計中的點(diǎn)睛一筆。那么什么樣的素材算是好的素材呢？我個人覺得有2點(diǎn)：一是較好的攝影效果，虛實有別才能形成較好的空間感；二是要靠設(shè)計師自身去辨別尋找。我總是認(rèn)為，沒有丑陋的事物，只是我們沒有發(fā)現(xiàn)獨(dú)特的美。就拿下面兩幅圖來說，同樣的元器件，差別在哪里？

　　如何定義模板：

　　模板不僅僅是字號、顏色，而是包括了信息傳達(dá)方式、排版、字體、創(chuàng)意、素材等一系列要素，我們所要做的一是規(guī)范二是找到共性。下面將從文字、創(chuàng)意、素材3大類來進(jìn)行分析與設(shè)想。

　　1.信息傳達(dá)的一勞永逸——文字與圖像；首先文字在于圖像的層次之上，文字的排版、字號、字體都應(yīng)有所規(guī)范，我們可以定義出不同文字量的排版方式，例如主題4個字的排版方式、8個字的排版方式等，相應(yīng)的輔助文字對應(yīng)主題如果排列；文字的層次關(guān)系需要明確，字體的選擇盡量統(tǒng)一在3種字體選擇內(nèi)，當(dāng)然在具體的設(shè)計中可以有所改變，但是至少要給設(shè)計師以參考。圖片作為背景可以貫穿整個Banner，主體圖片位于右側(cè)，所占Banner比例約為三分一，這樣整個Banner不會顯得太擁擠，文字的辨別也較為明晰。

　　2.創(chuàng)意的一勞永逸——“氛圍”是虛的東西，只要保持核心的意思不變就可以，所有的材質(zhì)、素材都可以更換，例如下圖其“核心”在于體現(xiàn)機(jī)械的沖擊感，背景材質(zhì)，主體產(chǎn)品甚至于那個洞都可以更換，但是無論怎么更換，其總體的感覺是相似的。這便是創(chuàng)意的模板，一個創(chuàng)意可以在不同的產(chǎn)品上使用多次，而這其實是找到不同產(chǎn)品中的共性而已。

　　3.素材尋找的一勞永逸——我們可以自己去拍素材：有一些產(chǎn)品，即使看起來很丑陋的產(chǎn)品，我們都可以發(fā)現(xiàn)它身上獨(dú)特的一點(diǎn)，剛硬的美、柔軟的美、簡單的美、復(fù)雜的美。只是我們沒有發(fā)現(xiàn)而已。同一個產(chǎn)品不同的角度能體現(xiàn)不同的特點(diǎn)，就像模特一樣。6個角度我們可以使用6次，為什么不可以？

　　收集素材的重復(fù)使用率：有多少我們電腦里的素材我們是使用三次以上的？又或是我們總是在不停的尋尋覓覓中。

　　其實關(guān)鍵在于不要總是聽同一首歌:一首歌，再好聽，天天聽也要膩的，但是如果隔了一段時間，你再聽卻會有不同的感受。（我們可以準(zhǔn)備3套創(chuàng)意，三個素材，如此組合就有9個不同的BANNER。）

　　原文：http://www.aliued.cn/?p=2966