在工作中经常越到产品的banner更新,怎样高效快速的去完成banner设计,对于像我这种实习生是很重要的。然后,我就仔细的学习了一下,希望跟大家一起分享。
banner设计需要注意以下4个方面,在设计的过程中多多考虑以下任何一个方面,设计效果都会有所提升。
1.排版
2.字体
3.背景
4.点缀
排版
对于banner的排版,我们可以去网易云音乐与天猫看看,去看看他们是怎样排版的。会发现天猫都是图片在左,文案在右;网易云音乐大部分是文案在左,图片在右。
![](https://img.haomeiwen.com/i11088023/5141bf7084f583bb.png)
![](https://img.haomeiwen.com/i11088023/8d112fa41cab0fa2.png)
![](https://img.haomeiwen.com/i11088023/e1d62aa34a4e82e5.png)
![](https://img.haomeiwen.com/i11088023/c62d32816d907e9d.png)
![](https://img.haomeiwen.com/i11088023/1ea4e9ebe9177b18.png)
![](https://img.haomeiwen.com/i11088023/9a94865a4d8e1704.png)
![](https://img.haomeiwen.com/i11088023/55888959ed2af99b.png)
![](https://img.haomeiwen.com/i11088023/108639105af1d10a.png)
通过上面的分析,我们发现常见的版式分为左右排版和上下排版。左右排版分为两种,第一种为文案在左,图片在右;第二种为图片在左,文案在右。上下排版也分为两种,第一种为文案在上,图片在下;第二种为图片在上,文案在下。对于有时候看到的居中排版的形式,还是很少用的,所以我就没有放出来啦。
由于人们习惯的阅读顺序是从左到右,从上到下。左边和上边放什么意味着用户会先看到什么。对于电商网站的banner更想用户看到产品的效果图,所以会把图片放在更重要的位置。对于想突出文案信息、活动消息的都会把文案放在更重要的位置。
注意:文案与图片的比例往往是3:2。
字体
banner 中常用的字体有四种:衬线体(serif)、非衬线体(sans-serif)、书法体(cursive)、手写体。每一种字体都有自己的特色,所以弄清banner的风格,选择相应的字体是很重要的。
衬线体笔画有粗细之分,模仿的是中国古代字体,因此衬线体能给人古典,文艺的感觉,适合用于文艺气息、女子相关设计。
![](https://img.haomeiwen.com/i11088023/15ceeb8e10dbb4b5.png)
非衬线体笔画简洁,现代,简约,适合用于苍劲有力,与男子相关的设计。非衬线体几乎应用于所有的电子屏。
![](https://img.haomeiwen.com/i11088023/c1a1dd8bc4f739a6.png)
书法体能体现中国文化和挥洒墨水的豪气,适用于文艺主题和金戈铁马般的豪迈主题。
![](https://img.haomeiwen.com/i11088023/78cb340031642a29.png)
手写体可爱,青春。适用于年轻、活力的主题。
![](https://img.haomeiwen.com/i11088023/6c92738d31539621.png)
背景
banner的背景很重要,选错背景毁所有!!背景常分四种:纯照片背景、渐变背景、纯色背景、插画背景。
纯照片背景:对于这种背景需要我们对照片进行处理。模糊、色调调节等方面发处理,突出重点内容,让背景不要太抢眼。
![](https://img.haomeiwen.com/i11088023/758909408b7e263e.png)
渐变背景:近几年比较流行的。几乎所有风格都适合,科技风,电商风、活泼风都ok。
![](https://img.haomeiwen.com/i11088023/d26c62c242579acd.png)
![](https://img.haomeiwen.com/i11088023/b58cb22f9063196f.png)
纯色背景:应用于简约、清新的比较多,高端、大气的产品也适合。
![](https://img.haomeiwen.com/i11088023/817e39b555b53729.png)
![](https://img.haomeiwen.com/i11088023/deab063a800b1123.png)
![](https://img.haomeiwen.com/i11088023/083c36bc92209f2d.png)
插画背景:对于插画背景,就需要手绘能力很好的童鞋去画商业插画。商业插画真的很挣钱~~~~
![](https://img.haomeiwen.com/i11088023/d9f4cdded78d3af8.png)
![](https://img.haomeiwen.com/i11088023/c56008a2c409b7a7.png)
点缀
在banner整体设计完之后,我们可以加一些小点缀去优化我们设计,使我们的设计更加完美。点缀也通常分为形状点缀(比如加一些科技感线条),图片点缀。(在背景中叠加一些图片,注意图片之间的融合)
![](https://img.haomeiwen.com/i11088023/2e8c9cb579c21ffc.png)
![](https://img.haomeiwen.com/i11088023/07d0c74752cfb8c7.png)
当当~~~~~over了,每天一张banner练一练,几个月下来,你就有大量素材啦。
网友评论