今天給大家講一下關(guān)于平面構(gòu)成的,包括「平面構(gòu)成的含義,電商banner的組成元素,如何運(yùn)用平面構(gòu)成」等等,都是干貨。
在講之前,我先給大家列一個(gè)內(nèi)容大綱:
一、平面構(gòu)成的含義是什么?
二、電商Banner圖是由什么組成的?
三、我們?cè)撊绾卧贐anner圖設(shè)計(jì)中運(yùn)用平面構(gòu)成呢?
四、平面構(gòu)成之于電商Banner圖的意義是什么?
五、總結(jié)
注:前半部分是給大家講解的基礎(chǔ)知識(shí),后半部分是運(yùn)用這些基礎(chǔ)知識(shí)結(jié)合實(shí)例講解,所以建議從頭到位耐心看完哦,需要些時(shí)間消化(經(jīng)濟(jì)基礎(chǔ)決定上層建筑嘛,前面不看后面也就看不懂了),接下來(lái)我們一個(gè)個(gè)問(wèn)題來(lái)解剖:
一、平面構(gòu)成的含義是什么?
百度百科的解釋是:平面構(gòu)成是視覺元素在二次元的平面上,按照美的視覺效果,力學(xué)的原理,進(jìn)行編排和組合,它是以理性和邏輯推理來(lái)創(chuàng)造形象、研究形象與形象之間的排列的方法,是理性與感性相結(jié)合的產(chǎn)物。
而我的理解是:平面構(gòu)成主要是在二維空間運(yùn)用點(diǎn)、線、面結(jié)合一定的規(guī)律所形成的一種視覺語(yǔ)言,他可以是抽象的,也可以是具象的,可以是感性的,也可以是理性的,同時(shí)它也不是獨(dú)立存在的,而是伴隨著色彩/肌理/光影等而存在的?;旧鲜篱g萬(wàn)物,所有我們接觸到的或無(wú)法接觸到的,看得見的或看不見的事物里都有平面構(gòu)成的運(yùn)用和身影。
二、電商Banner圖是由什么組成的?
Banner組成要素包含4個(gè)方面:文案 、商品/模特、背景、點(diǎn)綴物(可有可無(wú))。
而我在之前反復(fù)強(qiáng)調(diào)過(guò)的,Banner的作用是:宣傳/展示/廣而告之/準(zhǔn)確傳達(dá)信息。
三、我們?cè)撊绾卧贐anner圖設(shè)計(jì)中運(yùn)用平面構(gòu)成呢?
在前面我們提到,平面構(gòu)成主要是在二維空間運(yùn)用點(diǎn)、線、面結(jié)合一定的規(guī)律所形成的一種視覺語(yǔ)言,而Banner中的所有元素(文案/商品或模特/背景/點(diǎn)綴物)其實(shí)都可以看作是平面構(gòu)成里的點(diǎn)線面這些構(gòu)成元素。
那么,接下來(lái)我們就需要了解3個(gè)有關(guān)平面構(gòu)成的概念了:
1、元素與元素之間的排列關(guān)系
2、所有元素在一起所體現(xiàn)的構(gòu)成形式
3、了解幾個(gè)常用的平面術(shù)語(yǔ)
接下來(lái),我們分別了解下這幾個(gè)概念:
1、元素與元素之間的排列關(guān)系
它們之間的排列有下面這么幾種:分離/相切/重疊/透疊/結(jié)合/減缺/差疊/重疊。
分離:形與形之間不接觸,有一定距離。
相切:形與形之間的邊緣正好相切。
重疊:形與形之間覆疊關(guān)系,由此產(chǎn)生上下前后的空間關(guān)系。
透疊:形與形有透明性的相互交疊,但不產(chǎn)生上下前后的空間關(guān)系。
結(jié)合:形與形相互結(jié)合成較大的新形狀。
減缺:形與形相互覆疊,覆疊的形狀被剪掉。
差疊:形與形相互交疊,交疊的部分產(chǎn)生一個(gè)新的形。
重合:形與形相互重合,變?yōu)橐惑w。
2、所有元素在一起所體現(xiàn)的構(gòu)成形式
從所有元素(點(diǎn)線面)整體看,其構(gòu)成形式主要有重復(fù)、近似、漸變、變異、對(duì)比、集結(jié)、發(fā)射、特異、空間與矛盾空間、分割、肌理及錯(cuò)視等等。
下面我們分別來(lái)舉例說(shuō)明:
(1)重復(fù),指在同一設(shè)計(jì)中,相同的形象出現(xiàn)過(guò)兩次以上,重復(fù)是設(shè)計(jì)中比較常用的手法,以加強(qiáng)給人的印象,造成有規(guī)律的節(jié)奏感,使畫面統(tǒng)一。所謂相同,在重復(fù)的構(gòu)成中主要是指形狀、顏色、大小等方面的相同。比如:
1.形狀的重復(fù)
2.骨骼的重復(fù)
3.大小的重復(fù)
4.色彩的重復(fù)
5.肌理的重復(fù)
6.方向的重復(fù)
(2)近似,近似指的是在形狀、大小、色彩、肌理等方面有著共同特征,它表現(xiàn)了在統(tǒng)一中呈現(xiàn)生動(dòng)變化的效果。近似的程度可大可小,如果近似的程度大就產(chǎn)生了重復(fù)感。近似程度小就會(huì)破壞統(tǒng)一。比如:
1.形狀的近似
2.骨骼的近似
(3)漸變,是我常常聽說(shuō)的一種效果,在自然界中能親身體驗(yàn)到,在行駛的道路上我們會(huì)感到樹木由近到遠(yuǎn)、由大到小的漸變。比如:
1.形狀的漸變
2.方向的漸變
3.位置的漸變
4.大小的漸變
5.色彩的漸變
6.骨骼的漸變
7.光影的漸變
(4)對(duì)比,有時(shí)候是形態(tài)上的對(duì)比,有時(shí)是色彩和質(zhì)感的對(duì)比。對(duì)比可產(chǎn)生明朗、肯定、強(qiáng)烈的視覺效果,給人深刻的印象。比如:
1.形狀的對(duì)比
2.大小的對(duì)比
3.色彩的對(duì)比
4.肌理的對(duì)比
5.位置的對(duì)比
6.重心的對(duì)比
7.空間的對(duì)比
8.虛實(shí)的對(duì)比
(5)密集, 密集在設(shè)計(jì)中是一種常用的組織圖面的手法,基本形在整個(gè)構(gòu)圖中可自由散布,有疏有密。最疏或最密的地方常常成為整個(gè)設(shè)計(jì)的視覺焦點(diǎn),他其實(shí)也是對(duì)比的一種情況,越密集的地方給人感覺距離越遠(yuǎn),反之越近。
1.點(diǎn)的密集
2.線的密集
3.面的密集
(6)發(fā)射,是一種常見的自然現(xiàn)象,太陽(yáng)四射的光芒就是發(fā)射的。發(fā)射具有方向的規(guī)律性,發(fā)射中心為最重要的視覺焦點(diǎn),所有的形象均向中心集中,或由中心散開,有時(shí)可造成光學(xué)動(dòng)感,會(huì)產(chǎn)生爆炸的感覺,有強(qiáng)烈的視覺效果。
1.中心點(diǎn)的發(fā)射
2.螺旋式的發(fā)射
3.同心式的發(fā)射
(7)特異,是指構(gòu)成要素在有次序的關(guān)系里,有意違反次序,使少數(shù)個(gè)別的要素顯得突出,以打破規(guī)律性。
1.形狀的特異
2.大小的特異
3.色彩的特異
4.方向的特異
5.肌理的特異
(8)空間
利用大?。罕热缃筮h(yuǎn)小。
利用重疊:前后/上下等關(guān)系。
利用陰影:使物體具有立體感/空間感。
利用疏密:比如間隔越小,越密集,感覺就越遠(yuǎn)。
利用透視:平行線由寬到窄。
利用色彩:冷色遠(yuǎn)離,暖色靠近。
利用肌理:越粗糙越近,越細(xì)膩越遠(yuǎn)。
矛盾空間:真實(shí)不存在的空間,假想的。
虛實(shí)關(guān)系:遠(yuǎn)景/中景/近景。
(9)分割,把整體分成小的部分。比如:
1.等形分割
2.自由分割
3.比例與數(shù)量
(10)肌理,又稱質(zhì)感,由于物體的材料不同,表面的排列、組織、構(gòu)造等不同,因而產(chǎn)生粗糙感、光滑、軟硬感。比如:
1.筆觸的變化
2.凹凸不平的肌理
3.噴繪/染
4.自帶的紋理效果
3、了解幾個(gè)常用的平面術(shù)語(yǔ)
和諧統(tǒng)一/對(duì)比突出/對(duì)稱/畫面平衡/視覺重心/節(jié)奏韻律
和諧統(tǒng)一:
元素與元素之間,或所有元素構(gòu)成的整體是一種協(xié)調(diào)的關(guān)系,比如大?。伾L(fēng)格等的協(xié)調(diào)。
對(duì)比突出:
即把2個(gè)質(zhì)或者量反差很大的元素放在一起,使人感覺主體鮮明突出,整體又活躍而統(tǒng)一,比如大?。瘮?shù)量/色彩/形狀的對(duì)比。
對(duì)稱:
假設(shè)在一個(gè)圖形中間畫一條垂直或水平線后,畫面的左右或上下2邊是可以完全重合的,則我們稱之為對(duì)稱。
畫面平衡:
即元素與元素之間,元素與整體之間的大小/形狀/數(shù)量/色彩/材質(zhì)等的分布與視覺上的平衡。
視覺重心:
通過(guò)對(duì)畫面中元素的數(shù)量/顏色/位置/大?。馁|(zhì)等進(jìn)行處理,畫面中所出現(xiàn)的視覺焦點(diǎn)。
節(jié)奏韻律
畫面中的一種或多種元素按一定的規(guī)律排列,會(huì)產(chǎn)生音樂(lè)一般的旋律感。
四、平面構(gòu)成之于電商Banner圖的意義是什么?
Banner中的所有元素其實(shí)都相當(dāng)于平面構(gòu)成里的點(diǎn)或線或面,而所有元素所組成的Banner畫面其實(shí)又是一種情緒和信息的表達(dá),所以我們可以從下面4個(gè)方面去理解這個(gè)問(wèn)題:
(1)從活動(dòng)主題的角度:
(2)從信息層級(jí)的角度:
(3)從品牌調(diào)性的角度
(4)從視覺美感的角度:
(1)從活動(dòng)主題的角度:
當(dāng)我們拿到一個(gè)設(shè)計(jì)需求的時(shí)候,都會(huì)需要確定他的設(shè)計(jì)風(fēng)格,而這個(gè)風(fēng)格怎么來(lái)確定呢?就是要明白他的定位以及服務(wù)的人群是誰(shuí),了解他們的興趣愛好,同時(shí)我們腦袋里會(huì)出現(xiàn)下面這幾個(gè)關(guān)鍵詞:熱鬧促銷/年輕活力/高冷大牌/時(shí)尚個(gè)性/規(guī)矩保守等
(2)從信息層級(jí)的角度:
當(dāng)我們?cè)谧鲆粋€(gè)banner的時(shí)候,如果沒(méi)有特別的要求,其實(shí)我們是有很多個(gè)方向選擇的,首先問(wèn)下自己你是想要突出什么信息呢?是突出商品呢?還是突出文字呢?還是突出整體的氛圍呢?還是強(qiáng)調(diào)整體的協(xié)調(diào)感呢?還是說(shuō)強(qiáng)調(diào)品牌呢?
一般來(lái)說(shuō),一個(gè)好的Banner首先是要保證信息傳達(dá)準(zhǔn)確,然后再需要保證畫面的協(xié)調(diào)感和氛圍的。
(3)從品牌調(diào)性的角度
關(guān)于品牌這塊,可能是很多小商家目前不太重視,也覺得自己用不上的,但是各大電商平臺(tái)還有一些比較大的電商品牌都已經(jīng)有這種品牌意識(shí)了,所以不管你是在哪種團(tuán)隊(duì)里,不防也都了解一下。
我們可以從這幾個(gè)方面去看待品牌這個(gè)問(wèn)題:風(fēng)格延續(xù)/品牌統(tǒng)一/風(fēng)格突破
(4)從視覺美感的角度
當(dāng)一個(gè)Banner在滿足了前面幾個(gè)要求的情況下,如果有能力的話,我們當(dāng)然還是要做到達(dá)到視覺美感的要求的,那么從這個(gè)角度看,平面構(gòu)成之于Banner設(shè)計(jì)的意義是什么呢?
我們可以看下下面幾個(gè)關(guān)鍵詞:平衡畫面/視覺沖擊力/畫面不單調(diào)/富有創(chuàng)意等。
五、總結(jié)
以上,我分別給大家講了這幾個(gè)知識(shí)點(diǎn):
一、平面構(gòu)成的含義是什么?
二、電商Banner圖是由什么組成的?
三、我們?cè)撊绾卧贐anner圖設(shè)計(jì)中運(yùn)用平面構(gòu)成呢?
四、平面構(gòu)成之于電商Banner圖的意義是什么?
到此,平面構(gòu)成之于Banner設(shè)計(jì)的奧秘我就講完了,這次的內(nèi)容量非常大,估計(jì)夠你們消化不止一周了。
本文來(lái)源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)成都公司!
文章標(biāo)題:五步,細(xì)說(shuō)BANNER圖設(shè)計(jì)之平面構(gòu)成的奧秘
本文網(wǎng)址:http://jinyejixie.com/news33/322183.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供用戶體驗(yàn)、、響應(yīng)式網(wǎng)站、營(yíng)銷型網(wǎng)站建設(shè)、建站公司、全網(wǎng)營(yíng)銷推廣
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源:
創(chuàng)新互聯(lián)