2013-1-20 藍藍設(shè)計的小編
轉(zhuǎn)載藍藍設(shè)計( m.88yangsc.com )是一家專注而深入的設(shè)計機構(gòu) ,為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
來源: 微博UDC 原創(chuàng)
如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里
關(guān)于Banner的設(shè)計,相信已經(jīng)有很多人都看過這方面經(jīng)驗的分享了,我來公司也做過了一些Banner的設(shè)計,那在這其中通過不斷的學(xué)習(xí)、實踐積累了自己的一些小小經(jīng)驗和方法,下面給大家淺淺的分享下我總結(jié)的Banner設(shè)計經(jīng)驗。如有錯誤,盡管拍磚,小女子虛心請教學(xué)習(xí)。
Banner設(shè)計其實是我們接觸互聯(lián)網(wǎng)工作后,最常見一種工作。那么Banner到底是什么呢?Banner的核心使命其實是吸引用戶關(guān)注,然后被點擊。他的主旨就是主題明確,突出關(guān)鍵內(nèi)容,抓住用戶眼球。一個Banner他是由“背景、主視覺和標題文字”三部分組成,在我剛剛接到需求的時候,我首先分析他的重點詞、字,想要表達什么,分析好了后可以在紙上畫下草稿,在大腦里有個大概的視覺效果,想法多的話可以畫幾版不一樣的,最后根據(jù)草稿定一個定稿,接下來就可以找素材著手做了。在做期間,還要注意整體的美觀,讓人看起來舒服。
下面從這三部分逐一給大家分享下。
我們畫畫的同學(xué)可能都知道,一個畫面不可能都面面俱到,重點的需要細致刻畫,有的一筆帶過即可。設(shè)計一個Banner有時候就像畫畫似的,首先要有大的環(huán)境,那Banner的背景就好比大環(huán)境,其實主要是起到襯托、烘托氣氛的作用。一個新需求過來,首先我們考慮要營造一個什么樣的環(huán)境,什么樣的氣氛,是歡快的、悲傷的、可愛的還是…比如過年,可能就用紅橙色,比如兒童類的,顏色上就要純一點,活潑點等等。
但是需要注意一點,背景不能太花,否則會影響整體的一個可讀識性,簡單,清晰即可。
Banner中的主視覺要清楚,符合主題,元素不可太多,否則看起來跟人感覺就會亂。有的人在做時只要是有地,就全放滿,其實頁面適當?shù)?ldquo;留白”也是提升畫面品質(zhì)的一個好方法。視覺元素不論是人物,還是其他,一定要清晰,在我們找素材的時候也要找像素質(zhì)量高的,我一般會去站酷、昵圖網(wǎng)、花瓣或者直接google搜,不要太多。還有一點注意的是不可盜用他人的作品,頭像等等。大家都懂的:)
下面的這個Banner看起來就比較亂,東西太多,想表達的也太多,這時候需要用戶去花時間思考它想告訴我們什么,而往往這時候用戶是不愿意是思考的,一是畫面不知道他要表達什么,二是整體上沒有吸引住用戶的眼睛,這種情況下這個Banner是做到比較失敗的。
標題文字非常重要,是整個Banner的主題,重點文字一定要在背景中突出出來,不論用顏色對比、放大、變形設(shè)計還是即便做立體效果等等。(這里我分享一個經(jīng)驗,就是在頁面上新建一個黑色的圖層,樣式改成飽和度,整體上成黑白的效果后一眼就能看出來了)
這個Banner標題用了描邊和投影,從背景中出來了,但還是看起來不舒服,主要是他的文字有用曲線、斜線的方式,讓人不禁會順著字的排版順讀下去,他這里面不同方向的斜線用的還比較多,這種方式看多了就會比較累,沒有形成統(tǒng)一。
這個Banner看起來比較清新,沒有過多的元素,但重點是文字,由于背景用的淺色,文字也用的淺色,用戶是很難看出來的,影響用戶的閱讀性。
1.畫面整體統(tǒng)一,顏色搭配的看起來舒服;
2.頁面元素要以組為單位;(如文字和文字之間的間距不要過大,讓人看起來是一組)
3.采用吸引力的用語,或者添加“火速參與”等刺激性的詞語按鈕等,讓用戶在最短的時間內(nèi)有去點擊他的欲望。
4.主次對比分明,合理安排頁面布局;
5.輸出K數(shù)不宜過大,否則加載速度會慢;
6.最后最重要的一點是,前期工作一定要與需求方溝通好,要知道,在工作中,溝通是非常重要的一件事情。
以上是自己在平時工作中總結(jié)的一點點小經(jīng)驗吧,希望對初學(xué)設(shè)計的同學(xué)來說有點幫助,還望大師們多多指點,我會虛心學(xué)習(xí)。有部分圖是從網(wǎng)上找的,在這里借用下,如果侵犯您的權(quán)了,請告知下。謝謝。
藍藍設(shè)計的小編 http://m.88yangsc.com