banner设计需注意???
在工作中经常越到产品的banner更新,怎样高效快速的去完成banner设计,对于像我这种实习生是很重要的。然后,我就仔细的学习了一下,希望跟大家一起分享。
banner设计需要注意以下4个方面,在设计的过程中多多考虑以下任何一个方面,设计效果都会有所提升。
1.排版
2.字体
3.背景
4.点缀
排版
对于banner的排版,我们可以去网易云音乐与天猫看看,去看看他们是怎样排版的。会发现天猫都是图片在左,文案在右;网易云音乐大部分是文案在左,图片在右。








通过上面的分析,我们发现常见的版式分为左右排版和上下排版。左右排版分为两种,第一种为文案在左,图片在右;第二种为图片在左,文案在右。上下排版也分为两种,第一种为文案在上,图片在下;第二种为图片在上,文案在下。对于有时候看到的居中排版的形式,还是很少用的,所以我就没有放出来啦。
由于人们习惯的阅读顺序是从左到右,从上到下。左边和上边放什么意味着用户会先看到什么。对于电商网站的banner更想用户看到产品的效果图,所以会把图片放在更重要的位置。对于想突出文案信息、活动消息的都会把文案放在更重要的位置。
注意:文案与图片的比例往往是3:2。
字体
banner 中常用的字体有四种:衬线体(serif)、非衬线体(sans-serif)、书法体(cursive)、手写体。每一种字体都有自己的特色,所以弄清banner的风格,选择相应的字体是很重要的。
衬线体笔画有粗细之分,模仿的是中国古代字体,因此衬线体能给人古典,文艺的感觉,适合用于文艺气息、女子相关设计。

非衬线体笔画简洁,现代,简约,适合用于苍劲有力,与男子相关的设计。非衬线体几乎应用于所有的电子屏。

书法体能体现中国文化和挥洒墨水的豪气,适用于文艺主题和金戈铁马般的豪迈主题。

手写体可爱,青春。适用于年轻、活力的主题。

背景
banner的背景很重要,选错背景毁所有!!背景常分四种:纯照片背景、渐变背景、纯色背景、插画背景。
纯照片背景:对于这种背景需要我们对照片进行处理。模糊、色调调节等方面发处理,突出重点内容,让背景不要太抢眼。

渐变背景:近几年比较流行的。几乎所有风格都适合,科技风,电商风、活泼风都ok。


纯色背景:应用于简约、清新的比较多,高端、大气的产品也适合。



插画背景:对于插画背景,就需要手绘能力很好的童鞋去画商业插画。商业插画真的很挣钱~~~~


点缀
在banner整体设计完之后,我们可以加一些小点缀去优化我们设计,使我们的设计更加完美。点缀也通常分为形状点缀(比如加一些科技感线条),图片点缀。(在背景中叠加一些图片,注意图片之间的融合)


当当~~~~~over了,每天一张banner练一练,几个月下来,你就有大量素材啦。