banner图（什么是Banner，如何设计好的Banner图）

本文目录

• 什么是Banner，如何设计好的Banner图
• 插画banner图片-盘点banner设计组成要素/类型/风格/设计步骤大全
• 怎么用PS设计banner图banner的制作方法
• 如何制作bannerbanner图怎么做

什么是Banner，如何设计好的Banner图

1、首先我们应该了解下，banner图的尺寸大小是多少，banner图的主题风格应该是什么样子的，因为这涉及到banner图制作的主视觉效果，这之中包括其结构以及颜色。

2、确定好主题风格之后，接下来我们就要进行素材的收集，其中包括背景图案、元素收集、文案制定等工作。

3、确定banner图的整体布局，其中包括主要元素布局的结构、文字的大小、每个小元素的占比、位置的确认等。

4、元素。大部分时候，我们收集上来的元素是无法直接使用的，这个时候需要我们首先对元素进行，包括图片元素的抠图，当然还有其他的一些简单的方法，看自己的具体操作吧。

5、对元素进行组合以及特效的，这其中包括颜色的渐变，以及对图层混合选项的操作等步骤。

6、根据banner图的用途保存成相应的格式，在网络环境下进行展示，一般都会选择保存成jpg格式的图片，但是同时，小编建议保存一份源文件，以方便以后进行修改。

插画banner图片-盘点banner设计组成要素/类型/风格/设计步骤大全

如何设计好Banner广告图

Banner广告无处不在。从网站首页页头的内容推荐到侧边栏,从文章内到图库列表中,你会在几乎所有内容存在的地方找到他们的影子。通常情况下,它们看起来漂亮,略显浮夸,还会蚕食你的网络浏览体验,尽管我们在想尽一切办法降低它们给用户的负面影响,但是坏名声总是不可避免地同它们绑定到了一起。

实际上,Banner广告对于用户的影响是巨大的,合理的运用,肯定是事半功倍的。那么到底要如何打造不让人生厌、转化率可观的优秀的的Banner广告呢?

空泛的理论或许不够接地气,不妨从下面50个案例中,来学习Banner广告的设计技巧。

1、风格化的图文排版

这是DearMissModern所制作的一组Banner广告,每张图片在文本和图片素材上都保持了气质和风格上的一致性。字体的形式感和图片素材中图像和图形的搭配让整个广告Banner给人的感觉更加强烈。如果图片并非是这种强风格化的,而是更加微妙的话,应当采用更加经典、耐看的字体来进行搭配,道理是一样的。

2、营造层次

Visa的节日广告Banner就充分运用了层次结构的优势。照片的挑选就是有景深有层次的美食,让人第一时刻会被它吸引,而文字排版则覆盖在虚化的远景上,确保了可读性,也增加了一个层次,传递出信息,确保不会混乱。按钮的位置正好置于美食之上,文字之下,恰到好处地吸引人来点击。

3、使用相关图标

这个来自Google的广告Banner通过手绘的图标给人带来一种个人化的体验。

图中每一个手绘的图标都非常易于识别,虽不复杂,但是给人营造出一种仿若在世界中穿行的感觉。这种难以描述但是令人触动的感觉让这个广告不再只是一个广告。

4、增加出人意料的元素

一个招聘广告应该怎么做?谷歌的这个招聘广告也算的上是出人意表了,没有高大上的说明和漂亮的妹子,而是用形同小区布告栏的手写小广告一样的涂鸦手写广告。这种广告不复杂,但是却出人意料,这种熟悉的感觉也足够令人触动。

5、加入插画

这个案例同样是谷歌的广告图,插画的加入让整个广告图充满了童真和趣味,加上扁平化的元素,整体看起来也比较统一。这种插画实现起来不难,看起来可能有点粗糙,但是确实很友好。插画和摄影图片不同,它能赋予设计以后者无法企及的气质,当然,你得用好才行。

6、布局适配

FatCow的这个广告图是由EnvatoStudio所设计的,为了适配不同的广告位,整个广告制作了多个不同尺寸的版本。将最常用的广告图设计出来之后,将其中的元素进行二次,制作成能够适配其他广告位的尺寸,其中某些元素需要调整,移除或者新增,这样就可以实现了。

7、使用绚丽的色彩

这个GoogleMusic的广告采用了活力十足的粉色,搭配的是同样高饱和度的蓝色,两者形成鲜明的对比,也给人留下深刻的影响。和普通单色调为主的Banner相比,这种色彩绚丽的多色搭配更加抓人眼球,不过使用的时候需要多加注意,确保可读性和协调性。

8、保持简约

如果说有可口可乐有什么做的非常突出,那么保持简约的设计绝对是诸多优点之中最值得学习的一个。这个可口可乐的广告Banner设计很好的延续了这一传统:产品图LOGO宣传语标志性配色。虽然内容不多,但是效果很赞。

一个塞满全部信息的Banner广告图对你而言不会有啥好处,因为用户压根不会去看。将最重要的信息呈现出来,这就够了。

9、关注潮流

关注流行文化和正在风靡的趋势,对你设计banner广告而言,非常有用。Campbell就是这样,它很好的利用了星球大战电影这个IP,推出相关主体的产品,吸引星球大战的粉丝前来购买产品。合理的借助正在流行的趋势和话题来宣传对应的产品,绝对事半功倍。

10、使用纹理

Campbell的这个广告是运用纹理提升质感的典范。笔刷式参差的边缘让整个广告的视觉效果更加微妙,广告图中其他的元素谈不上有多突出,但是纹理的加入如同点睛之笔,使得整体的效果都提升上去了。

11、借助利基

利基是指针对企业的优势细分出来的市场。广告通常需要针对目标人群来投放,这样才能达到最好的效果。

Target的婴幼儿系列产品的广告主要是针对母亲们投放的,那么还有什么比一个粉色的、可爱的场景更容易吸引到她们呢?

12、用图展示,而非语言

Zarbee的维生素广告banner在图片的使用技巧上就相当突出,水果来置换维生素,强化概念,而非用语言来描述,巧妙而直观。

13、清晰的聚焦点

当广告有明确清晰的聚焦点之后,品牌和用户之间的沟通就更加直接了。这个Banner广告图也是为Target设计的,品牌LOGO从位置到颜色都足够显眼,加上美女的姿势在结构上的引导,Target的品牌LOGO无疑是整个广告图的焦点。

14、使用意象做引导

麦当劳的这个广告就是很典型的使用意象替代文字来传递信息,咖啡这一单词被相应的图片所替代,传递信息的同时,还让整个广告图不再单调,变成图文混排。单纯的文字和图片都能够传递出信息,但是混合使用则显得更加有趣,走心。

15、让产品发声

在这个广告图当中,麦当劳的McFlurry无疑是核心,不论是意义上的,还是视觉上的。灰色的背景让色彩鲜艳的MacFlurry主体显得足够醒目。让产品本身在广告中突出展现,可以让整个Banner表现力和针对性都更强。

16、创造角度

奥迪的这个广告图通过分割空间来呈现不同的信息,但是最引人瞩目的是小幅扭转的角度给人带来的独特视觉体验。这种调整让特定的信息更加瞩目,配合图片中车体本身的角度,使得整个广告图更加富有活力。

17、使用遮盖

使用特定色彩的半透明层来遮盖背景图,可以让前景的文字内容信息脱颖而出。这种设计手法现在并不鲜见,它让背景信息从遮盖中透出,同时让文本内容可读性更强,整体层次感增强。

18、设置场景

Tiffany&Co珠宝的广告图的设计,称得上是有趣好玩,旋转的鸡尾酒杯和漂亮的珠宝组合暗示出它们经常同时出现在同一场景,营造出高雅、精致的感觉。通过相关的物品组合从而暗示用户,让他们自行脑补出场景。

19、创意字体

好的排版能够吸引用户的注意力,而Nike的这个广告尤其突出,它在字体上的设计富有创意,这些被肢解的字体同样具备强大的识别度,但是这样的设计让它们看起来更加轻盈,也更富有科技感。这种视觉上的强化,让广告和产品更加吸引人了。

20、使用风格化的插画

插画可以简约,同样也可以细节满满。风格化的插画可以通过细节和风格来增加信息的厚度,讲述故事,传递感受。这种插画力量感十足,充满能量,和Nike的品牌气质相当符合。

21、使用多种元素

虽然有风险,但是合理的将多种不同的元素搭配在一个广告图中,可以产生不错的形式感,就像这个ebay的广告图这样。漂亮的产品图,标准字体,手写字体和插画元素,协调地组合成一个广告图。当然,每个元素的存在都是有理由的,各司其职,并非随机搭配,请务必记住这一点。

22、成为流行风向标

将潮流和趋势融入到Banner的设计当中来,让它成为广告和用户之间的纽带。这个来自ebay的广告就是这么做的。将“HotlineBling”替换成“HauteLineBling”之后更好地解读了时下流行的这种文化,从而吸引更多关注这一时尚的用户。

23、自由舒展

并不是每一个广告Banner都必须借助栅格,让每个元素都精准地对齐排列,自由舒展的设计同样有效。Yoplait的广告就是这样设计的,这样显得更加有趣、富有童真。当然,这样的设计是否合适要看它的产品的气质和特色。

24、创建联系

在设计的过程中,让你的广告图中的图片和文字之间保持足够的关联是非常重要的。Talbots的广告图中图片和文字的气质就非常接近。

25、制造对比

对比是吸引用户注意力的有效手段,而ESPN的这个广告Banner的设计就是深谙这一技巧。深红色的背景下,白色的文字就显得相当突出了。字体挑选的也是锐利而轻盈的类型,这样一来,信息的传递有效度就更高了。

26、对称设计

对称式的设计可以很好地平衡广告中的元素,设计师们可能经历了深入的思考才有此设计,但是输出却是非常迅速的。这则来自苹果的广告也不复杂,黑白的音乐家照片基本上围绕着AppleMusic呈轴对称,同时保持了一定的错落美。这种简约的设计简单但是主次分明,走心。

27、目标用户的生活指南

就像Chegg这个广告一样,如果你想吸引特定的用户群体,不妨站在他们的立场,在广告中注入针对他们的生活方式指南。站在特定用户的立场上来表述、展现产品,能够更容易获得共鸣,从而得到更多的点击。

28、使用动效

在静态的页面中,最容易吸引人注意力的无疑是的元素。如果使用动效来呈现你要表现的广告内容,可以让你的内容更快被用户获取到。当然,前提是设计要足够简洁明了,这样可以避免内容琐碎,更容易被用户Get到。

29、锋锐而鲜明

吉列剃须刀的广告在视觉上称得上是锋锐而鲜明的典范,锐利的角度,深色背景上鲜明的剃须刀图片,棱角分明的字体和强对比的配色方案,这一切都让这个广告图在视觉上足够清晰醒目,令人欲罢不能。

30、制造视觉深度

Honda的这个广告图设计并不复杂,它的特色在于背景上的线条笔触。原本仿佛悬浮于空中的汽车在线条的衬托下仿佛落在地面之上。并不需要太过复杂的设计,就可以为广告图制造视觉深度,让人留下印象。

31、使用独特的字体

在广告Banner图当中使用个性化十足的字体也同样可以有效地吸引用户的注意力。百事的这个广告所用的字体富有个性的同时,还清晰可读,给人玩闹有趣的感觉,又不影响信息的传达。

32、使用多样漂亮的排版

对于漂亮的文字排版,绝大多数的用户还是很吃这一套的。这个CaliforniaPizzaKitchen的广告就是是McGrathCreative为他们精心设计的,不止排版设计颇为精致,而且富有创意地同Pizza本身结合起来。

33、使用简单的图片

简约直观的图片在网站上非常实用,它们通常会更为高效地展现内容,让广告Banner的信息传递的跟加直观。目前设计师们通常会使用扁平风的简约插画来衬托主体、增加信息量,就想Coda的这个广告图。

34、使用纹理增加视觉深度

阿迪达斯的广告图在视觉上非常有意思,背景的纹理并不繁复,但是规律而富有科技感的线条不仅增加了视觉深度,而且营造出和品牌气质贴合的速度感。

35、使用品牌色

如果广告banner中没有使用PayPal标志性的蓝色,仅是图中的图片并不会让你留下深刻的印象,但是恰恰是品牌色的使用,让图片和品牌绑定到了一起,互相促进,令你记住。

36、不要只想着促销宣传

广告Banner图是用来促销的,这没问题,但是有的时候并不需要做的那么明显。这个来自FreePeople的广告鼓励用户不要只是买买买,而是多看多逛多对比,虽然这样同样可以促进销售,但是看起来更像是站在用户角度来提建议。

37、使用大胆的色彩

I,Anna的广告图配色称得上是大胆而饱满,红色充满活力而醒目,而的加入,则让整个配色更加协调,更容易吸引用户的注意力。

38、来个简单的插图

有的时候,精致的插画并不一定符合你的品牌或者想要表达的东西,星巴克的这个广告就是这种情况下诞生的,细腻精致的图并不符合他们的需求,反而是扁平而略显拙稚的插图来的更加简单到位。它呈现出新款饮品的成份构成,这个广告图让你仿佛有身在星巴克看着菜单的感觉。

39、引入动效

这个来自星巴克的广告图,在小小的一块区域当中展现了相当引人注意的元素。波纹从中央出发,向外发散,当用户看到这个广告图的时候,会不由自主地被它吸引到。

40、完全动起来

如果你对于动效的运用足够熟练,不妨让整个广告Banner中的元素都运动起来,这样更容易脱颖而出。设计师将应用在平板当中的使用流程借助动效完全展现出来,短短几秒让你获取到静态Banner图所无法企及的信息量,体验优秀。

41、使用几何纹理

Corona的这个广告图很好地将之前所流行的Low-Poly元素运用到橙子这个意象当中,这种几何纹理赋予橙子以一种冰爽剔透的感觉,让你不由得对Corona的啤酒产生兴趣。

42、用有趣的图形分割空间

Brightgreen的这个个广告图使用菱形割裂为两个不同的空间,这样使得广告图形成了自然的两个层次,留白的部分承载文字信息,而绿色部分则承载着图片,让整个图片主次分明,又充满质感。

43、加入阴影

长阴影是之前流行过很长一段时间的设计趋势,而Webduckdesign所创造的这个广告则是相当不错的一个使用案例。如果没有阴影,那么整个图片会显得相当单调,长阴影的加入让它看起来不在那么扁平,拥有了层次。

44、将图案作为纹理

和微妙细腻的图案不同,将特定的图案作为纹理叠加在背景上,可以营造出特定的氛围。AnneSophieHostert所设计的这个广告图利用雪糕和菠萝的图案纹理给人营造出夏天的感觉。

45、使用色块分割

如果你不想将手头的图片仅仅只是用到广告图中作为背景,那么不妨将它分割成不同的部分,同单色色块结合到一起使用,整个广告图的形式感显得更强了。

46、使用线条装饰

广告图绝大多数时候都是图片和文字组成的,但是适当的加入一些装饰会让广告图看起来更加饱满。相比于各种高光,线条的装饰性也不弱,而且更加自由,效果也颇为不错。

47、讲述故事

广告的终极目标是卖出产品,而最有效的方式还是讲述真实用户的使用体验。这个广告是为亚马逊的饮品电子书APPAudible所设计的,图片中的场景旨在宣传他们的产品在许多场景下都能无干扰的使用。

48、幽默一点

幽默的展示通常会比强势的推销更有效果,他们更愿意看到引人发笑的内容。

49、使用简单的字体搭配

不用进行繁复的排版设计,将几种风格一致、简单易于识别的字体搭配到一起,就像必胜客的这个广告一下,同样可以达到增加信息量、令人愉悦的效果。

50、使用简单的图形来强调

banner对于一个设计师来说,肯定不是一个陌生的词语啦,在目前的各个行业领域中基本都涉及到banner的需求,不管是web端还是移动端我们处处都能看到banner的影子,所以掌握banner的设计是我们每一个设计师必备的技能啦!

banner(及横幅广告)是网络广告最早采用的形式,也是目前最常见的形式。横幅广告又称旗帜广告,它是横跨于网页上的矩形公告牌,当用户点击这些横幅的时候,通常可以链接到广告主的网页。是表现商家广告内容的图片,放置在广告商的页面上,是互联网广告中最基本的广告形式!

下面我们会从这几个方面讲解banner:

一:banner的组成要素

二:banner的类型

三:banner的风格选择

四:banner的设计步骤

一:banner的组成要素

banner的主要组成要素我这里简单的总结了几点:

以及banner主要的元素是:文案+元素+背景

元素又可以细分为:元素=商品+模特+logo+点缀(这里的元素是需要根据banner的实际情况选择要素,可有可无)

如图:

(来源于花瓣)

二:banner的类型

banner的类型我这里总结的主要分为:

01:产品宣传类banner(新产品、热销产品)

02:活动类banner(节日活动促销、产品促销)

这里简单的将banner分为了两种类型,因为对于不一样的banner需要实现的效果和目的是不一样的,所以我们需要设计出不一样的风格的banner

对于产品宣传的banner我们最主要的就是要突出产品的特征,所以我们对于banner的设计,需要的最主要的元素就一定是产品,以及简短的文案介绍,至于点缀的元素我们也可以根据实际产品的特征选择合适的元素,也可以不用元素的点缀,背景肯定也是必不可少的!

01:产品宣传类banner:

产品+文案+背景

例如:

(来源于花瓣)

上面的案例都是对于产品宣传类的banner的设计样式,他们有一个共同的特征就是产品放大放大再放大,尽显产品的特点,简洁的文案介绍和大量的留白更加凸显产品的特征,使用户的目光不由自主的被产品本身所吸引

产品宣传banner:

产品+文案+元素+背景

例如:

(来源于花瓣)

这类banner的特点就是除了产品本身外,都添加了一些其它的元素作为banner的一个点缀效果,使画面显得更加饱和,或使画面带有动感的效果!

那么问题来了

什么情况下产品banner设计添加元素好?什么情况下不添加元素好呢?

第一:对于需要极度显示产品的特征的时候我们最好选择不添加元素干扰产品,

第二:对于简约产品,我们最好也不要添加元素做装饰,大量的留白更加适合简约产品的风格,

02:活动类banner

产品+文案+元素+背景

例如:

(来源于花瓣)

对于活动类的banner设计我们大多数都会选择颜色鲜艳多彩的,并且画面饱和具有冲击力的,营造出一种热闹的氛围,对于元素的添加也是必不可少的一点,因为对于活动类的banner设计,画面越热闹活动力度就会显得越大,才会更加吸引用户,对于活动的标题也要尽量的凸显!

二:banner的风格选择

对于banner的风格也是多种多样的,但是对于不同性质的banner选择的风格肯定也是不一样的,不同的banner搭配不同的风格给人的视觉效果是完全不一样的,合适的搭配才能使banner更好的表现其特征和目的

例如:

01:简约产品家居banner的宣传banner,就比较适合简约大气干净的风格

(来源于花瓣)

02:高端科技产品banner,就选择具有科技感气质的风格

(通过科技感的图形和颜色等来体现)

(来源于花瓣)

03:时尚服饰类的banner,就适合选择时尚画面的风格

(通过独特的造型和风格图形以及色彩等来体现)

(来源于花瓣)

04:高端奢侈品牌类banner,就适合高端大气的风格搭配

(通过高档色彩黑红配,黑金配等来体现)

(来源于花瓣)

05:少女\儿童可爱风banner,就适合可爱风元素搭配的选择

(通过可爱元素:插画、线条、气球、爱心、圆润的字体、活力的色彩等来体现)

(来源于花瓣)

06:国风/文化/节日类banner,就比较适合选择带有文化气质的元素搭配

(通过中国风毛笔字、中国古有的元素:印章,中国山水画,墨迹,扇面,剪纸,园林窗格,古纹样,祥云,京剧,卷轴等等)

(来源于花瓣)

二:banner的设计步骤

01:了解和确定banner的设计需求

02:明确banner设计的目的

03:根据得到的banner设计需求确定banner的设计风格

04:选择合适的banner设计版式结构

05:选择匹配的元素装饰banner的整体效果(根据实际需求添加)

06:色彩搭配选择

01:了解和确定banner的设计需求

对于这了解设计需求一点来说,不管是做什么设计的前提都是必不可少的一步,也是最关键的一步,如果你连设计的需求都不明确那么做出来的设计结果肯定就不会符合实际的需求

那么对于banner的设计需求我们具体需要明确那一些呢?

第一点:确定banner设计文案

文案对于设计师来说也是一个很重要的点,设计师可以根据文案信息从中找到设计灵感,并且也可以知道大致的设计风格的走向

第一点:确定banner设计尺寸和投放平台

文案确定后我们还需要知道banner的投放平台和位置,尺寸大小,以及是否需要适配各个平台的展示,

02:明确banner设计的目的

对于设计一张banner,肯定是想要达到某一种目的才会设计这一张banner,所以在设计banner之前一定要了解清楚这一张banner设计的目的是什么,例如:是想要宣传产品还是想要促销产品,两者的性质是完全不一样的,

03:根据得到的banner设计需求确定banner的设计风格

banner的设计风格我们可以从banner文案需求中找到关键词进行定位,比如:全语音智能操作的车载支架A5

从这一句主题文案中我们能够提出的关键词就有:全语言、智能

对于这样的关键词的理解我们肯定第一就会想到科技感智能化时代的画面,所以这里的风格我们也就有所选择啦!

04:选择合适的banner设计版式结构

banner的设计版式结构我们可以大致分为:

居中结构、左对齐结构、右对齐结构

不同需求banner的结构就需要根据实际情况选择啦!

05:选择匹配的元素装饰banner的整体效果(根据实际需求添加)

对于banner的装饰元素我们也是需要根据实际情况和产品banner的特征采取合适的选择,比如简约产品的banner就不需要装饰元素更好,而活动类banner或少女儿童等可爱类的banner设计就需要选择装饰元素更加适合,并且不同形状banner的装饰元素选择也是不同的(前面做了简单的介绍,这里就不再重复啦)

06:色彩搭配选择

色彩的选择也是很关键的,不同性质的banner选择的颜色搭配也是不一样的,适当的颜色搭配会使产品更加凸显或者使画面更加显眼突出,并且给人的感觉也是不同的,

例如:

*黑金配和黑红配就会给人一种高级感

*蓝,黑色,紫等冷色搭配,画面给人硬朗,空间感,速度和力量的感觉更加适合科技感

*红、橙、黄、紫搭配,就会营造出一种热烈的氛围,更加适合时尚和活动类

*黑、白、灰的搭配就会给人一种高冷不宜接近的感觉,更加适合大牌的风格选择

*白、灰的搭配会给人一种宁静、文艺、气质、素雅的感觉,更加适合简约产品的选择

怎么用PS设计banner图banner的制作方法

提起ps，相信大家首先想到的一定会是修图，但ps不仅仅具有修图的功能，还可以用来设计各种图片哦，就比如banner图的设计，对于设计师们来说，banner设计一定不会陌生，它可以作为网站页面的横幅广告，也可以作为游行活动时用的旗帜，还可以是报纸杂志上的大标题。下面内容就来为大家演示如何使用ps进行banner图的设计。是一家线上教学的网站哦，这里有各种设计课程，包括二维的，三维的，还有各种软件的使用教程，其中就有PS哦，想学设计可以上哦。

banner图的设计教程：

1、【打开】PS软件，【新建】合适大小的画布。具体效果如图示。

2、使用【画笔工具】根据设计思路在画布对版式进行构思。具体如图示。

3、【删除】多余的元素，使用【矩形工具】，根据设计思路绘制矩形，【填充】渐变颜色，具体颜色如图示。具体效果如图示。

4、使用【直接选择工具】选择锚点并移动至合适的位置。使用【矩形工具】，绘制矩形，【颜色】粉色。使用【直接选择工具】调整矩形锚点至合适的位置。添加【图层蒙版】，使用【渐变工具】遮挡多余的部分，【不透明度】55%。具体效果如图示。

5、在图层下方【新建】图层，使用【矩形工具】绘制矩形，使用【直接选择工具】调整锚点至合适的位置，【填充】蓝色渐变，具体颜色如图示。具体效果如图示。

6、调整图层顺序，【不透明度】99%。【拖入】准备好的产品关联素材，根据设计思路调整大小排列至合适的位置。调整素材的细节，【选择】产品素材，按【Ctrl+J】复制图层，按【Ctrl+E】合并图层。打开【图层样式】-【投影】，具体参数如图示。具体效果如图示。

7、【选择】关联图层，按【Ctrl+G】编组，【重命名】。【打开】背景图组，使用【钢笔工具】绘制合适的形状对象，根据设计思路，【填充】对应的颜色，调整大小，排列至版面合适的位置。具体效果如图示。

8、【拖入】LOGO图形，调整大小，排列至合适的位置。使用【文字工具】，输入文字，调整文字大小和字体，根据设计思路，排列至版面合适的位置。具体效果如图示。

9、使用【圆角矩形工具】绘制合适大小的圆角矩形，排列至合适的位置。使用【文字工具】，选择合适的字体，输入文字，调整大小，排列至圆角矩形上方合适的位置。具体效果如图示。

10、【选择】LOGO图层，右击【栅格化图层】，使用【套索工具】套选合适的区域，按【Ctrl+J】复制图层。使用【套索工具】套选蓝色手机合适的大小，按【Ctrl+J】复制图层。调整图层至图层1上方，按Alt键单击【创建剪切蒙版】。【图层模式】点光，【不透明度】70%。具体效果如图示。

11、调整画面整体的细节，最终效果如图示。

以上就是用PS设计一张banner图的操作过程哦，大家有没有掌握如何使用ps进行banner图设计呢，如果掌握了的话，大家快快打开ps做起来吧，相信你成功做出设计图的时候一定成就感满满的呀！

如何制作bannerbanner图怎么做

如何设计好Banner？需要注意的几点？

2。横幅有动态和静态之分。在浏览网页的过程中，虽然闪动的图案会产生瞬间的记忆刺激，吸引注意力，但这种记忆往往是压抑的，久而久之容易产生负面效应，从而模糊记忆。稳定的画面不容易引起特别的注意，但如果有好的界面引导和内容，就能产生良性的记忆，持久而牢固。据粗略统计，100个Banner中有1/3是静态的。

3。Banner的“分量”更轻。以468×60横幅为例。最好在15K左右，但不要超过22K。而且88×31的横幅最好在5K左右，不要超过7K。过大的横幅会造成网页打开速度，导致浏览下降。还有一个量的问题。广告太多影响网页浏览，会导致反感。这也是一个问题。所以投放广告条要考虑广告的大小和数量，以及搭配问题。

4。从banner的设计来看，需要注意的是:①Banner不要有太多的文字，用一两句话表达就可以了。②广告语言要朗朗上口，让人在第一时间抓住表达的重点。③图形不需要太复杂，尽量使用黑体等粗体字体，否则容易在视觉上被网页的其他内容淹没。④尽量选择图形中颜色少的能说明问题的东西。⑤如果选择颜色复杂的物体，要考虑在色号较低的情况下，是否会出现明显的色点。⑥尽量不要使用彩虹色、光晕边缘等复杂的特效。这样做会大大增加图形所占的颜色数量，增大体积。⑦产品数量不宜过多。很多广告主总想展示更多的产品，从4-5到8-10不等。结果整个横幅就变成了一堆产品。Banner的展示尺寸非常有限，放置的产品太多，反而被淹没，视觉效果大打折扣。所以产品图片越多越好。容易识别是关键。

如何在电脑上制作海报？

对于做企宣或者其他文案策划宣传类的工作人员来说，能够制作一张精美的海报是必备的技能。制作一张海报，需要在文字、绘图、布局上面都进行细致的准备，前期要多搜集素材，后期要精心制作，不断修改，才能制作出精美的海报。

方法/步骤：

1、制作一张精美的海报，首先要明确海报的主题，根据主题去搜集相关的图片和文字素材。定好宣传海报要宣传的产品或者活动的内容，拟好宣传标语或者宣传介绍，为制作海报做好准备。

2、在根据确定的标题选好素材以后，就要对素材进行整理和修改应用于海报。首先是海报背景的设计。根据主题，如果主题是跟“大海”有关，那背景色可以是蓝色、可以是跟海有关的图案背景。让海报背景跟主题相切是制作一张精美的海报。

3、确定好海报的背景色之后，要对海报进行整体布局上的排版，就是明确哪里放置图片，哪里放置文字。需要在一张空白的纸上画出整体布局图，为后期排版提供参考。布局要尽量做到图片和文字间隔开，海报布局不宜太密，要详略得当。

做海报还要会打字，和好用的app。

4、根据布局的要求，先对文字进行排版。将需要介绍的文字放入相应的布局中，并根据海报整体风格改变字体。一般我们在制作海报是常用的字体是pop字体，这种字体比较轻松却不改变字体本身的形状，无论是美观度还是严谨度都适合海报的制作。在设计好字体以后，要详细阅读，以免出现不必要的错误和语病。

5、排版完文字之后就要进行图片的排版。将图片贴入相应的布局区域，贴入的图片要清晰美观，颜色要与背景色不冲突。贴入后要对图片的大小进行修改，使其适应整个版面和版面上的文字大小，保持二者的协调性。

6、将背景、文字、图片都制作好以后，一张海报基本完成。但是为了是海报更加精美，我们要站在整个海报体现的效果来进行调整。调整时尽量丰富海报的内容，调整海报的颜色搭配，突出海报的吸睛点。调整完成要为海报设计一个有吸引力的题目，并将题目放置于布局中的位置。题目的字体应该最醒目，颜色最突出。

什么是Banner，如何设计好的Banner图？

1、首先我们应该了解下，banner图的尺寸大小是多少，banner图的主题风格应该是什么样子的，因为这涉及到banner图制作的主视觉效果，这之中包括其结构以及颜色。

2、确定好主题风格之后，接下来我们就要进行素材的收集，其中包括背景图案、元素收集、文案制定等工作。

3、确定banner图的整体布局，其中包括主要元素布局的结构、文字的大小、每个小元素的占比、位置的确认等。

4、元素。大部分时候，我们收集上来的元素是无法直接使用的，这个时候需要我们首先对元素进行，包括图片元素的抠图，当然还有其他的一些简单的方法，看自己的具体操作吧。

5、对元素进行组合以及特效的，这其中包括颜色的渐变，以及对图层混合选项的操作等步骤。

6、根据banner图的用途保存成相应的格式，在网络环境下进行展示，一般都会选择保存成jpg格式的图片，但是同时，小编建议保存一份源文件，以方便以后进行修改。

banner的功能和构成要素？

①大牌、时尚、稳重。背景大量留白，色彩单一，常用黑、白、灰无彩色作为主色，凸显主体，适用于数码电子产品，奢侈品牌等。商品或模特比较大，常常截取商品部分细节做展示。不需要太多文案描述，有时只摆放一个Logo。

②时尚、品质感、促销。注重排版，文字规整，比如左对齐、右对齐、居中对齐，不会做一些怪异的字体变形，着重突出一个文字信息，放大形成一个面，压住全局，适当留白。比较适用于与时尚相关的美妆护肤、男女鞋箱包、配饰、食品等。

③可爱、热闹、亲和力。商品很多，画面比较满，会用很多小色块，手绘图形做点缀。比较适合食品、可爱服饰、母婴用品等，给人可爱、可口、甜美、亲和力的感觉。色彩丰富，配色柔和，偏暖，给人热情的感觉。

④文艺、小清新、简约、素雅、安静。这种主题比较适合家居、布艺、棉麻、茶艺、文艺等。超级大面积留白，商品都小小的。跟前面讲的大牌是截然相反的。色彩单一，以浅灰、淡蓝白、米白、棕色，饱和度和纯度低的色彩居多。

Banner设计的文案一般都由产品提供，设计师也可以根据自己的经验去调整。可以将字库里的字体进行简单设计，比如将直角变圆角，在拐角处加几何形状作装饰，连接笔画等；也可以完全进行字体的再设计。

banner的三个特点？

banner广告一般出现在APP界面顶部或底部，有静态图、GIF图、文字链、或多帧图片滚动的动画图等表现形式。

优势1.对受众干扰小2.制作相对简单3.竞价成本相对较低

其特点为

主题明确，风格统一，定位精准，图像清晰。