Flashbanner设计理论知识.doc

Banner设计理论知识
一、banner的设计原则和设计要求
设计原则
1）真实性原则
banner所传播的经济信息要真实。banner文案要真实准确，客观实在，要言之有物，不能虚夸，更不能伪造虚构。
2）主题明确原则
也就是在进行产品宣传时，要突出产品的特性，要简单明了，而不能出现一些与主题无关的词语和画面。在对产品进行市场定位之后，要旗帜鲜明地贯彻广告策略，有针对性地对广告对象进行诉求，要尽量将创意文字化和视觉化。
3）形式美原则
为了加强banner的感染力，激发人们的审美情趣，在设计中进行必要的艺术夸张和创意，以增强消费者的印象。banner设计制作上要运用美学原理，给人以美的享受，提高banner的视觉效果和感染力。
4）思想性原则
是指banner的内容与形式要健康，绝不能以色情的和颓废的内容来吸引消费者注意，诱发他们的购买兴趣和购买欲望。

二、banner设计规范
文 案
1）要真实准确，客观存在，不能虚夸，更不能伪造虚构。
用 色
1）色彩要明亮干净，要与整个页面相协调。
2）不能为了banner更加吸引人而大面积的使用一些浓重的颜色(如大面积的黑色，大面积跟首页相同的红色）。　
图 片
1）图片不能有版权问题或出现禁止使用的图片（如国旗、人民币、色情图片等）。
2）中国站页面和广告不能出现西方人物（除推往国外的）。
3）图片的选用要符合创意主题。
4）要选择精度高的图片，同时也要经过艺术处理来增加美观性。
字 体
1）根据文案的重要性进行颜色和样式的变化来突出主次，以增强视觉上的吸引力。
2）字体使用不要超过三种，而造成banner视觉上的混乱。
3）字体的应用和处理一定要保证用户能快速识别。
动 画
1）无论banner多么动感，必须要保证用户有足够的时间可以看完主要的文字，才能切换到下一个场景。
2）切换的页面不能超过三个，每个页面切换时间为1到2秒。总共不能超过6秒。
创 意
1）创意要符合主题。
2）创意不能让人误解，对用户产生误导。
3）创意要帮助主题来加深和加强广告传递的信息。
4）类似文案不能要求多种创意。
格式大小
1）格式为jpg,gif或flash。
2）分辨率为72dpi。
3）在不超过banner大小的前提下，根据图片特点选择输出格式，最大限度的提高质量。
制作时间
1）一个全新的banner的制作时间为2-3个小时,如无特殊情况，必须在规定的时间内完成设计。

三、 文字的排版
文字是人类文化的重要组成部分。无论在何种视觉媒体中，文字和图片都是其两大构成要素。文字排列组合的好坏，直接影响着版面的视觉传达效果。因此，文字设计是增强视觉传达效果，提高作品的诉求力，赋予版面审美价值的一种重要构成技术。
下面我们分别从以下几个方面具体讲述文字排列在平面设计中的运用，各小节都配有生动精彩的图例剖析。　　
1． 提高文字的可读性
　 设计中的文字应避免繁杂零乱，使人易认，易懂，切忌为了设计而设计，忘记了文字设计的根本目的是为了更有效地传达作者的意图，表达设计的主题和构想意念
2．文字的位置应符合整体要求
　 文字在画面中的安排要考虑到全局的因素，不能有视觉上的冲突。否则在画面上主次不分，很容易引起视觉顺序的混乱，有时候甚至1个像素的差距也会改变你整个作品的味道
3．在视觉上应给人以美感
　 在视觉传达的过程中，文字作为画面的形象要素之一，具有传达感情的功能，因而它必须具有视觉上的美感，能够给人以美的感受
4．在设计上要富于创造性
　 根据作品主题的要求，突出文字设计的个性色彩，创造与众不同的独具特色的字体，给人以别开生面的视觉感受，有利于作者设计意图的表现
5．更复杂的应用
　 文字不仅要在字体上和画面配合好，甚至颜色和部分笔画都要加工，这样才能达到更完整的效果，而这些细节的地方需要的是耐心和功力。

　　文字版面的设计同时也是创意的过程，创意是设计者的思维水准的体现，是评价一件设计作品好坏的重要标准。在现代设计领域，一切制作的程序由电脑代劳，使人类的劳动仅限于思维上，这是好事，可以省却了许多不必要的工序，为创作提供了更好的条件。但在某些必要的阶段上，我们应该记住：人，才是设计的主体。
1．提高文字的可读性
　 文字的主要功能是在视觉传达中向大众传达作者的意图和各种信息，要达到这一目的必须考虑文字的整体诉求效果，给人以清晰的视觉印象。因此，设计中的文字应避免繁杂零乱，使人易认，易懂，切忌为了设计而设计，忘记了文字设计的根本目的是为了更好，更有效的传达作者的意图，表达设计的主题和构想意念。

　　举例如下
　　让你想表达的内容清晰，醒目。让阅览者一开始就可以明白你的意思

　　避免使用不清晰的字体，否则容易使阅览者产生反感和麻烦（除非你需要这种效果）

　　恰当的选择你所需要的字体

　　但是，经过特别的处理，你可以使用一些本来并不合适的字体，比如

　　注意文字在编排时的方向，注意安排阅览者的视线

　　如果：

　　那么，你可以做成这样

　　或者是这样也可以

　　最后一点，通常情况下，你应该

2． 文字的位置要符合整体要求

　　文字在画面中的安排要考虑到全局的因素，不能有视觉上的冲突。否则在画面上主次不分，很容易引起视觉顺序的混乱。而且作品的整个含义和气氛都可能会被破坏，这是一个很微妙的问题，需要去体会。不要指望电脑能帮你安排好，它有时候会帮你的倒忙。细节的地方也一定要注意，1个像素的差距有时候会改变你整个作品的味道。

　　举例如下:

　　安排好文字和图形之间的交叉错合，既不要影响图形的观看，也不能影响文字的阅览。

　　如果你不小心做成了这样（有意安排这种效果的不在此例）

　　文字一定不要全部都顶着画面的边角，这样看起来很不专业

　　再说一点细节上应该注意的问题，这是容易忽视的地方，也是容易出问题的地方

　　这样看起来就好一点了

3.在视觉上应给人以美感

　　在视觉传达的过程中，文字作为画面的形象要素之一，具有传达感情的功能，因而它必须具有视觉上的美感，能够给人以美的感受。字型设计良好，组合巧妙的文字能使人感到愉快，留下美好的印象，从而获得良好的心理反应。反之，则使人看后心里不愉快，视觉上难以产生美感，甚至会让观众拒而不看，这样势必难以传达出作者想表现出的意图和构想。
　　举例如下:

　　这是一个带有图形的文字版面，也许你认为这样也不错了

　　但是是不是太平淡了呢？改一下文字的位置和大小，效果又会怎么样呢？看下图

　　或者是这样也可以，看下图

　　感觉到了什么吗？其实就是这么微妙，有时只是一点小变化，味道却不一样多了。

　　再看看字间距的问题

　　 改一下看看，好一点了吗？

　　对于大的字体如果你照搬上面的做法，也许你会处理成这个样子，这样看起来字与字之间会比较松散

　　调整后是这样，看起来紧凑多了。字与字之间的对应关系也出来了

　　再看看段落文字的处理

　　字体加大后，段落之间的距离也应该随之调整（在这里，小字体同样应用这一规则，不过是相反的）
　　比如，没有调整段落距离的时候,调整后可以是这样

　　 如果有多个段落，就要注意更多的问题，比如主次和轻重，以及在内容表达当方面的重要程度等，看这个例子

　　看看这个不错的版面的处理

4.在设计上要富于创造性

　　根据作品主题的要求，突出文字设计的个性色彩，创造与众不同的独具特色的字体，给人以别开生面的视觉感受，有利于作者设计意图的表现。设计时，应从字的形态特征与组合上进行探求，不断修改，反复琢磨，这样才能创造出富有个性的文字，使其外部形态和设计格调都能唤起人们的审美愉悦感受。

　　举例如下：

　　这是一个很普通的文字版面

　　那么加一点自己的感受在里面，对文字的大小、间距、透明度做些调整，就会是完全不同的效果了。很有意思是吗？

　　根据画面或作品的要求，可以使用一些图形化的文字（这可是汉字设计的一种新观点）。
　　注：所谓“文字图形化”即将文字笔画做合理的变形搭配，使之产生类似有机或无机图形的趣味。强调字体本身的结构美和笔画美。

　　比如：
一开始好象总感觉文字在这里面的表现力有些苍白了。对主题的表达没有什么帮助。那么试一下改成这样行不行 味道出来了吗？在一定的条件下，确实不能用电脑中提供的字体，必须要自己创造。这也是汉字魅力所在的地方。

　　比如这个（没有太多的考虑的情况下） 再看看设计的做法

　　差别就在这里，也许只是一点小改动，但是需要你思考的却更多。有时候对文字的笔画做特殊的加工处理往往会产生一些意想不到的效果。而这样的处理是带有创造性的，同时人性化的味道也会更浓一些。这是电脑字体所无法替代的效果，带给观看者的感受自然会要强烈的多。

5.更复杂的应用
　　文字不仅要在字体上和画面配合好，甚至颜色和部分笔画都要加工，这样才能达到更完整的效果。而这些细节的地方需要的是耐心和功力。记住一定要有自己的想法和感受在里面，如果想表达自己对作品的态度，就不要在文字上偷懒，这也是不能偷懒的地方。
　　对作品而言，每一件作品都有其特有的风格。在这个前提下，一个作品版面上的各种不同字体的组合，一定要具有一种符合整个作品风格的风格倾向，形成总体的情调和感情倾向，不能各种文字自成一种风格，各行其是。总的基调应该是整体上的协调和局部的对比，于统一之中又具有灵动的变化，从而具有对比和谐的效果。这样，整个作品才会产生视觉上的美感，符合人们的欣赏心理。 除了以统一文字个性的方法来达到设计的基调外，也可以从方向性上来形成文字统一的基调，以及色彩方面的心理感觉来达到统一基调的效果等等。
　　比如：

一个简单的例子 经过修改之后的

一个画面要表达的东西有限，所以，banner设计一般使用动画展示，动画可以通过不同的场景搭配不同的文案，传递给用户更加多的信息；动画展示设计方法和思路与静态展示方法一样，因为都是单独的场景画面，可以单独做好几个画面，然后通过flash组合起来；
四、字体的使用: 如何根据主题选择合适的字体
在banner设计中，文案起到很重要的作用，文字字体同样起到重要作用；字体运用得不好，会严重影响banner设计效果，会明显降低banner效果档次；如下图，要体现的是高贵的感觉，文字使用了稳重、均衡的文字搭配画面，能很好的衬托出要传递的感觉；相反，第二副同样的文案，选择了活泼的、幼稚的字体，给人不稳重，不大气，不高档的感觉，完全破坏的画面效果；

常用中文字体意义：
正规体：

给人感觉比较稳重、大气、可信赖的，也感觉中庸，大众，适合画面：大气、稳重、安定、正规、高雅、时尚等；
同样的字体，不同的比划粗细给人感觉也是不同的，比如，黑色分为细黑、黑体、中黑、大黑、粗黑、超粗黑等；越纤细给人感觉越时尚、现代、轻松、优雅的感觉（适合服装、家居、化妆品等行业）；越粗的字体越给人厚重、笨重、粗壮、结实等感觉（适合工业、机械等行业）；其它字体感觉基本相同；
宋体粗细变化多，笔画优雅、飘逸、大方自然、柔美、曲线，适合使用于女性主题、画面柔和的画面；

特殊体：
此类字体设计比较个性化，容易造成不同人群的不同喜好，也就是不够大众；一般情况下在banner设计和一般平面设计中较少使用，主要运用在特定主题画面，比如少儿体，适合在活泼的页面风格中使用（儿童产品、卡通类产品等）

五、Banner字体设计
吸引眼球最简单的一种方法，它只要直观的表现出汉字的意义就可以了。当然，不同的人表现出来的同一个汉字又有所不同。介绍了这么多，你肯定也想设计一款好看的字体抓住客户的眼球了吗？

实例1
实例2

实例3
1~3是设计的女装banner，大家可以看到在用色和样式上很好的渲染和融入了环境通过丰富的联想别出心裁的展示浪漫色彩 对文字进行设计，在造型上的变型把握住女性的固有特征柔美，尽量去用曲线表现，在字的结构上加以变型。

实例4
4例是家居环境的设计，此例是要说明上文说的设计前要了解设计词的含义和构造，运用了日常生活里对其形态的影响变型，设计来源于生活，我们在做字体设计时也不能松懈对平常生活中的细心观察，我一直都认为作为一个设计师日常生活中的细心观察对设计的帮助是很大的，可以从日常生活的观察中提取灵感和元素运用到设计中来，当人们在看这个设计时能和平常的生活联系起来，产生共鸣的才是好的设计。

实例5
5例是男装的banner设计，大家在设计男装时可以很好的妙用直线条，因为直线条是最好表现男性特征的一个设计元素。在生活中不难看见直线是众多的男性品牌logo设计的根本元素。

五、Banner设计之文字与图案　　
1.主题明确
　　针对性地对广告对象进行诉求，形象鲜明的展示所要表达的内容。不要放一些没用的东西，除非你想赶走你的用户。

　　三英战吕布的场景为背景加上随意放置的几本连环画，很好的体现了连环画这一主题。

　　小提琴和玫瑰的组合凸显了贵族的生活品质。

两个面带微笑的小学生让人一下就想到了希望工程。图案采用灰度的人像，再用红色的背景衬托出黄字，黄字为主，白字为次，

2.与整个页面相协调
　　当我们确定表达的主题之后，要在banner实际放置的环境中展开后续的设计工作。色彩搭配要明亮干净，要与整个页面相协调。不能为了使banner更加吸引用户的眼球而大面积的使用一些浓重的颜色(特殊需求除外)。

3.顺应用户的浏览习惯
　　我们知道大多数的用户在浏览网页的时候都是从上到下，从左到右的浏览。为了使banner更容易被用户浏览,我们应该顺应用户这样的浏览习惯，糟糕的设计会让用户无所适从，焦点到处都是。

　　因为浏览者的习惯是从左到右地看，这样做会更快更有效。不要认为浏览者会在看广告条内容 (左)前点击按钮(右)。
　　下面的图是在实际环境中的运用案例：