在APP開發(fā)、網(wǎng)站開發(fā)時(shí)，banner圖都是最重要的。特別是網(wǎng)站，很多網(wǎng)站打開首頁后，banner圖基本上覆蓋了整個(gè)屏幕，banner圖基本上永遠(yuǎn)放在一個(gè)界面最重要的位置，因此，banner的好壞無論是對設(shè)計(jì)師還是產(chǎn)品本身都是非常重要的。今天，樂信科技小編帶大家聊一聊關(guān)于banner圖的設(shè)計(jì)。

首先，我們先了解一下什么是平面構(gòu)成。百度百科的解釋是：平面構(gòu)成是視覺元素在二次元的平面上，按照美的視覺效果，力學(xué)的原理，進(jìn)行編排和組合，它是以理性和邏輯推理來創(chuàng)造形象、研究形象與形象之間的排列的方法，是理性與感性相結(jié)合的產(chǎn)物。我的理解，平面構(gòu)成主要是在二維空間運(yùn)用點(diǎn)、線、面結(jié)合一定的規(guī)律所形成的一種視覺語言，他可以是抽象的，也可以是具象的，可以是感性的，也可以是理性的，同時(shí)它也不是獨(dú)立存在的，而是伴隨著色彩/肌理/光影等而存在的?；旧鲜篱g萬物，所有我們接觸到的或無法接觸到的，看得見的或看不見的事物里都有平面構(gòu)成的運(yùn)用和身影。

 

其次，我們要了解Banner圖是由什么組成的。比如電商Banner，組成要素一般包含4個(gè)方面：文案 、商品/模特、背景、點(diǎn)綴物。Banner的作用是：宣傳/展示/廣而告之/準(zhǔn)確傳達(dá)信息。

 

第三、我們該如何在Banner圖設(shè)計(jì)中運(yùn)用平面構(gòu)成呢？在前面我們提到，平面構(gòu)成主要是在二維空間運(yùn)用點(diǎn)、線、面結(jié)合一定的規(guī)律所形成的一種視覺語言，而Banner中的所有元素(文案/商品或模特/背景/點(diǎn)綴物)其實(shí)都可以看作是平面構(gòu)成里的點(diǎn)線面這些構(gòu)成元素。

　　那么，接下來我們就需要了解3個(gè)有關(guān)平面構(gòu)成的概念了：

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

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

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

 

　　接下來，我們分別了解下這幾個(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ù)、近似、漸變、變異、對比、集結(jié)、發(fā)射、特異、空間與矛盾空間、分割、肌理及錯(cuò)視等等。

 

　　以上呢，我就先總結(jié)這么多，其實(shí)所有的Banner版式都是大同小異的，因?yàn)槲覀兦懊嫣岬?，Banner是由文案/模特或商品/背景/點(diǎn)綴物組成的，而所有這些元素就相當(dāng)于我們平面構(gòu)成里的點(diǎn)線面，當(dāng)我們改變這些元素的角度/距離/大小/數(shù)量/樣式/顏色等，新的版式也就產(chǎn)生了，所以，大家不妨也試試看哦。

　　當(dāng)我們在做一個(gè)banner的時(shí)候，如果沒有特別的要求，其實(shí)我們是有很多個(gè)方向選擇的，首先問下自己你是想要突出什么信息呢?是突出商品呢?還是突出文字呢?還是突出整體的氛圍呢?還是強(qiáng)調(diào)整體的協(xié)調(diào)感呢?還是說強(qiáng)調(diào)品牌呢?

　　一般來說，一個(gè)好的Banner首先是要保證信息傳達(dá)準(zhǔn)確，然后再需要保證畫面的協(xié)調(diào)感和氛圍的。