編者按:初入職場(chǎng)的設(shè)計(jì)師,可能每天都要做大量banner,工作多了,創(chuàng)意跟不上怎么辦?其實(shí)創(chuàng)作banner也有規(guī)律可循,網(wǎng)易的同學(xué)就用大量案例 + 多個(gè)角度分享了他的經(jīng)驗(yàn),是一篇不可多得的經(jīng)典文章,趕緊來(lái)學(xué)習(xí)一下。 寫(xiě)在前面的話 有人覺(jué)得做個(gè)banner放2張圖,排幾個(gè)字的事,一點(diǎn)技術(shù)含量都沒(méi)有,像其他門(mén)戶banner基本上都是編輯們自己做的。我覺(jué)得這么說(shuō)是不對(duì)的,其實(shí)一個(gè)banner可以研究的東西還是很多的,而且做一個(gè)banner是不難,難得是在短時(shí)間內(nèi)做一個(gè)出彩的banner。門(mén)戶的專題一般是編輯套模板拼成的,比較重要的專題,banner部分是由設(shè)計(jì)師來(lái)完成,一個(gè)banner的品質(zhì)上去了,整個(gè)專題的質(zhì)量感就上來(lái)了,所以這部分交給設(shè)計(jì)師來(lái)做也是重視品質(zhì)的表現(xiàn),這個(gè)毋庸置疑。但banner畢竟不比大型項(xiàng)目,從設(shè)計(jì)成本上說(shuō)不可能給太多的時(shí)間給設(shè)計(jì)師,于是乎,設(shè)計(jì)師有時(shí)候是靠經(jīng)驗(yàn)積累,有時(shí)候妙手偶得,質(zhì)量也是時(shí)好時(shí)壞,更害怕的是當(dāng)沒(méi)有經(jīng)驗(yàn)沒(méi)頭緒沒(méi)有心情時(shí),胸中無(wú)物,不知道如何下手,于是越急越亂,越亂越急,最后匆匆了事,這種狀態(tài)下估計(jì)也出不了好的東西。在排除技術(shù)手段的前提下,如何通過(guò)一些經(jīng)驗(yàn)的思考,讓banner達(dá)到通情達(dá)意效果,也是我下面要說(shuō)的,個(gè)人經(jīng)驗(yàn)之談,供大家參考。
一 :思考專題定位 顧及需求方的頻道定位 因?yàn)榘瑑?nèi)容不同,門(mén)戶網(wǎng)站各個(gè)頻道有著不同的風(fēng)格,所以設(shè)計(jì)師們做設(shè)計(jì)的時(shí)候也要考慮到如體育頻道的運(yùn)動(dòng)感,財(cái)經(jīng)頻道的國(guó)際和高端等。
圖1/女人頻道的定位是知性 ,所以這個(gè)banner設(shè)計(jì)風(fēng)格也是很貼切的。/banner 贊助 夏小萌
圖2/歷史頻道的專題,做出厚重滄桑的歷史感還是很切題的。/banner 贊助 10 顧及此專題的定位 專題的定位有時(shí)候和頻道的定位偶爾是有沖突的,如女人頻道一貫的知性理性的大風(fēng)格下,有時(shí)候會(huì)來(lái)一些可愛(ài)小女人,有時(shí)候有做溫馨浪漫,在這種有風(fēng)格沖突的情況下,我們還是以貼合專題的定位為主,當(dāng)然也盡量做到不能背離頻道風(fēng)格太遠(yuǎn)。 圖3/女人頻道下的一個(gè)懷舊感的專題,所以畫(huà)面做出了一些懷舊的感覺(jué)。/banner 贊助 璇
圖4/數(shù)碼頻道的一個(gè)和某手機(jī)贊助商的活動(dòng),所以banner也表露出一定的商業(yè)感。
二:明白文字在Banner中占主導(dǎo)地位 從構(gòu)成上講,一個(gè)banner分為2個(gè)部分,一為文字,二為輔助圖。輔助圖雖然占據(jù)大多數(shù)的面積,但是不加以文字的說(shuō)明,很難讓用戶知道這個(gè)banner要說(shuō)明什么。要讀一個(gè)人的喜怒哀樂(lè),只要讀其五官即可。在一個(gè)banner里面,標(biāo)題文字起著五官一樣的作用,所以個(gè)人覺(jué)得文字才是整個(gè)banner的主角。所以對(duì)于文字的處理,顯得尤為重要,在文字處理時(shí)有幾個(gè)小技巧,與大家分享。 圖5/banner文字闡述專題主題,是絕對(duì)的主角。/banner 贊助 淑華 分清主標(biāo)和副標(biāo),從主次上來(lái)說(shuō),主標(biāo)為主,字體要大顏色要醒目。副標(biāo)起到從內(nèi)容上和形式上都輔助主標(biāo)的作用。一個(gè)好的banner標(biāo)題文字處理都比較飽滿,比較集中。
圖6/對(duì)主標(biāo)題的斷詞比較巧妙,文字集中,主次明顯,且文字與輔助圖案相互呼應(yīng),統(tǒng)一感很好。/banner 贊助 淑華 如果主標(biāo)太長(zhǎng),需求方不舍得刪文字的情況下,對(duì)主標(biāo)中重要關(guān)鍵字進(jìn)行權(quán)重,突出主要的信息,弱化‘的’、‘之’、‘和’‘年’‘第X屆’這種信息量不大的詞。
圖7/長(zhǎng)標(biāo)題的時(shí)候,如果把‘征集各種端午風(fēng)俗’排成一行,就會(huì)顯得沒(méi)有主次,也很有吸引力。我這里把‘端午’這個(gè)最重要的信息提出來(lái),讓用戶很容易進(jìn)入環(huán)境,然后讓他們繼續(xù)了解更多的信息。這里還要說(shuō)一個(gè)小技巧,我這里‘征集各種’、‘端午’、‘風(fēng)俗’這三個(gè)詞雖然分別用了3種字體,但還是能讀出‘征集各種端午風(fēng)俗’這是一斷話,因?yàn)橥粋€(gè)紅色起到了很大的作用。 如果需求方整體文字太短,畫(huà)面太空,可以用一些加入一些輔助信息豐富畫(huà)面。如加點(diǎn)英文,域名,頻道名等。 圖8/這個(gè)banner附加了一些英文來(lái)豐富畫(huà)面,讓畫(huà)面充滿豐富的同時(shí),充滿生氣。/banner 贊助 LV 三:構(gòu)建輔助視覺(jué) 一個(gè)banner最主要的是標(biāo)題,但輔助視覺(jué)起著烘托標(biāo)題文字的作用,然而這也是最有難度的一個(gè)活,設(shè)計(jì)師的個(gè)人風(fēng)格和變現(xiàn)力在這里能夠淋漓表現(xiàn)。文字和輔助視覺(jué)的關(guān)系,我這里列舉了3個(gè)常見(jiàn)搭配方式,這幾種方式搭配分別有不同的效果,從而產(chǎn)生不同感覺(jué)。 3種文字和輔助視覺(jué)常見(jiàn)的搭配方式: 1,文字+背景陪襯兩段式。特點(diǎn)突出文字,視覺(jué)集中文字,報(bào)道感強(qiáng)。
圖9/banner 贊助 胡子
圖10 2, 文字+主體物的兩段式,文字圖案相輔相成,起到文字言事圖案幫助理解的效果。這樣的banner適合做介紹類或者產(chǎn)品類。 圖11/banner 贊助 淑華
圖12 3,主體物+背景+文字的三段式,特點(diǎn)虛實(shí)結(jié)合,主次關(guān)系明顯,也是效果最好,用的最廣泛的一種形式。
圖13 圖14 圖15/banner 贊助 淑華 四:創(chuàng)造力對(duì)主題的藝術(shù)化表現(xiàn) 1,嚴(yán)肅話題也能做出新感覺(jué) 做新聞報(bào)道的時(shí)候,遇到嚴(yán)肅話題,一般的設(shè)計(jì)師,都會(huì)比較拘謹(jǐn),不敢也不愿去做視覺(jué)上的創(chuàng)新。所以配到這種話題,畫(huà)面效果一般都會(huì)比較模式化,信息量弱,感染力不足。這時(shí)候,設(shè)計(jì)師如果敢解放思想,去動(dòng)腦子做一些創(chuàng)新,其實(shí)嚴(yán)肅話題做上新感覺(jué),能夠達(dá)到意想不到的效果。 圖16 /主題文字埋沒(méi)在洪流之中,讓其有一種融入感。洪流、閃電、陰暗的天空、淹沒(méi)的城市,畫(huà)面災(zāi)難感很強(qiáng),角落處的武警官兵抗洪,讓整體災(zāi)難中透出希望,哀而不傷。設(shè)計(jì)師有時(shí)候不僅僅應(yīng)擁有對(duì)畫(huà)面掌控力,對(duì)專題主題的把握,也是作為一個(gè)設(shè)計(jì)師應(yīng)該具備的素質(zhì)。
圖17/因?yàn)槭亲鱿募靖邷氐膶n},所以在處理畫(huà)面的色彩時(shí)候我對(duì)比度做的比較弱,就如同烈日下看東西的感覺(jué)。
圖18 這是春運(yùn)的專題,我在處理畫(huà)面用了很多斜的構(gòu)成,因?yàn)樾钡臇|西學(xué)構(gòu)成的時(shí)候表達(dá)那種不安感是比較貼切的。擁擠的人群、陰霾的天空,不安中帶著希望,當(dāng)一張小小的火車(chē)票就能映出當(dāng)回家的曙光時(shí)候,我想,或許這就是很多人對(duì)于春運(yùn)的感覺(jué)吧?;仡^看看其他門(mén)戶的專題,光艷無(wú)比,一股社會(huì)主義的優(yōu)越感油然而生的感覺(jué),不知孰對(duì)孰錯(cuò),再想時(shí),我已迷失。
2,輕松話題可以做出幽默感 有時(shí)候也會(huì)做到一些輕松感娛樂(lè)感的專題,在做這些專題的時(shí)候,設(shè)計(jì)師們就能更加放開(kāi)了。 圖19/這個(gè)專題banner,做的很輕松很幽默。編輯說(shuō)他的頻道群里發(fā),整個(gè)頻道的人都笑翻了。
圖20 3,作品也能帶點(diǎn)小情調(diào) 有時(shí)候來(lái)一些小的創(chuàng)意也會(huì)讓banner增色不少。
圖21/搖滾的不是樂(lè)器,還是文字/banner 贊助 竆 圖22/冰雪也的不僅僅是車(chē),還是文字 后面的話 有時(shí)候我覺(jué)得做一個(gè)banner,如做一篇文字,文字可以是小說(shuō),可以是詩(shī)歌,也可以是散文,形式多樣;可以用比喻、也可以擬人,也可以排比,手法也是多樣。做一個(gè)banner,有時(shí)候需要字斟句酌,有時(shí)候則要點(diǎn)到即止;有時(shí)候該放,有時(shí)候該收;有時(shí)候可以如蘇東坡般登高望遠(yuǎn)、舉首長(zhǎng)歌,有時(shí)候又可如柳永般娓娓道來(lái)、觸動(dòng)心靈。你可以用不同形式和手法來(lái)表現(xiàn),但相同處,通情達(dá)意,揭露主旨。本文主要從定位、文字、輔助圖和藝術(shù)性上表達(dá)了我對(duì)于做一個(gè)通情達(dá)意banner的一些見(jiàn)解,讓大家能從我的理解中對(duì)做banner有新的看法,當(dāng)然,水平有限,不足處,歡迎指正。