中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

細(xì)說(shuō)電商BANNER圖設(shè)計(jì)之色彩的奧秘

2022-06-24    分類(lèi): 網(wǎng)站建設(shè)

寫(xiě)在前面

我們常常會(huì)說(shuō)到做設(shè)計(jì)需要知道三大構(gòu)成(色彩構(gòu)成/平面構(gòu)成/立體構(gòu)成),設(shè)計(jì)又可以分很多個(gè)類(lèi)別,比如網(wǎng)頁(yè)設(shè)計(jì)/UI設(shè)計(jì)/電商設(shè)計(jì)/室內(nèi)設(shè)計(jì)/工業(yè)設(shè)計(jì)等等,那對(duì)于電商設(shè)計(jì)有沒(méi)有專(zhuān)門(mén)的三大構(gòu)成呢?至今好像沒(méi)有看到,所以我想嘗試著梳理一下我腦袋里的知識(shí)點(diǎn),專(zhuān)門(mén)講解一下三大構(gòu)成在電商設(shè)計(jì)中的運(yùn)用,而今天我先從色彩在電商設(shè)計(jì)中的運(yùn)用開(kāi)始說(shuō)起。

內(nèi)容比較多,所以我先給大家列一個(gè)大綱:

一、先了解普遍意義上的色彩是指什么?

二、再回顧一下Banner的組成要素有哪些?

三、Banner的作用是什么?

四、在Banner設(shè)計(jì)中影響到信息傳達(dá)的有哪些因素呢?

五、色彩在Banner設(shè)計(jì)中所起到的作用

六、如何在Banner設(shè)計(jì)中使用色彩

列完大綱后,接下來(lái)我們進(jìn)入正題,一個(gè)一個(gè)知識(shí)點(diǎn)去剖析:

一、先了解普遍意義上的色彩是指什么?

(我講這些理論的時(shí)候大家別睡著了,答應(yīng)我,因?yàn)楹竺鏁?huì)越來(lái)越精彩~~)

簡(jiǎn)單點(diǎn)來(lái)說(shuō),色彩即顏色,顏色可以分成有彩色和五彩色兩大類(lèi),看有彩色主要看色相/純度/明度三個(gè)方面的屬性,無(wú)彩色也就是白色/黑色/各種深淺不同的灰色,也可以說(shuō)無(wú)彩色是飽和度為零色彩。

色相,即可以明確表示顏色色別的名稱(chēng),比如紅橙黃綠藍(lán)靛紫:


ttt201607211

色彩有冷暖之分,我大致用溫度的概念標(biāo)注一下,其中“0”是指中性色,“-0”是指中性偏冷,“+0”是指中性偏暖(這里的溫度是我自己為了具體化冷暖的概念而標(biāo)記的,主要是方便大家理解,所以不用去糾結(jié)這個(gè)數(shù)值準(zhǔn)不準(zhǔn)確哈哈,你明白他們代表很冷/很熱/一般冷/一般熱就好了!~)


ttt201607212

明度,就是指色彩的明亮程度(通俗點(diǎn)講,在某種色彩里添加的白色越多就越明亮,添加的黑色越多就越暗)。


ttt201607213

純度(飽和度),就是指色彩的純凈度,以紅色舉例:


ttt201607214

接下來(lái)我掐指一算,要想做好電商設(shè)計(jì),最基礎(chǔ)學(xué)問(wèn)大的當(dāng)屬Banner設(shè)計(jì)了,所以我們還是從Banner設(shè)計(jì)開(kāi)始說(shuō)起,先回顧一下Banner是由哪些部分組成的。

二、再回顧一下Banner的組成要素有哪些?

Banner組成要素包含4個(gè)方面:文案 、商品/模特、背景、點(diǎn)綴物


ttt201607215

三、Banner的作用作用是什么?

宣傳/展示/廣而告之/準(zhǔn)確傳達(dá)信息

四、那么在Banner設(shè)計(jì)中影響到信息傳達(dá)的有哪些因素呢?

1/整體畫(huà)面的氣質(zhì)是否對(duì)路

2/信息之間的層級(jí)關(guān)系是否準(zhǔn)確

3/是否考量了Banner所投放的環(huán)境

接下來(lái),我們針對(duì)上面3個(gè)因素一個(gè)一個(gè)來(lái)講解:

1/整體的畫(huà)面氣質(zhì)是否對(duì)路

這里指的畫(huà)面氣質(zhì)就是指給人傳遞出一種什么樣的感覺(jué),比如說(shuō)用戶(hù)看了你這個(gè)Banner之后會(huì)感覺(jué)它很熱鬧/很素雅/很高冷/很年輕有活力/很潮/很壓抑/很恐怖/很高貴等等這些感覺(jué),那么下面我舉幾個(gè)例子:

Banner舉例:很熱鬧的畫(huà)面氣質(zhì)(關(guān)鍵詞:低價(jià)促銷(xiāo)/周年慶/節(jié)假日促銷(xiāo)等搞活動(dòng)的性質(zhì))


ttt201607216ttt201607217

大家可能注意到上面兩個(gè)Banner看起來(lái)非常熱鬧喜慶,是比較常規(guī)的熱鬧促銷(xiāo)Banner,除了各種元素形式的動(dòng)力感給畫(huà)面增加了熱鬧感覺(jué)意外,最重要的事大面積的暖色給人熱血沸騰的感覺(jué)。

我們舉個(gè)例子,將這些Banner改變色相,得到下面2張圖:


ttt201607218ttt201607219

總結(jié)觀察:畫(huà)面由暖色變?yōu)槔渖?,?huì)發(fā)現(xiàn)熱鬧的畫(huà)面氣質(zhì)銳減,所以在表現(xiàn)熱鬧氣質(zhì)的Banner設(shè)計(jì)中,除了畫(huà)面形式比較活潑或者動(dòng)感以外,我們也常借助大面積的暖色(紅/橙及附近區(qū)域)來(lái)渲染熱鬧氛圍,讓人感覺(jué)喜慶或者熱血沸騰,然后控制不住就買(mǎi)買(mǎi)買(mǎi)~

Banner 舉例:很素雅 (關(guān)鍵詞:森女系/棉麻類(lèi)/文藝類(lèi)/性冷淡風(fēng))

除了大面積留白給人素雅的感覺(jué)外,畫(huà)面里的顏色都是是比較安靜干凈的灰色調(diào),給人舒適素雅無(wú)欲無(wú)求的感覺(jué),使人感到舒心:


ttt2016072110

假如我給它調(diào)整飽和度,使之更加艷麗:


ttt2016072111

觀察總結(jié):大家感覺(jué)有什么變化沒(méi)?是不是感覺(jué)變年輕活力了?不是那么沉穩(wěn)和素雅了?仿佛一個(gè)平和的35歲女人立馬變成了20歲小姑娘~

下面是幾種常見(jiàn)的素雅的/森女系/文藝范色調(diào)舉例:


ttt2016072112

Banner舉例:很高冷 (關(guān)鍵詞:新品發(fā)布/國(guó)際大牌以及一切渴望表現(xiàn)自己性冷淡和極力想要裝B高冷一回的畫(huà)面。)

畫(huà)面中除去大面積留白以外,色彩上也是比較偏向于灰色調(diào),且基本不會(huì)出現(xiàn)飽和度非常高或者非常跳躍的顏色,淺灰色調(diào)同色系用色居多。


ttt2016072113

大家可以提取顏色看下:


ttt2016072114

Banner舉例: 年輕活力(關(guān)鍵詞:夏季主題/開(kāi)學(xué)主題/校園主題/針對(duì)潮流小年輕的促銷(xiāo)活動(dòng)等等)

色彩豐富多樣,飽和度偏高,用色大膽,在這里,我們就不怕您用色超過(guò)3個(gè)色,只要你敢用想用,多少色都可以(迷之微笑~)。


hbb20160721

大家可以提取顏色看下,其中天藍(lán)色是主色調(diào),用大面積的冷色加上少量的暗色調(diào)作點(diǎn)綴,同時(shí)保持各個(gè)元素?cái)[放方向有秩序不雜亂,才能兼容得下這么多種顏色而使得整個(gè)畫(huà)面看起來(lái)不膩歪:


ttt2016072116

Banner舉例:很潮 (關(guān)鍵詞:潮牌主題/動(dòng)漫主題/街頭hip-hop主題/年輕愛(ài)玩/放蕩不羈愛(ài)自由主題等等)

在這種類(lèi)型氣質(zhì)的Banner設(shè)計(jì)中,除去一些小圖形設(shè)計(jì)使畫(huà)面看起來(lái)比較有設(shè)計(jì)感以外,很重要的一點(diǎn)就是善用大面積的明亮高純度色彩搭配黑色使用,之所以這樣的目的我猜想是因?yàn)檫@種潮牌針對(duì)的是比較年輕但又追求一點(diǎn)特立獨(dú)行或者??岣杏X(jué)的一個(gè)群體,如果全是一些明亮色彩會(huì)給人感覺(jué)比較幼稚和低齡化,加點(diǎn)黑色后就立馬打破了這種印象,仿佛年輕可愛(ài)中又帶了一點(diǎn)??崤c放蕩不羈愛(ài)自由的味道,所謂混搭咯,可以去了解一下街頭文化,哈哈哈~


ttt2016072117

大家可以提取顏色看下:


ttt2016072118

Banner舉例:華麗 (關(guān)鍵詞:上流社會(huì)/歐式/浮夸主題/位高權(quán)重/頒獎(jiǎng)典禮/比較隆重的發(fā)布會(huì)等)

體現(xiàn)華麗高貴主要就是黑色與金色/銀色等金光閃閃的顏色以及與暗色系顏色的搭配(因?yàn)榘瞪到o人感覺(jué)沉穩(wěn)冷靜成熟的感覺(jué),同時(shí)為了不那么沉悶,畫(huà)面中又會(huì)帶點(diǎn)高光或金光閃閃的感覺(jué)顏色搭配)。


ttt2016072119

大家可以提取顏色看下:


ttt2016072120

注意事項(xiàng):這種Banner氣質(zhì)的畫(huà)面千萬(wàn)不要把畫(huà)面堆得太滿(mǎn),一定要記得留白和搭配優(yōu)雅纖細(xì)些的文字(有襯線或者無(wú)襯線字體均可),或者比較有文化底蘊(yùn)的毛筆字,千萬(wàn)不要用五大三粗的文字或者把畫(huà)面塞得滿(mǎn)滿(mǎn)的,為什么要注意這個(gè)?你們想象一下豐腴肥臀的一些滿(mǎn)身穿金戴銀的暴發(fā)戶(hù)風(fēng)格就知道了,自行想象一下畫(huà)面,我就不配圖了(迷之微笑~)

2/信息的層級(jí)關(guān)系

我們知道一個(gè)Banner包含有好幾個(gè)部分,文案/模特或商品/背景/點(diǎn)綴物,而最終他們組合成為一個(gè)Banner,其層級(jí)是存在主次之分的,可以分為下面幾種情況:

(一)以產(chǎn)品或模特為主角(主要突出產(chǎn)品或模特)

(二)以活動(dòng)標(biāo)題為主角

(三)以利益點(diǎn)為主角

而背景和點(diǎn)綴物永遠(yuǎn)不可能是主角,他們只能是配角,同時(shí)在這里顏色不是一個(gè)獨(dú)立的分析要素存在,它應(yīng)該是伴隨著平面的知識(shí)點(diǎn)來(lái)說(shuō),所以這里我也會(huì)順帶一點(diǎn)平面方面的知識(shí)點(diǎn),舉幾個(gè)例子:

(一)以產(chǎn)品或模特為主角(主要突出產(chǎn)品或模特 ),我們有三個(gè)方向可以去發(fā)揮:

(1)讓商品(模特)的顏色與背景顏色絕對(duì)地區(qū)分開(kāi)來(lái),讓它成為天空(畫(huà)面)中最閃亮的一顆星~也就是我們說(shuō)的色彩對(duì)比,色彩對(duì)比又包含三種:明度對(duì)比/飽和度對(duì)比/色相對(duì)比,假設(shè)下圖中的圓就是商品或模特,舉個(gè)例子:


ttt2016072121

我們?cè)偃ド匆幌聦?duì)比的效果,如下圖(去色是我們常用的一種查看信息是否突出的方法,令外還有一種距離觀察法查看對(duì)比效果,比如你也可以離屏幕站遠(yuǎn)一點(diǎn)查看,或者人保持不動(dòng)縮小畫(huà)布查看):


ttt2016072122

這樣看,哪個(gè)對(duì)比效果好些?是不是一目了然了?不過(guò)還是要說(shuō)明一點(diǎn),明度飽和度里任何一項(xiàng)要素發(fā)生改變,其他要素也是跟著改變的,比如說(shuō)你增加了一個(gè)顏色的明度,代表你在這個(gè)顏色里增加了白色,那么相對(duì)應(yīng)的這個(gè)顏色的純度飽和度肯定也就下降了,不知道我說(shuō)這些你們明白了沒(méi)有?(默默點(diǎn)根煙~惆悵臉~)

喔對(duì)了,我還要在這里繼續(xù)插一句嘴:色彩對(duì)比不會(huì)單獨(dú)存在,它的運(yùn)用永遠(yuǎn)是依附于下面兩種方式存在的(增大商品模特面積或者增加商品模特?cái)?shù)量):

(2)通過(guò)留白或者大小對(duì)比的方式讓商品(模特)體積或面積足夠大。


ttt2016072123

(3)通過(guò)一定的擺放規(guī)律,讓商品(模特)數(shù)量足夠多,因?yàn)閿?shù)量多了總面積自然也就大了嘛~。


ttt2016072124

(二)以活動(dòng)標(biāo)題為主角

跟上面的道理類(lèi)似,可以運(yùn)用增大標(biāo)題面積或者同時(shí)結(jié)合色彩對(duì)比的方式使標(biāo)題突出成為主角:


ttt2016072125

(三)以利益點(diǎn)為主角

道理同上(有時(shí)候我們做Banner會(huì)直接用利益點(diǎn)作為大標(biāo)題,這種就會(huì)使Banner的低價(jià)促銷(xiāo)的氣息會(huì)更濃烈些)


ttt2016072126ttt2016072127

總結(jié)來(lái)說(shuō),但我們講色彩的時(shí)候,其實(shí)也是在講平面構(gòu)成,當(dāng)我們?cè)谥v色彩三要素(明度/純度/色相)的其中一項(xiàng)的時(shí)候,其實(shí)也意味著在同時(shí)考慮其他要素,因?yàn)樯什粫?huì)單獨(dú)存在,色彩要素也不會(huì)單獨(dú)存在(我重復(fù)這么多遍,也是操碎了心呢~~)。

3/是否考量了Banner所投放的環(huán)境

當(dāng)我們講到環(huán)境的時(shí)候,往往會(huì)講到外部環(huán)境和內(nèi)部環(huán)境,也就是站在全局去考慮問(wèn)題和站在自我的角度去考慮問(wèn)題,如果你是要在某平臺(tái)投放 Banner,那么這個(gè)平臺(tái)對(duì)你來(lái)說(shuō)就是大環(huán)境,具體到你投放的那一小塊Banner位置就是小環(huán)境。

(1)從平臺(tái)設(shè)計(jì)師的角度出發(fā),她肯定是希望你所有的Banner放在這個(gè)平臺(tái)頁(yè)面里,整體是融合的,不突兀的 ,比如下面的萬(wàn)件好禮免費(fèi)送和專(zhuān)屬活動(dòng)這塊的小Banner,用不同色相表示不同會(huì)場(chǎng)或主題,但是每一個(gè)色彩的明度飽和度是相似的,設(shè)計(jì)形式也一樣都有自己的規(guī)范,這就給人整體統(tǒng)一協(xié)調(diào)的感覺(jué):


ttt2016072128

(2)那從商家的角度出發(fā),商家當(dāng)然是希望 自家的Banner圖是最突出的,最亮眼的,最容易被用戶(hù)發(fā)現(xiàn)的,所以設(shè)計(jì)師需要把自家的圖片設(shè)計(jì)得讓人眼前一亮,脫穎而出,這個(gè)又要回到前面如何運(yùn)用對(duì)比去突出某個(gè)信息的問(wèn)題了,不清楚的話(huà)可以回頭看看上面那個(gè)關(guān)于信息層級(jí)的知識(shí)點(diǎn):


ttt2016072129

比如,上面這些商品圖,我用距離觀察法,第一眼就看到了左下角的這個(gè)巧克力了,為什么呢?因?yàn)橹車(chē)膱D片基本是白底或者比較明亮的顏色,而只有他使用了深色背景,明暗對(duì)比之后,一下子就出來(lái)了(你也可以舉一反三去運(yùn)用,get到了嗎?)

其實(shí)無(wú)論是商家/企業(yè)還是個(gè)人,都是需要考慮這種Banner投放的外部環(huán)境和內(nèi)部環(huán)境的,除非你是在平臺(tái)工作的設(shè)計(jì)師,很多時(shí)候我們更多的是需要站在個(gè)人利益的角度去考慮問(wèn)題,我們需要讓自己的圖片更易被人發(fā)現(xiàn)。

所以我們會(huì)看到,某8design的各種培訓(xùn)廣告(我故意模糊了它們,因?yàn)椴幌氪驈V告~),永遠(yuǎn)都是花花綠綠,爭(zhēng)相斗艷,但殊不知,當(dāng)別人都花花綠綠的時(shí)候,你不用太花枝招展反而更易突出:


ttt2016072130

所以我們會(huì)想到,設(shè)計(jì)師在發(fā)布自己的設(shè)計(jì)作品到設(shè)計(jì)論壇或網(wǎng)站的時(shí)候,不妨先去看下周?chē)h(huán)境都是怎么樣的,再去做自己的展示Banner圖,這樣有利于使自己的作品得到更多的展現(xiàn)機(jī)會(huì),比如下面這個(gè)是我昨天在站酷首頁(yè)截的圖,大家是不是跟我一樣第一眼就會(huì)看到的是那個(gè)玫紅色的Banner圖片?而其他的都只會(huì)匆匆?guī)н^(guò),因?yàn)樵谶@個(gè)環(huán)境里,玫紅色是最突出的一種顏色(事實(shí)證明,除去dribble這個(gè)詞比較知名以外,玫紅色封面Banner圖的閱讀數(shù)確實(shí)也遠(yuǎn)超其他的作品,你們get到了嘛?):


ttt2016072131

五、色彩在Banner設(shè)計(jì)中所起到的作用

1/點(diǎn)綴作用(渲染氛圍用)

2/突出主體(梳理信息層級(jí))

3/平衡畫(huà)面(整體視覺(jué)協(xié)調(diào))

4延續(xù)風(fēng)格(涉及到風(fēng)格統(tǒng)一調(diào)性的時(shí)候)

5/塑造畫(huà)面氣質(zhì)(傳遞恰當(dāng)?shù)那榫w給用戶(hù))

就以上五種作用,我在下面會(huì)分別舉例說(shuō)明:

1/點(diǎn)綴作用(渲染氛圍用)

當(dāng)你做了一個(gè)冷色調(diào)的頁(yè)面拿給你的主管或需求人看,他說(shuō)畫(huà)面太冷清的時(shí)候,而你又懶得改顏色改形式等等,總之你非常懶不想動(dòng),那么不妨試下下面這樣周?chē)c(diǎn)綴些暖色的方式(色彩依附的形狀和大小面積你自己斟酌咯~只需要記住點(diǎn)綴物是配角,他是烘托氣氛用的,永遠(yuǎn)不要搶了主角的風(fēng)頭,要不然導(dǎo)演不給你這配角安排角色了,怕不怕?)


ttt2016072132

當(dāng)你明明做了一個(gè)自認(rèn)為非常熱鬧促銷(xiāo)的頁(yè)面后,你們主管或者需求人仍然覺(jué)得畫(huà)面太冷清不夠熱鬧而你又不想大改動(dòng)的時(shí)候怎么辦?道理同上,Give him or her some color to see see(迷之微笑~)。


ttt2016072133

2/突出主體(梳理信息層級(jí))

這個(gè)通過(guò)色彩對(duì)比來(lái)突出信息層級(jí)的作用其實(shí)我在前面的知識(shí)點(diǎn)里已經(jīng)講了哦,翻回到前面去看下吧,我就不繼續(xù)說(shuō)一遍了。


ttt2016072134

3/平衡畫(huà)面(漸變色使得整體視覺(jué)協(xié)調(diào))

講這個(gè)知識(shí)點(diǎn)的之前,我覺(jué)得又有必要插幾句嘴了,先要了解一下面幾個(gè)概念:

鄰接色相對(duì)比:色相環(huán)上相鄰的二至三色對(duì)比,色相距離大約30度左右,為弱對(duì)比類(lèi)型

類(lèi)似色對(duì)比:色相對(duì)比距離約60度左右,為較弱對(duì)比類(lèi)型

中差色對(duì)比:色相對(duì)比距離約90度左右,為中對(duì)比類(lèi)型

對(duì)比色對(duì)比:色相對(duì)比距離約120度左右,為強(qiáng)對(duì)比類(lèi)型

補(bǔ)色對(duì)比:色相對(duì)比距離180度,為極端對(duì)比類(lèi)型


ttt2016072135

我們有時(shí)候會(huì)看到一些Banner強(qiáng)調(diào)的是整體畫(huà)面的協(xié)調(diào)感覺(jué),并不會(huì)重點(diǎn)去突出強(qiáng)調(diào)什么,整個(gè)畫(huà)面給人感覺(jué)特別舒服,那是因?yàn)樗麄兺捎玫氖穷?lèi)似色對(duì)比或者鄰近色對(duì)比,亦或者是采用相似明度和飽和度的不同色相的漸變調(diào)和。

Banner舉例(如下圖Banner給人感覺(jué)是整體畫(huà)面非常柔美協(xié)調(diào)統(tǒng)一,強(qiáng)調(diào)統(tǒng)一感覺(jué)):


ttt2016072136ttt2016072137

當(dāng)然,以上也可以結(jié)合起來(lái)運(yùn)用(運(yùn)用漸變色+對(duì)比)


ttt2016072138

4/延續(xù)風(fēng)格(涉及到風(fēng)格統(tǒng)一調(diào)性的時(shí)候)

通過(guò)色彩來(lái)延續(xù)風(fēng)格的作用往往在平臺(tái)做一些比較大型的活動(dòng),涉及到多個(gè)不同品類(lèi)不同分會(huì)場(chǎng)的時(shí)候會(huì)運(yùn)用到,我看到一些店鋪電商品牌也慢慢規(guī)范化了之后也會(huì)用到這種方式以保持品牌統(tǒng)一調(diào)性性,也就是保持設(shè)計(jì)風(fēng)格一致,色彩的明度純度接近,只是改變色相,以不同的色相代替不同的品類(lèi)或者分會(huì)場(chǎng)來(lái)設(shè)計(jì)Banner圖,如下圖所示:


ttt2016072139ttt2016072140

5/塑造畫(huà)面氣質(zhì)(傳遞恰當(dāng)?shù)那榫w給用戶(hù))

比如我們前面提到的很活力/很可愛(ài)/很高貴/很素雅等等,我這里也不繼續(xù)描述了哦,文章開(kāi)頭都有提到過(guò)的。


ttt2016072119

(華麗高貴)


ttt2016072113

(高冷大牌)


ttt2016072117

(很潮)


hbb20160721

(年輕活力)


ttt2016072110

(森女系素雅)


ttt201607216

(熱鬧促銷(xiāo))

六、如何在Banner設(shè)計(jì)中使用色彩

色彩不會(huì)獨(dú)立存在,他必定是依附于其它構(gòu)成和表現(xiàn)形式而存在,比如平面構(gòu)成、立體構(gòu)成等,所以我將從下面幾個(gè)方面來(lái)論述:

(1)當(dāng)色彩運(yùn)用在不同的面積

(2)當(dāng)色彩運(yùn)用于不同的形狀

(3)當(dāng)色彩運(yùn)用在不同的肌理

(4)當(dāng)色彩運(yùn)用于不同的色彩

(5)當(dāng)色彩運(yùn)用于不同的主題

(6)當(dāng)色彩運(yùn)用于不同的環(huán)境

因?yàn)槲冶容^喜歡紅色(一個(gè)非常熱烈的顏色,跟我的內(nèi)心一樣炙熱,跟我的頭像一樣紅火),所以我就拿紅色來(lái)舉個(gè)栗子吧,其他顏色的運(yùn)用道理是一樣的:


ttt2016072141

(做設(shè)計(jì)的面條頭像,咳咳~~)

(1)當(dāng)紅色運(yùn)用在不同的面積,他的視覺(jué)感受是很不一樣的,當(dāng)外部背景尺寸不變,紅色區(qū)域面積越大越讓人感覺(jué)眼睛發(fā)脹,仿佛都要跑到你胸(眼)前一樣,這就是近大遠(yuǎn)小的道理咯。


ttt2016072142

(1/2/3紅色區(qū)域哪個(gè)更吸引你眼球?誰(shuí)更讓你躁動(dòng)不安?)

Banner舉例(看紅色區(qū)域):


ttt2016072144ttt2016072143

(2)當(dāng)紅色運(yùn)用于不同的形狀,個(gè)形狀讓你感覺(jué)最不穩(wěn)定?哪個(gè)形狀讓你感覺(jué)更活躍?哪個(gè)形狀讓你感覺(jué)更時(shí)尚?


ttt2016072145

(3最不穩(wěn)定,1最規(guī)矩,5最不規(guī)則,1-9都可以很時(shí)尚,主要在于如何去搭配其他元素)

Banner舉例(看紅色區(qū)域):

(3)當(dāng)他運(yùn)用于不同的肌理,看下圖所示,紅色色塊疊加肌理后和沒(méi)疊加肌理對(duì)比有什么不同?紅色塊疊加不同肌理后又有什么不同?(任何你能想到的物體都可以疊加視作肌理,比如人/圖片/文字/字母/發(fā)絲/各種形狀/軟硬粗糙或平滑材質(zhì)等等)


ttt2016072151

(圖6是沒(méi)有疊加任何肌理的紅色,顯得更加平淡,其他紅色塊疊加了肌理后使得畫(huà)面更佳豐富,給紅色增加了更多感情色彩,或是活潑或是怪異或是熱鬧等等,只要你能想到的都可以去嘗試)

Banner舉例(看紅色區(qū)域):


ttt2016072154ttt2016072152ttt2016072155ttt2016072153

(4)當(dāng)紅色運(yùn)用于不同的色彩 ,大家會(huì)看到相同面積的紅色圓放在不同的色彩上出現(xiàn)了大小不一或明暗不一的錯(cuò)覺(jué),因?yàn)榧t色是暖色,所以根據(jù)冷暖對(duì)比,紅色放在冷色或中性色 (黃色綠色)上可以比較突出,根據(jù)色相對(duì)比,紅色屬于有彩色,有彩色放在無(wú)彩色(黑白灰)上也可以比較突出,但是紅色放在鄰近色(比如偏冷的紫色和偏暖的橙紅色)上就顯得特別弱,因?yàn)樯嗵咏恕?/p>
ttt2016072156

Banner舉例(看紅色區(qū)域運(yùn)用在不同顏色的背景上):


ttt2016072157ttt2016072159ttt2016072160ttt2016072161ttt2016072162ttt2016072158

(5)當(dāng)紅色運(yùn)用于不同的環(huán)境,前面我們前面講了,環(huán)境分為外部大環(huán)境和內(nèi)部環(huán)境,有人所站的角度是要保證平臺(tái)上所有Banner顏色整體看和諧統(tǒng)一,雨露均沾,而有的人所站的角度是要保證自己的Banner圖是最突出最吸引眼球的,前者為了和諧統(tǒng)一 ,后者是為了競(jìng)爭(zhēng)為了突出自己 (講到環(huán)境其實(shí)也就是前面幾種情況的綜合講解和考慮,即色彩/形狀/肌理/面積等的結(jié)合使用才構(gòu)成了所謂的環(huán)境),比如:

當(dāng)紅色色塊放置在純度明度相近的不同色相的色塊里,它是和諧的融入的整體的:


ttt2016072163

當(dāng)紅色色塊放置在鄰近色色塊里,它跟整體環(huán)境看起來(lái)也是比較和諧統(tǒng)一不突兀的:


ttt2016072164

當(dāng)同樣是紅色,但是她的形狀/面積大小和其他的不一樣,那么她是會(huì)比較突出的,也就是所謂的特異:


ttt2016072165

當(dāng)同樣面積的色塊,只有一塊是有彩色紅色,其他都為黑白灰無(wú)彩色,那么在這個(gè)環(huán)境里,那么紅色塊是最突出的:


ttt2016072166

當(dāng)同樣面積的色塊,只有一塊是暖色紅色,其他都為冷色,那么在這個(gè)環(huán)境里,那么暖色系的紅色塊是最突出的,也就是冷暖對(duì)比:


ttt2016072167

Banner舉例(看紅色區(qū)域):


ttt2016072168

(因?yàn)槊鞫燃兌冉咏脑?,紅色Banner在這個(gè)環(huán)境里還算比較融入的,雖然周?chē)渖礏anner過(guò)多)


ttt2016072169

(調(diào)整了飽和度和明度之后,紅色Banner在這個(gè)環(huán)境里變得非常突出,變?yōu)榱酥鹘?

總結(jié)回顧一下上面講的幾點(diǎn):

一、先了解普遍意義上的色彩是指什么?

二、再回顧一下Banner的組成要素有哪些?

三、Banner的作用作用是什么?

四、在Banner設(shè)計(jì)中影響到信息傳達(dá)的有哪些因素呢?

五、色彩在Banner設(shè)計(jì)中所起到的作用

六、如何在Banner設(shè)計(jì)中使用色彩

以上我就寫(xiě)到這里了,我們需要知道色彩是一種情緒的表達(dá),也許要學(xué)會(huì)舉一反三(比如上面我只舉了紅色的例子,其他顏色可以以此類(lèi)推無(wú)論),另外無(wú)論是有彩色還是無(wú)彩色它們都不會(huì)獨(dú)立存在,他必定是依附于其它表現(xiàn)形式而存在,比如與平面構(gòu)成、立體構(gòu)成結(jié)合運(yùn)用,下期我們?cè)倮^續(xù)談電商Banner圖設(shè)計(jì)之平面構(gòu)成的奧秘(時(shí)間待定,哈哈~)

當(dāng)前題目:細(xì)說(shuō)電商BANNER圖設(shè)計(jì)之色彩的奧秘
當(dāng)前網(wǎng)址:http://www.rwnh.cn/news/171142.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制網(wǎng)站、ChatGPT、Google、網(wǎng)站排名、移動(dòng)網(wǎng)站建設(shè)虛擬主機(jī)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都seo排名網(wǎng)站優(yōu)化
固原市| 大渡口区| 岚皋县| 芦山县| 东辽县| 东台市| 外汇| 普兰店市| 哈巴河县| 泾源县| 泉州市| 石台县| 左贡县| 丽江市| 海门市| 双流县| 林芝县| 鹤峰县| 萍乡市| 太谷县| 武胜县| 定南县| 沐川县| 东丽区| 高清| 南岸区| 醴陵市| 淮北市| 井冈山市| 博湖县| 韶山市| 金寨县| 多伦县| 新兴县| 牡丹江市| 莎车县| 滕州市| 海宁市| 敖汉旗| 嘉兴市| 会泽县|