广告条设计技巧,Banner设计方法和原则

2017-11-15  7249 分类:设计资讯

广告条设计技巧,Banner设计方法和原则

广告条可以说是非常常用,我们非常熟悉的页面元素,广告条设计在电商设计、品牌设计等等其他的平面设计中也会用到,广告条也就是Banner,相信浏览网页的设计师一定会关注它的设计。一张Banner,不仅仅由点或者不仅仅由线组成,而是点、线、面相互组合,相互平衡,最终形成一个版式丰富的Banner图。那么广告条设计有什么样的技巧呢?下面品索教育为你分享Banner广告调节设计方法和原则。

为什么要做广告条?Banner图的作用是什么?

1. banner是用来传达信息的。一切不以传达有效信息、有效传达信息的banner都是yy.

2. baner是用来促使用户行动的,也即CALL TO ACITON。无法让用户产生你所期望的banner都是无效的。

Banner设计六个基本原则:

一、对齐原则

相关的内容要对齐,方便用户视线快速移动,一眼看到最重要的信息。

对齐原则.jpg

二、聚拢原则

将内容分成几个区域,相关内容都聚在一个区域中。

三、留白原则

千万不要把banner排得密密麻麻,要留出一定的空间,这样既减少了banner的压迫感,又可以引导读者视线,突出重点内容。

留白原则.jpg

四、降噪原则

颜色过多、字体过多、图形过繁,都是分散读者注意力的”噪音”。

降噪原则.jpg

五、重复原则

排版时,要注意整个设计的一致性和连贯性,避免出现不同类型的视觉元素。

重复原则.jpg

六、对比原则

对比原则.jpg

加大不同元素的视觉差异,这样既增加了banner的活泼,又突出了视觉重点,方便用户一眼浏览到重要的信息。

下面我们以淘宝广告条设计为例,淘宝Banner设计方法

1.了解banner的组成要素banner里面一般都会包含文案 、商品/模特、背景、CTA(行动引导按钮,引导用户点击或购买,非必须)

2.确定banner的风格Banner风格有很多种,下面展示的只是banner设计中的五种常见风格

时尚风广告条设计:大标题+人物+时尚元素/配色

时尚风广告条设计.jpg

复古风广告条设计:传统元素、复古图案

复古风广告条设计.jpg

清新风广告条设计:配色清爽、自然

清新风广告条设计.jpg

炫酷风广告条设计:深色背景+质感元素+光影特效

炫酷风广告条设计.jpg

简约风/性冷淡风广告条设计:极简主义、大空间、日式元素

简约风 性冷淡风广告条设计.jpg

3.banner设计排版构图:

垂直水平构图:

排版左中右对齐方式都有,比较随意直观,可灵活操作。

垂直水平构图.jpg

斜线构图:

常用于促销类、居中排版、大多数会有图形辅助或者底部斜线构图,以区分和突出文本。

三角构图:

文字排布大小分明,结构感强,常以图形线条辅助排版。

三角构图.jpg

辐射式构图:

和斜线构图很像,通常用于促销类,文案居中排版,大多以图形辅助或者底部斜线构图,明确区分并突出文本。

辐射式构图.jpg

框架式构图:

框架构图包括图形框,文本框。

框架式构图.jpg

4.文字排版要求:

文字的排版要求重点突出,大小粗细错落有致,字体保持在2种左右,像下面这种大尺寸的banner文字就可以适当的做下变形,加入一些跟内容有联系的元素或者图形,可以更好的表达整个设计的情绪。

5.配色要求:

色彩是由色相、明度和纯度构成的。 色相即颜色的相貌,用于区分各类颜色,如红色,黄色,绿色,蓝色等;明度即颜色的明暗和深浅,或者说颜色含量里白色的多少;纯度即色彩的饱和鲜艳程度。 

6.装饰元素:

装饰常见于点、线、面,或者一些手绘的元素等等,在确定基本的构图和配色之后,加入一点小元素和小装饰,会让画面更有细节,更有设计感。

装饰元素.jpg

每种色彩都会因为色相,明度,纯度的不同,表现出不同的色彩感,色彩是有情感的,不同的配色会带给人完全不同的心里感受。

所以当你在做banner的时候 就要考虑你想要表达什么样的情感,想让用户看的时候有什么样的感受,你所表达的情感是不是符合主题内容,基于这些出发点再来做banner的配色就更加的有目的性了。

作为设计师,广告条平时一定要多看、多想,多练。尤其是多看看优秀广告条设计作品,等到我们设计的时候,要懂得把别人用得好的版式、字体、配色、装饰等等运用到我们自己的设计上,这才是设计师的思考方式。


猜你喜欢