本文作者針對Banner的以下幾點做出具體分析:版式,字體,配色,點綴。
一、關于版式在明確主題以及內(nèi)容之后,我們就要根據(jù)主題和內(nèi)容來設計版式,版式就是畫面的整體布局,好的版式能夠清楚的表達核心思路,正確的展示想要給用戶看的東西;大體上排版一般分為兩種:圖文左右排版和文字居中排版。
1、圖文左右排版我們一般設計 Banner 的時候都會使用圖文左右排版,那么為什么會大部分都是使用左右排版呢,這是運用到一個方法論,即尼爾森F視覺模型。
網(wǎng)站制作如何做好Banner設計" alt="網(wǎng)站制作如何做好Banner設計">
因為我們的視覺瀏覽習慣都是從左往右還有從上到下的,所以我們在做 Banner 的時候會經(jīng)常性的選擇使用左右排版,那么使用左圖右文還是左文右圖也是需要根據(jù)主題和內(nèi)容來決定的。
當配圖示意比較模糊的時候,我們使用左文字右圖的形式,強調(diào)文字的吸引力,有一定指導作用。
圖片來自花瓣
這里文字能夠精準地將信息帶給用戶,文字所占比例比圖片多些,這也解釋了為何大部分左文右圖排版的 Banner 都是文字占比大于圖片。
當配圖示意比較明確,同時圖片能夠強調(diào)吸引的時候,我們采用左圖右文字,如下圖:
圖片來自花瓣
使用左圖右文字,也是因為圖片的內(nèi)容更吸引用戶多一些,所以對圖像的品質(zhì)要求更高,精致感品質(zhì)感也有要求,這種類型大多使用在家居,護膚等產(chǎn)品上。
小結:圖文左右排版,以分割排版的方式構圖,畫面有明確的獨立性和引導性,這種方式留白更多,較好的視覺引導和方向使信息更明確,更顯品質(zhì)感。
2、文字居中文字居中的排版多用于電商促銷、公眾號的文章封面等,大多是突出文字的內(nèi)容,比如促銷的折扣,文章的主題等,其余的產(chǎn)品或者圖片都是為了搭配文字做出的氣氛烘托,吸引用戶點擊。
圖片來自花瓣
使用這種方式讓畫面展示規(guī)整穩(wěn)定、醒目大方,視覺更聚焦,信息更集中,在突出主體的同時能使整體畫面具有一定的沖擊力。
小結:文字居中布局對于實物(人,商品,創(chuàng)造形象)要求并不高,文字信息本身的處理要求就會高一點。在確認好主題和內(nèi)容后,我們根據(jù)產(chǎn)品所要突出的重點來決定我們的版式,是要突出文字還是突出產(chǎn)品,突出產(chǎn)品即使用左圖右文字,這種版式對產(chǎn)品的圖片要求比較高;想要突出文字,則可以選擇左文字右圖或者文字居中排版,但都對文字的設計要求比較高。 不確定用什么版式,我們可以在設計的時候不妨多做幾個版本,大膽嘗試。
二、關于文字文案內(nèi)容要高效的傳遞信息,吸引用戶注意力,讓人一下子看到主題,文案中文字的排版要區(qū)分主次,把控好信息層級;使用合適的字體,明確字體適用的場合,同一畫面中字體的使用盡量不要超過三種,過多會顯得雜亂,要使用識別度高的字體。
而 Banner 中常用的字體有三種:襯線體、非襯線體和書法體。
1、襯線體襯線體筆畫有粗細之分,它模仿的是中國古代字體和古代碑文上的字體,簡單且易變形,襯線體能給人古典,經(jīng)典,文藝的感覺,適合用于文藝氣息的家居用品或文娛類的相關宣傳設計上。
以上圖為例:文案內(nèi)容中的“全面淪陷”,讓人一目了然;下面一行的內(nèi)容,更加詳細解釋了上面的主標題。畫面顏色凸顯主題,所以字體變形,使用白色,反而在畫面中更加突出。襯線字體一般推薦使用方正經(jīng)黑簡體、方正俊黑、方正蘭亭顯黑簡體、華文細黑等,使用的時候注意版權問題。
2、非襯線體非襯線體較簡潔,筆畫較粗,很容易產(chǎn)生視覺重點,非襯線字體體現(xiàn)現(xiàn)代、簡約的特性,適合用于蒼勁有力、促銷類的相關設計,吸引用戶注意力,提高Banner點擊率。
圖片來自花瓣
以上圖為例:主副標題區(qū)分清楚,在字體筆畫變形上,結合科技感的氣氛,增加了光的流動感,讓標題不會過于死板。非襯線字體常用的有:漢儀潤圓、方正綜藝簡體、造字工房勁黑、造字工坊版黑、方正蘭亭粗黑、冬青黑體、思源黑體等。
3、書法體書法體源自中國古代,能體現(xiàn)中國文化和揮灑墨水的豪氣,適用于傳統(tǒng)、中國風、意境的文藝主題和金戈鐵馬般的豪邁主題。
圖片來自花瓣
上圖為例:中秋節(jié)是中國的傳統(tǒng)文化,使用書法體能夠?qū)⒄w畫面營造的中國古典風更好的融合起來,書法體推薦李旭科書法、漢儀尚巍手書、葉根友行書繁體等字體 。
小結:不管是使用哪種類型的字體,在制作 Banner 時,我們都需要清楚的知道整張 Banner 所要表達的情緒,從而在字體的設計上也能夠表現(xiàn)出情緒,這樣才能夠更好地融合進 Banner ,進而更好的表達出你想要的主題。
三、關于配色在整個風格中色彩設定出主色調(diào)、輔色調(diào)。主色調(diào)不難理解是在整個畫面中色彩占用最多的顏色,作為輔色調(diào)也是在整個畫面所點綴對比的一個顏色,就好比一個電影劇中一定是有主角和配角。主角的戲份就多一些。配角只是作為整個劇中的點綴輔助而已。
在設計色彩設定中也要根據(jù)行業(yè)屬性配比相關顏色,比如:
黃色代表比較有食欲的顏色、活潑、青春,一般用在食物或者用戶較年輕一點的產(chǎn)品上。
圖片來自花瓣
黑色代表高端、科技,一般用在汽車、智能科技產(chǎn)品和作品及消息發(fā)布上。
圖片來自花瓣
白:代表簡約,清新,素雅,一般是用在飾品、家居、化妝品等,在做整個主視覺畫面的時候第一時間與顏色關聯(lián)。
圖片來自網(wǎng)易嚴選
小結:每一種顏色代表的含義都不同,我們要根據(jù)設定的主題和文案的內(nèi)容,包括品牌色來決定使用哪種顏色最為合適,烘托出想要表達的情緒和氛圍,使整體顏色及風格和諧統(tǒng)一,抓住用戶注意力,吸引用戶點擊,提高轉(zhuǎn)化率。
四、關于點綴點綴元素的存在主要是為了豐富畫面,使畫面看起來不單調(diào)并且更加協(xié)調(diào),從運營的角度上來說,也是為了增加畫面的熱鬧活躍氛圍,給用戶愉悅或刺激感,增加消費者的購買欲望。點綴元素存在的形式是多種多樣的,我們可以基本分為三種:基礎形狀點綴、抽象形狀點綴、賣點提煉點綴。
1、基礎形狀點綴
這種類型的點綴操作起來難度不大,多使用矢量形狀利用漸變色來豐富畫面,建議初次嘗試設計師多嘗試,多注意細節(jié)和練習,就能夠比較好的使用起來,這種類型的點綴多用戶電商促銷設計,目的是為了飽滿視覺,豐滿畫面,擁有較強的視覺沖擊力,能夠吸引用戶注意力,提高 Banner 點擊率。
2、抽象形狀點綴
這種點綴的注意細節(jié)是一般點綴都會比背景深一點,同時整體采用微漸變,適當?shù)碾[去一些邊角,能夠更好的融合進背景里,運用水波紋和小三角等,能夠使 Banner 更年輕,活潑,大多使用在產(chǎn)品定位較年輕的產(chǎn)品或話題上,不適合使用在大品牌上。
圖片來自花瓣
3、賣點提煉點綴:標簽這種點綴比較簡單,就是把產(chǎn)品的賣點提煉出來,使用背景的對比色或者鄰近色將賣點整個突顯出來,此類點綴多使用在年輕女性為主導用戶的產(chǎn)品 Banner 中,比如衣服,首飾、護膚品等,難度系數(shù)不大,難點在于對色彩及賣點提煉的把控。
小結:點綴存在的意義就是在于豐富畫面,使 Banner 整體不單調(diào),更具有趣味性,也能顧更好地烘托主題營造氛圍,有規(guī)律的點綴也能讓 Banner 更具有節(jié)奏感,視覺沖擊力更強。
五、總結我們從版式、文字、配色及點綴等四個方面來說明如何制作出優(yōu)秀的 Banner。
1、版式分為圖文左右排版和文字居中排版,根據(jù)要凸顯的主題來決定用哪種排版;
2、文字有襯線體、非襯線體和書法體三種,每種都有不同的風格,襯線體偏古典和文藝,適用于宣傳,非襯線體蒼勁有力適用于促銷,書法體傳統(tǒng)豪邁,適用于中國風;
3、配色需要根據(jù)產(chǎn)品選擇配色,每種顏色都有自己的情緒,抓住想要表達的情緒,選好配色;
4、點綴分為基礎形狀、抽象形狀和賣點提煉,每種點綴都是豐富畫面,讓整體看起來更加和諧,不同的點綴達到的效果也不同,但始終圍繞主旨就是所有的設計和創(chuàng)意都是圍繞著吸引用戶來進行的,最后我們呈現(xiàn)出來的結果,一定要和諧統(tǒng)一、對比突出、畫面和諧、節(jié)奏韻律,才能讓我們的banner看起來更富有品質(zhì)感。
(鄭重聲明:本文版權歸海鹽社潘團子所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如有侵權,請聯(lián)系我們刪除;如作者信息標記有誤,請聯(lián)系我們修改。)
網(wǎng)頁標題:網(wǎng)站制作如何做好Banner設計
網(wǎng)站URL:http://aaarwkj.com/news39/115539.html
網(wǎng)站建設、網(wǎng)絡推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡營銷seo公司;服務項目有網(wǎng)站制作等
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源:
創(chuàng)新互聯(lián)