正文

Banner構(gòu)圖分類包括（banner圖的結(jié)構(gòu)有哪些）

發(fā)布時(shí)間：2023-04-10 17:22:07 稿源：創(chuàng)意嶺閱讀： 112

大家好！今天讓創(chuàng)意嶺的小編來(lái)大家介紹下關(guān)于Banner構(gòu)圖分類包括的問(wèn)題，以下是小編對(duì)此問(wèn)題的歸納整理，讓我們一起來(lái)看看吧。

開(kāi)始之前先推薦一個(gè)非常厲害的Ai人工智能工具，一鍵生成原創(chuàng)文章、方案、文案、工作計(jì)劃、工作報(bào)告、論文、代碼、作文、做題和對(duì)話答疑等等

只需要輸入關(guān)鍵詞，就能返回你想要的內(nèi)容，越精準(zhǔn)，寫(xiě)出的就越詳細(xì)，有微信小程序端、在線網(wǎng)頁(yè)版、PC客戶端

官網(wǎng)：https://ai.de1919.com。

創(chuàng)意嶺作為行業(yè)內(nèi)優(yōu)秀的企業(yè)，服務(wù)客戶遍布全球各地，如需了解相關(guān)業(yè)務(wù)請(qǐng)撥打電話175-8598-2043，或添加微信：1454722008

本文目錄:

1、網(wǎng)頁(yè)組成結(jié)構(gòu)
2、平面構(gòu)成的設(shè)計(jì)理論，指導(dǎo)設(shè)計(jì)banner
3、電商banner必備設(shè)計(jì)內(nèi)容有哪些?
4、平面設(shè)計(jì)有哪些構(gòu)圖技巧?

一、網(wǎng)頁(yè)組成結(jié)構(gòu)

一、網(wǎng)站組成結(jié)構(gòu)

1、后臺(tái)程序

2、空間（服務(wù)器）

3、域名

二、頁(yè)面的組成結(jié)構(gòu)

1、導(dǎo)航

2、banner常見(jiàn)構(gòu)圖方式

A-左右構(gòu)圖：橫向banner,左右構(gòu)圖會(huì)有更大的發(fā)揮空間；平衡性好

B-中軸構(gòu)圖：視覺(jué)焦點(diǎn)好

C-上下構(gòu)圖：視覺(jué)沖擊力好

D-三角構(gòu)圖：穩(wěn)定性好

E-傾斜構(gòu)圖：

3、Main內(nèi)容

A-左右布局：不方便；左邊會(huì)浪費(fèi)大量空間

B-上下布局：一屏一頁(yè)，沖擊力強(qiáng)

C-三字型布局：簡(jiǎn)約，排版快，美觀；常見(jiàn)的布局形式。

4、Footer頁(yè)腳

二、平面構(gòu)成的設(shè)計(jì)理論，指導(dǎo)設(shè)計(jì)banner

元素與元素之間的排列關(guān)系

所有元素在一起所體現(xiàn)的構(gòu)成形式

了解幾個(gè)常用的平面術(shù)語(yǔ)

它們之間的排列有下面這么幾種：分離／相切／重疊／透疊／結(jié)合／減缺／差疊／重疊。

分離：形與形之間不接觸，有一定距離。

相切：形與形之間的邊緣正好相切。

重疊：形與形之間覆疊關(guān)系，由此產(chǎn)生上下前后的空間關(guān)系。

透疊：形與形有透明性的相互交疊，但不產(chǎn)生上下前后的空間關(guān)系。

結(jié)合：形與形相互結(jié)合成較大的新形狀。

減缺：形與形相互覆疊，覆疊的形狀被剪掉。

差疊：形與形相互交疊，交疊的部分產(chǎn)生一個(gè)新的形。

重合：形與形相互重合，變?yōu)橐惑w。

舉例

從所有元素（點(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é)奏感，使畫(huà)面統(tǒng)一。所謂相同，在重復(fù)的構(gòu)成中主要是指形狀、顏色、大小等方面的相同。比如：

形狀的重復(fù)

骨骼的重復(fù)

大小的重復(fù)

色彩的重復(fù)

肌理的重復(fù)

方向的重復(fù)

舉例：

（2）近似

近似指的是在形狀、大小、色彩、肌理等方面有著共同特征，它表現(xiàn)了在統(tǒng)一中呈現(xiàn)生動(dòng)變化的效果。近似的程度可大可小，如果近似的程度大就產(chǎn)生了重復(fù)感。近似程度小就會(huì)破壞統(tǒng)一。比如：

形狀的近似

骨骼的近似

近視舉例：臺(tái)灣的一對(duì)雙胞胎姐妹

Banner舉例：相同款式不同顏色的鞋子，大小不一的波點(diǎn)。

（3）漸變

是我常常聽(tīng)說(shuō)的一種效果，在自然界中能親身體驗(yàn)到，在行駛的道路上我們會(huì)感到樹(shù)木由近到遠(yuǎn)、由大到小的漸變。比如：

形狀的漸變

方向的漸變

位置的漸變

大小的漸變

色彩的漸變

骨骼的漸變

光影的漸變

色彩的漸變舉例：故宮淘寶前段時(shí)間的表情包

舉個(gè)例子：

大小漸變舉例：故宮淘寶前段時(shí)間的表情包

舉個(gè)例子：

鞋子的排列方式。

背景的紋理形狀

（4）對(duì)比

有時(shí)候是形態(tài)上的對(duì)比，有時(shí)是色彩和質(zhì)感的對(duì)比。對(duì)比可產(chǎn)生明朗、肯定、強(qiáng)烈的視覺(jué)效果，給人深刻的印象。比如：

形狀的對(duì)比

大小的對(duì)比

色彩的對(duì)比

肌理的對(duì)比

位置的對(duì)比

重心的對(duì)比

空間的對(duì)比

虛實(shí)的對(duì)比

對(duì)比舉例：買家秀和買家秀。。。

Banner舉例：

（5）密集：

密集在設(shè)計(jì)中是一種常用的組織圖面的手法，基本形在整個(gè)構(gòu)圖中可自由散布，有疏有密。最疏或最密的地方常常成為整個(gè)設(shè)計(jì)的視覺(jué)焦點(diǎn)，他其實(shí)也是對(duì)比的一種情況，越密集的地方給人感覺(jué)距離越遠(yuǎn)，反之越近。

點(diǎn)的密集

線的密集

面的密集

密集舉例：

banner舉例：

（6）發(fā)射

是一種常見(jiàn)的自然現(xiàn)象，太陽(yáng)四射的光芒就是發(fā)射的。發(fā)射具有方向的規(guī)律性，發(fā)射中心為最重要的視覺(jué)焦點(diǎn)，所有的形象均向中心集中，或由中心散開(kāi)，有時(shí)可造成光學(xué)動(dòng)感，會(huì)產(chǎn)生爆炸的感覺(jué)，有強(qiáng)烈的視覺(jué)效果。

中心點(diǎn)的發(fā)射

螺旋式的發(fā)射

同心式的發(fā)射

發(fā)射舉例：星軌／水波／觀世音菩薩背后自帶的光環(huán)

Banner舉例：放射線，使得畫(huà)面聚焦到中間部分內(nèi)容。

（7）特異

是指構(gòu)成要素在有次序的關(guān)系里，有意違反次序，使少數(shù)個(gè)別的要素顯得突出，以打破規(guī)律性。

形狀的特異

大小的特異

色彩的特異

方向的特異

肌理的特異

特異舉例：其實(shí)各種類似于連連看的游戲，就是這么個(gè)原理

Banner舉例：一家人站成一排，個(gè)頭比較小的那一個(gè)就給人一種特異和俏皮的感覺(jué)，使畫(huà)面不那么單調(diào)

（8）空間

利用大?。罕热缃筮h(yuǎn)小。

利用重疊：前后／上下等關(guān)系。

利用陰影：使物體具有立體感／空間感。

利用疏密：比如間隔越小，越密集，感覺(jué)就越遠(yuǎn)。

利用透視：平行線由寬到窄。

利用色彩：冷色遠(yuǎn)離，暖色靠近。

利用肌理：越粗糙越近，越細(xì)膩越遠(yuǎn)。

矛盾空間：真實(shí)不存在的空間，假想的。

虛實(shí)關(guān)系：遠(yuǎn)景／中景／近景。

矛盾空間舉例：前段時(shí)間非常流行的一款游戲《紀(jì)念碑谷》。

空間感Banner舉例：

（9）分割

把整體分成小的部分。比如：

等形分割

自由分割

比例與數(shù)量

分割舉例：來(lái)自大自然的梯田

分割Banner舉例：不同比例大小的色塊組成Banner的背景。

商品的排列也可以起到分割畫(huà)面的作用。

（10）肌理

又稱質(zhì)感，由于物體的材料不同，表面的排列、組織、構(gòu)造等不同，因而產(chǎn)生粗糙感、光滑、軟硬感。比如：

筆觸的變化

凹凸不平的肌理

噴繪/染

自帶的紋理效果

肌理舉例：木材等

肌理Banner舉例：背景采用噴墨＋涂色的方式形成了一種很時(shí)尚的紋理。

（11）錯(cuò)視

因空間距離或周圍環(huán)境所造成的視覺(jué)差。主要有下面幾種：

圖中兩條線是等長(zhǎng)的，由于上下線段兩端的箭頭方向相反，上線段的箭頭占據(jù)的空間大，所以上面的線顯的較長(zhǎng)。

大多數(shù)人往往把垂直線看的比水平線要長(zhǎng)，這是高估的錯(cuò)覺(jué)。在水平線長(zhǎng)度為8-10mm時(shí)，這種錯(cuò)覺(jué)最大。

圖中的兩條線是相等的?？雌饋?lái)下面的要短，是因?yàn)橥敢暤腻e(cuò)覺(jué)。

標(biāo)準(zhǔn)的正方形左右的邊看上去大于上下的邊。

圖中黑白線段，由于白線段明度大，具有膨脹的現(xiàn)象，所以看以來(lái)比黑線段長(zhǎng)。

圖中組成三、四、五邊形的邊長(zhǎng)都相等，但由于周長(zhǎng)和面積的不同，產(chǎn)生邊長(zhǎng)的不同。

高個(gè)子和矮個(gè)子在一起，高的會(huì)顯的越高，矮的會(huì)顯的越矮。

錯(cuò)視舉例：比如虛實(shí)手繪拼接，比如有些攝影作品

這里要說(shuō)明的是，錯(cuò)視在一些視差動(dòng)畫(huà)的網(wǎng)頁(yè)頁(yè)面里運(yùn)用的會(huì)比較多一些，還有一些app的引導(dǎo)頁(yè)，這里Banner舉例的話可能也不太合適，不過(guò)也可以給大家看一下：

比如這個(gè)畫(huà)面里的黃色圓點(diǎn)，同樣的黃色圓點(diǎn)，在暗色背景上是很突出的，但在同樣是黃色的背景上就幾乎看不見(jiàn)了，但其實(shí)原點(diǎn)是沒(méi)變的，只是背景的顏色變了，就導(dǎo)致我們看到了不一樣的結(jié)果

原文來(lái)自：

www.woshipm.com/ucd/406308.html

三、電商banner必備設(shè)計(jì)內(nèi)容有哪些?

一、走心的文案

好的標(biāo)題能夠吸引你的注意，而糟糕的標(biāo)題讓人看都不想看，掃一眼便略過(guò)去了。所以做好Banner的第一件事情，就是需要設(shè)計(jì)走心的文案。所謂走心就是觸動(dòng)你的心靈，或者說(shuō)讓你感興趣，可以激發(fā)你的點(diǎn)擊欲望。

我們時(shí)常會(huì)看見(jiàn)這樣的廣告，文案內(nèi)容直接羅列了公司經(jīng)營(yíng)的產(chǎn)品或業(yè)務(wù)，抑或是像說(shuō)明書(shū)一樣詳盡介紹產(chǎn)品或服務(wù)的主要功能。從廣告主的角度來(lái)看這是合理的，用戶需要知道我們的產(chǎn)品有哪些特點(diǎn)，這樣我們的產(chǎn)品和服務(wù)才能被記住。

二、均衡的構(gòu)圖

構(gòu)圖說(shuō)白了其實(shí)就是對(duì)畫(huà)面進(jìn)行布局，明確如何在你構(gòu)圖的引導(dǎo)下吸引用戶點(diǎn)擊，使用戶產(chǎn)生欲望了解內(nèi)容。如果這些都能達(dá)到，那說(shuō)明你的構(gòu)圖成功了。

三、合適的字體

選擇使用一款字體的時(shí)候，除了考慮它的易讀性，更多考慮的是這款字體能否準(zhǔn)確地傳達(dá)出產(chǎn)品獨(dú)有的氣質(zhì)。

四、平面設(shè)計(jì)有哪些構(gòu)圖技巧?

1、垂直構(gòu)圖

垂直構(gòu)圖法的優(yōu)點(diǎn)：有極強(qiáng)的展現(xiàn)力，可以充分的表現(xiàn)產(chǎn)品，讓人感覺(jué)畫(huà)面平衡有秩序有很強(qiáng)的穩(wěn)定感，同時(shí)又具有莊嚴(yán)肅穆和安靜的表現(xiàn)力。在廣告banner設(shè)計(jì)方面常用于表現(xiàn)單薄細(xì)長(zhǎng)的物體。

2、平衡式構(gòu)圖

平衡式構(gòu)圖的優(yōu)勢(shì)：給人以滿足的感覺(jué)，畫(huà)面結(jié)構(gòu)完美無(wú)缺，安排巧妙，對(duì)應(yīng)而平衡。常用于月夜、水面、夜景、新聞等題材。在設(shè)計(jì)方面常用于地產(chǎn)設(shè)計(jì)、開(kāi)水瓶水壺等穩(wěn)定類產(chǎn)品banner設(shè)計(jì)。

3、放射性構(gòu)圖

放射性構(gòu)圖的優(yōu)勢(shì)：以主體為核心，景物呈向四周擴(kuò)散放射的構(gòu)圖形式，可使人的注意力集中到被攝主體，而后又有開(kāi)闊、舒展、擴(kuò)散的作用。常用于需要突出主體而場(chǎng)面又復(fù)雜的場(chǎng)合，也用于使人物或景物在較復(fù)雜的情況下產(chǎn)生特殊的效果等表現(xiàn)手法。

4、對(duì)角線構(gòu)圖

對(duì)角線構(gòu)圖的優(yōu)勢(shì)：這種構(gòu)圖打破了人們從左往右從上往下的閱讀習(xí)慣，更加有視覺(jué)沖擊力，讓人耳目一新。這種排版，往往重點(diǎn)很突出，直奔主題。

以上就是關(guān)于Banner構(gòu)圖分類包括相關(guān)問(wèn)題的回答。希望能幫到你，如有更多相關(guān)問(wèn)題，您也可以聯(lián)系我們的客服進(jìn)行咨詢，客服也會(huì)為您講解更多精彩的知識(shí)和內(nèi)容。