1、本 科 毕 业 论 文Flash 广告的设计与实现Flash advertising design and implementation姓 名: 学 号:学 院:软件学院系:软件工程专 业:软件工程年 级:校内指导教师: 年 月I摘 要随着互联网的飞速发展,越来越多的商业客户开始重视网络这个宣传、展示的平台,网络广告近些年也呈快速发展之势。在网络广告的发展历程中,简单的静态的 banner 广告形式已经不能满足客户的要求,因此,又出现了漂浮广告、弹出式广告以及大幅面广告等众多形式。在众多网络广告形式中,Flash广告作为一种新的广告形式开始被越来越多的人关注并使用。本文叙述了一个基于 Flas
2、h 的服装广告的制作。主要任务是描述广告的设计思路和 Flash 设计过程。主要工作包括:第一,分析并设计整个广告过程,包括动画的构思以及场景的变换;第二,在 Photoshop 下设计每一个画面及需要变化的图层;第三,将 PSD 的分层导入 Flash,并在 Flash 下设计整个动画。文件在开发过程中不仅用到了 Flash 软件的基本功能,还应用到了 AS3.0 脚本语言。整个开发过程,通过图片、列表以及文字解释说明了广告的开场动画,场景的布置,以及 AS3.0 脚本语言在开发过程中的结合应用,使广告的开发过程十分清晰。论文首先介绍了 Flash 在网络广告中的应用背景和研究价值。然后,简
3、要介绍了开发过程中使用的 Flash 和 Photoshop 等软件的背景及技术。再次,论文分别说明了在 Photoshop 以及 Flash 下的分析、设计和实现过程。最后,论文对整个设计过程进行了总结,并展示了网络上对于 Flash 广告的创意思路,同时也对未来 Flash 在网络广告及其他方面的前景作出了展望。关键词:Flash 广告;场景动画;交互式广告IIAbstractWith the rapid development of Internet, more and more companies attract their attention to it, which can pro
4、vide the platform for the declaring and displaying. So in recent years it accompanies with the explosion of online-advertisements. Nowadays the simple and still advertisement form (banner) can not satisfy the demand of clients any more. Therefore, some other forms appear, for instance, floating-, po
5、p up ads. Among such a variety of online-ad forms, more people prefer to focus on or even take Flash ad as a new form. In the paper an advertisement production for costume, which base on Flash, will be introduced. Its main task is to design the advertisement of a sportswear. In addition the main wor
6、k includes: firstly, analyzing and designing the process of entire advertisement, including conceiving of animation and transforming of scenes; secondly, by Photoshop, designing every scene and the layers, which need to change; thirdly, leading PSD beds in Flash and then create the animation by Flas
7、h. In the exploring process not only the fundamental function of Flash software, but also program of Actionscript 3.0 language are useful. With interpretation and illustration, introduction movie of ad, setting of stages and the comprehensive exertion of AS 3.0 are during this process explained. Thu
8、s the development of the ad is vivid.The paper at first introduces the applications and research values of Flash in online-ads. Then the background and technology of software Flash and Photoshop are mentioned. Moreover, how to analyze, design and fulfill the process by Photoshop as well as Flash can
9、 also be found in the paper. At last, a sum of design process, a displaying of creative methods for Flash ads and their prospects can be read in the paper as well. Keywords: Flash advertisement; scene; animation; interactive advertisementIII目 录第一章 绪论 31.1 引言 .31.2 论文组织结构 .4第二章 相关技术概述 52.1 Flash 概述 5
10、2.2 Actionscript 语言介绍 .62.3 Photoshop 概述 72.3.1 Photoshop 基本概念 .72.3.2 Photoshop 功能特色 .8第三章 Flash 广告的优势 93.1 广告的目的 .93.2 Flash 动画的特性 93.3 Flash 广告的优势 103.4 Flash 广告的应用领域 11第四章 广告风格设定 134.1 广告风格定位 简约、时尚 .134.1.1 精简准确的色彩 134.1.2 简洁大方的板式 154.2 广告基调设计 17第五章 广告详细设计 185.1 Photoshop 图层设计 185.1.1 Photoshop
11、笔刷利用 .185.1.2 Photoshop 滤镜利用 .205.1.3 文字效果 205.1.4 产品展示区域 215.2 Flash 广告进入画面设计 225.2.1 笔刷效果的动画设计 .225.2.2 滤镜效果的动画设计 .235.2.3 文字 LOGO 效果的动画设计 245.2.4 背景随机光斑和广告进入画面效果 .255.3 产品展示和品牌介绍 .275.3.1 产品展示 .285.3.2 品牌介绍 .295.3.3 音乐波动条 .305.4 广告设计的总结 .31第六章 总结与展望 32IV参考文献 33致 谢 34VContentChart 1 Preface.31.1 I
12、ntroduction.31.2 The structure of this paper.4Chart 2 System related technologies outline52.1 Flash overview .52.2 Introduction of Actionscript.62.3 Photoshop overview 72.3.1 Basic concept of Photoshop 72.3.2 Features of Photoshop .8Chart 3 Advantages of Flash advertisement93.1 The purpose of advert
13、ising.93.2 Features of Flash animation.93.3 Advantages of Flash advertisement.103.4 Applications of Flash advertisement .11Chart 4 Advertising style .134.1 Simple, stylish 134.1.1 Tone.134.1.2 Pattern .154.2 Tone design 17Chart 5 Detailed design185.1 Layers design in Photoshop185.1.1 Brushes185.1.2
14、Filters.205.1.3 Character .205.1.4 Show goods .215.2 Opening animation225.2.1 Brushes animation.225.2.2 Filters animation235.2.3 Character animation 245.2.4 Opening animation 255.3 Show goods and introduction of brand .275.3.1 Show goods .285.3.2 Introduction of brand.295.3.3 Sonic305.4 Summary of t
15、his design 31Chart 6 Summary and future works 32VIReferences .33Acknowledgements.34第一章 绪论1第一章 绪论1.1 引言进入 21 世纪,由于人们对于新的尖端技术的迷恋,导致了不同于以前的心理状态、价值取向、审美意识及时空观念等。与此同时,也使广告设计由以往形态上的平面化、静态化开始逐步向动态化、综合化方向转变。Flash 作为一种现代传播方式和设计方式,在应用上不仅有视觉和听觉的双重功能和享受,而且具有互动趣味性,因此成为现代人放松自我、表现自我,陶醉自我的一种大众化方式。作为一种全新的流行艺术和文化表现形式
16、,Flash 已对互联网、大众艺术和文化生活构成了前所未有的冲击,演绎成一场席卷网络和年轻一代的风暴,并且有愈演愈烈之趋势,这不能不引起人们的关注。利用 Flash 动画表达自己个性张扬的创意,抒发自己另类的情感。它进一步体现了网络交互性,让个人情绪得到图形化的宣泄。许多 Flash 作品有情节、有故事、有人物,加上音乐和对白,完全具备了 MTV 或动画电影的种种要素。同样一首歌曲,在广播里听,无形无影,在电视上看,不过是真人的几个镜头切换,但制作成 Flash 效果则大不一样了。Flash 电影、Flash 歌曲、Flash 游戏、Flash 卡片,均可实现人物、音乐与动画的完美交融,为制作
17、者表达个人思想与情感提供了更直接更方便的载体,构成了全新的文化传播模式。爱好音乐的朋友希望通过这种表现手法演绎流行音乐内涵,WEB 设计者利用它构建全新交互的动感网站,网络营销则利用它创造更富有视觉冲击力的网络广告。Flash 文化迎合了青年人彰显个性的心理需要,暗合了青年人的逆反心理。这种文化可以概括为,整洁文雅,聪明敏锐,幽默有趣,认真塌实,醉心于技术,沉静而专注。不可否认的是,在网络广告中,商业性、技术性含量高的互动 FLASH 广告已经成为设计的新宠,成为了一种新型的广告信息传播模式。Flash 广告的设计与实现21.2 论文组织结构本论文共分六章。具体安排如下:第一章 简单介绍了 F
18、lash 对互联网和文化生活的影响,引出了 Flash 广告这种传播模式。第二章 概述广告设计中所使用的各项技术及各项技术的国内外发展现状。第三章 介绍了 Flash 广告的优势以及应用领域。第四章 介绍了广告风格的设计思路。第五章 详细介绍了广告制作的过程。第六章 总结了 Flash 作为一个优秀的传播载体所具有的潜力,并对 Flash的良好前景作出了展望。第二章 相关技术概述3第二章 相关技术概述2.1 Flash 概述Flash 是美国 Macromedia 公司所设计的一种二维矢量动画软件(现 Adobe公司产品) ,用于设计和编辑 Flash 文档,最新版本为:Adobe Flash
19、 CS5。Flash通常也指 Macromedia Flash Player(现 Adobe Flash Player) ,用于播放 Flash 文档。Flash 是一种创作工具,设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常,使用 Flash 创作的各个内容单元称为应用程序,即使它们可能只是很简单的动画。您也可以通过添加图片、声音、视频和特殊效果,构建包含丰富媒体的 Flash 应用程序。Flash 特别适用于创建通过 Internet 提供的内容,因为它的文件非常小
20、。Flash 是通过广泛使用矢量图形做到这一点的。与位图图形相比,矢量图形需要的内存和存储空间小很多,因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大,是因为图像中的每个像素都需要一组单独的数据来表示。要在 Flash 中构建应用程序,可以使用 Flash 绘图工具创建图形,并将其它媒体元素导入 Flash 文档。接下来,定义如何以及何时使用各个元素来创建设想中的应用程序。在 Flash 中创作内容时,需要在 Flash 文档文件中工作。Flash 文档的文件扩展名为 .fla (FLA)。Flash 文档有四个主要部分:(1) 舞台是在回放过程中显示图形、视频、按钮等内容的位
21、置。在 Flash 基础中将对舞台做详细介绍。(2) 时间轴用来通知 Flash 显示图形和其它项目元素的时间,也可以使用时间轴指定舞台上各图形的分层顺序。位于较高图层中的图形显示在较低图层中的图形的上方。(3) 库面板是 Flash 显示 Flash 文档中的媒体元素列表的位置。Flash 广告的设计与实现4(4) ActionScript 代码可用来向文档中的媒体元素添加交互式内容。例如,可以添加代码以便用户在单击某按钮时显示一幅新图像,还可以使用 ActionScript 向应用程序添加逻辑。逻辑使应用程序能够根据用户的操作和其它情况采取不同的工作方式。Flash 包括两个版本的 Act
22、ionScript,可满足创作者的不同具体需要。Flash 包含了许多种功能,如预置的拖放用户界面组件,可以轻松地将 ActionScript 添加到文档的内置行为,以及可以添加到媒体对象的特殊效果。这些功能使 Flash 不仅功能强大,而且易于使用。2.2 Actionscript 语言介绍ActionScript 动作脚本是遵循 ECMAscript 第四版的 Adobe Flash Player 运行时环境的编程语言。它在 Flash 内容和应用程序中实现交互性、数据处理以及其他功能。ActionScript 是 Flash 的脚本语言,与 JavaScript 相似,ActionScr
23、ipt 是一种面向对象编程语言。ActionScript 3.0 提供了可靠的编程模型,具备面向对象编程的基本知识的开发人员对此模型会感到似曾相识。ActionScript 3.0 中的一些主要功能包括:一个新增的 ActionScript 虚拟机,称为 AVM2,它使用全新的字节码指令集,可使性能显著提高;一个更为先进的编译器代码库,它更为严格地遵循 ECMAScript (ECMA 262) 标准,并且相对于早期的编译器版本,可执行更深入的优化;一个扩展并改进的应用程序编程接口(API) ,拥有对对象的低级控制和真正意义上的面向对象的模型;一种基于即将发布的 ECMAScript(ECMA
24、-262)第 4 版草案语言规范的核心语言;一个基于 ECMAScript for XML(E4X)规范( ECMA-357 第 2 版)的XML API。E4X 是 ECMAScript 的一种语言扩展,它将 XML 添加为语言的本机数据类型;一个基于文档对象模型(DOM)第 3 级事件规范的事件模型。ActionScript 3.0 的脚本编写功能超越了 ActionScript 的早期版本。它旨在方第二章 相关技术概述5便创建拥有大型数据集和面向对象的可重用代码库的高度复杂应用程序。虽然 ActionScript 3.0 对于在 Adobe Flash Player 9 中运行的内容并不
25、是必需的,但它使用新型的虚拟机 AVM2 实现了性能的改善。ActionScript 3.0 代码的执行速度可以比旧式 ActionScript 代码快 10 倍。2.3 Photoshop 概述2.3.1 Photoshop 基本概念Photoshop 是 Adobe 公司旗下最为出名的图像处理软件之一,集图像扫描、编辑修改、图像制作、广告创意,图像输入与输出于一体的图形图像处理软件,深受广大平面设计人员和电脑美术爱好者的喜爱。最先它只是在 Apple 机(MAC)上使用,后来也开发出了 for window 的版本。下面是这个软件里一些基本的概念。位图:又称光栅图,一般用于照片品质的图像处
26、理,是由许多像小方块一样的“ 像素 “组成的图形。由其位置与颜色值表示,能表现出颜色阴影的变化。在 Photoshop 主要用于处理位图。矢量图:通常无法提供生成照片的图像物性,一般用于工程技术绘图。如灯光的质量效果很难在一幅矢量图表现出来。分辩率:每单位长度上的像素叫做图像的分辩率,简单讲即是电脑的图像给读者自己观看的清晰与模糊,分辩率有很多种。如屏幕分辩率,扫描仪的分辩率,打印分辩率。图像尺寸与图像大小及分辩率的关系:如图像尺寸大,分辩率大,文件较大,所占内存大,电脑处理速度会慢,相反,任意一个因素减少,处理速度都会加快。通道:在 PS 中,通道是指色彩的范围,一般情况下,一种基本色为一个
27、通道。如 RGB 颜色,R 为红色,所以 R 通道的范围为红色,G 为绿色,B 为蓝色。图层:在 PS 中,一般多是用到多个图层制作每一层好象是一张透明纸,叠放在一起就是一个完整的图像。对每一图层进行修改处理,对其它的图层不含造成任何的影响。Flash 广告的设计与实现6图像的色彩模式:(1) RGB 彩色模式:又叫加色模式,是屏幕显示的最佳颜色,由红、绿、蓝三种颜色组成,每一种颜色可以有 0-255 的亮度变化。(2) CMYK 彩色模式:由品蓝,品红,品黄和黑色组成,又叫减色模式。一般打印输出及印刷都是这种模式,所以打印图片一般都采用CMYK 模式。(3) HSB 彩色模式:是将色彩分解为
28、色调,饱和度及亮度通过调整色调,饱和度及亮度得到颜色和变化。(4) Lab 彩色模式:这种模式通过一个光强和两个色调来描述一个色调叫 a,另一个色调叫 b。它主要影响着色调的明暗。一般 RGB 转换成 CMYK 都先经 Lab 的转换。(5) 索引颜色:这种颜色下图像像素用一个字节表示它最多包含有 256色的色表储存并索引其所用的颜色,它图像质量不高,占空间较少。(6) 灰度模式:即只用黑色和白色显示图像,像素 0 值为黑色,像素255 为白色。(7) 位图模式:像素不是由字节表示,而是由二进制表示,即黑色和白色由二进制表示,从而占磁盘空间最小。2.3.2 Photoshop 功能特色从功能上
29、看,Photoshop 可分为图像编辑、图像合成、校色调色及特效制作部分。PHOTOSHOP 界面图像编辑是图像处理的基础,可以对图像做各种变换如放大、缩小、旋转、倾斜、镜像、透视等。也可进行复制、去除斑点、修补、修饰图像的残损等。这在婚纱摄影、人像处理制作中有非常大的用场,去除人像上不满意的部分,进行美化加工,得到让人非常满意的效果。 图像合成则是将几幅图像通过图层操作、工具应用合成完整的、传达明确意义的图像,这是美术设计的必经之路。photoshop 提供的绘图工具让外来图像与创意很好地融合,成为可能使图像的合成天衣无缝。 校色调色是 photoshop 中深具威力的功能之一,可方便快捷地
30、对图像的颜色进行明暗、色编的调整和校正,也可在不同颜色进行切换以满足图像在不同第二章 相关技术概述7领域如网页设计、印刷、多媒体等方面应用。 特效制作在 photoshop 中主要由滤镜、通道及工具综合应用完成。包括图像的特效创意和特效字的制作,如油画、浮雕、石膏画、素描等常用的传统美术技巧都可藉由 photoshop 特效完成。而各种特效字的制作更是很多美术设计师热衷于 photoshop 的研究的原因。Flash 广告的设计与实现8第三章 Flash 广告的优势3.1 广告的目的广告的基本功能是认识功能。通过广告,能帮助消费者认识和了解各种商品的商标、性能、用途、使用和保养方法、购买地点和
31、购买方法、价格等内容,从而起到传递信息、沟通产销的作用。俗话说,货好还得宣传巧。但是,在现实生活中,有一些企业对广告的作用不太明了,认为做广告花费大、收益小,得不偿失。因此,他们宁可天南海北、火车轮船、辛辛苦苦到处推销,也不愿做广告。然而,实践证明,广告在传递经济信息方面,是最迅速、最节省、最有效的手段之一。好的产品借助于现代化科学手段的广告,其所发挥的作用要比人力高出很多倍。3.2 Flash 动画的特性Flash 以流控制技术和矢量技术等为代表,能够将矢量图、位图、音频、视频等素材有机、灵活地结合在一起,从而制作出美观、交互性强的动画效果。Flash 动画作为全新的流行艺术和文化表现形式,
32、有别于其他的艺术品种,具有鲜明的网络时代特征。另外,Flash 动画所具有的时尚性、运动性、卡通性等艺术特征实现了技术和艺术的完美结合。(1) 时尚性如今,Flash 动画已经成为网络时代一道亮丽的风景。它是网络、互动、即时、音乐、动画、影视等各种时尚元素的集合体,在形式上有别于以往任何一种艺术类型,具有鲜明的网络时代特征。闪客们在创作中借鉴了大量的时尚元素来表现自己想要表达的主题,来传达自己想要传达的情感。 “小小系列” 、 “东北人都是活雷锋”等都是 Flash 时尚的代表,时尚的 Flash 已经成为那些追求时尚的都市青年的一剂调味品。(2) 运动性Flash 就是闪烁的意思, “闪”是
33、 Flash 动画的主要艺术体现。这种运动性在Flash 动画中的应用,使 Flash 动画有了生气和活力,同时也让 Flash 动画和平面艺术有了本质的区别。Flash 动画能最大限度地呈现运动,是真正意义上的运第三章 Flash 广告的优势9动,也正是因为具有这种运动性,才使得 Flash 动画能够叙述事件、塑造人物、传达意蕴,真正成为具有独特表现力的艺术形式。Flash 的运动性让 Flash 艺术有了持久的生命力,给观众的视觉冲击更加突出。(3)交互性Flash 动画具有交互性优势,可以更好地满足所有用户的需要,可以让欣赏者的动作成为动画的一部分。用户可以通过点击、选择等动作,决定动画
34、的运行过程和结果,这一点是传统动画所无法比拟的。3.3 Flash 广告的优势(1)形式新颖Flash 广告生动活泼,充满想象力和创造力,以非同寻常的表达方式表现广告的内容,让看惯电视广告、杂志广告的观众眼前一亮,让本来普通的广告具有更强的感染力和表现力,使观众在了解产品和信息的同时,享受到了 Flash广告所带来的娱乐性。(2)表现张力大Flash 广告属于一种创作,表现张力较大,借鉴卡通和漫画手法,对生活进行适度的夸张、变形,形象生动、风趣幽默、意味深长。虽然偶尔会缺乏真实性,但恰恰是这个“缺点” ,让 Flash 广告具有更强的吸引力,而这正是广告商所需要达到的效果。(3) 制作快捷Fl
35、ash 广告的完成依赖于 Flash 软件。只要设计者有了广告的构思,找到了所需要的素材,就能轻松方便地利用 Flash 软件完成整个广告。很多技能高的闪客们完成一个普通的 Flash 广告只需要几个小时的时间。(4)成本低很多企业都喜欢邀请大明星来代言自己的产品,为自己的产品拍摄广告。虽然这种广告效果较好,但成本较高,每年要花费上万甚至上千万的费用。除此以外,拍摄广告需要选择景点,需要提供代言人的服装和造型等等。宗旨,一则好的电视广告需要大量的时间、人力、物力和金钱。相对而言,制作一则Flash 广告,只需要一台电脑、一个闪客即可,成本较低。也正因此,Flash 广告制作,吸引着越来越多的企
36、业家。Flash 广告的设计与实现10(5) 容量小、速度快Flash 采用的是当前流行的矢量技术,文件小,传输速度快,适合网络传输和共享。较小的、简单的 Flash 动画只有几十千字节,较大的、复杂的 Flash 动画往往也只有几百千字节。文件越小,相应的传输速度就越快。在当代快节奏的社会中,速度也是人们追求的一个方向。从这一角度来说,Flash 也必然成为当前备受关注的广告形式。3.4 Flash 广告的应用领域Flash 动画种类繁多,如 Flash 游戏、FlashMV 、电子贺卡、幽默短片、广告、网站等等,都深受人们的喜爱。由于制作成本少、周期短、形式多样、交互性强等优势,很多广告商
37、都将目标投向了 Flash,使 Flash 在商业领域的应用逐渐升温。作为一种深受人们,尤其是广大青年人喜欢的文化传播形式,Flash的传播率几乎是 100%,这与传统的广告相比有着显著的优势。(1)网络广告最先出现 Flash 广告的媒体是网络。在网络上传播 Flash 广告,不受时间和空间的限制。只要有网络,一天 24 小时,无论在哪个国家,都能够看到网络上发布的 Flash 广告。同时,网络有着有很强的交互性,只要网民对广告中的产品感兴趣,就可以通过超链接的方式做深入的了解,甚至可以直接从网络上购买产品。花适量的钱就可以在各大知名网站发布自己的广告,这吸引着越来越多的企业开始青睐网络 F
38、lash 广告。也正因为如此,很多网站的页面上,有三分之一的空间被 Flash 广告占据了。曾有人对网页上飘来飘去的 Flash 广告表示厌烦,一位网友曾在报刊上发表文章抱怨说, “那些网络广告实在让人讨厌,它们总是在挡住你的视线。我真担心它们有一天会影响到网站的访问率,砸了网站的饭碗。 ”其实,这正是广告商要达到的效果,但也证明,作为一种全新的传播方式,Flash 已经出现并得到了传媒以及社会的关注。(2)电视广告在网络未风靡全球之前,传统的电视广告就是以人为中心,通过拍摄的方式制作合成的。这种类型的电视广告不仅耗费人力、财力,还需要大量的时间去拍摄和后期制作。而在网络广告铺天盖地之后,电视
39、台也陆续出现了 Flash第三章 Flash 广告的优势11广告的身影。例如,脑白金的广告系列采用了 Flash 的形式, “收礼只收脑白金”这句广告词在每个消费者的心中都留下了深刻的印象。虽然没有大明星的参与,没有美丽的风景,但是这则 Flash 广告却达到了最佳的广告效果,成为电视广告的常青树。(3) 手机广告如今,手机用户数量逐渐超出电脑用户数量。由于人们可以不受时间和地点的限制使用手机,营销者便抓住了这个巨大的市场开展品牌的建立、产品的宣传以及客户服务方面的活动。手机广告,作为通过手机营销的一种方式,是通过手机来直接把广告信息发送到用户手中。手机广告作为广告行业中的一种形式,将占据手机
40、市场中相当大的份额。Flash 广告的设计与实现12第四章 广告风格设定4.1 广告风格定位简约、时尚创意是广告的灵魂,它蕴涵着神奇的魔力,能将平凡的服装点染得光彩四射,令人目不暇接。纵览当今世界各大品牌的服装广告创意,我们不仅为其精妙绝伦的画面所打动,也被其富有哲理的简洁语言、戏剧性的情节设置和独特创意所折服,更为其创造的商业奇迹所震撼。广告创意是围绕商品而展开的,但连篇累牍地展示产品并不一定能激起消费者的购买欲望。因此,服装广告提炼简洁而符合主题的风格和板式显得尤为关键。4.1.1 精简准确的色彩简约是什么?通过最精简的表现手段(最少的元素)达到最好的效果,这就是简约的设计。通过最简约的表
41、达手段达到最好的表达效果一直是各个不同领域的创造者的目的,是设计的一个较高境界。图 4.1GUGIRL 服装风格简洁时尚,大方高贵,这类广告设计插图素材一般会由企业提供,经过专业模特和摄影,都能很多的表达服装的特征,页面色彩根据服装特点搭配,褐色传达高贵的感觉,不同层次的明度变化让色彩丰富起来,简洁的色彩搭配突出插图的气氛,让插图清晰大方的作为主题展示:第四章 广告风格设定13图 4.1 GUGIRL 广告(1)对于简约时尚风格而言,造型与色彩的结合更为重要,合适的图形,没有合适的色彩,无法表现简约时尚感;合适的色彩,没有合适的图形,同样无法表现简约时尚感。图 4.2 中,我们使用丰富的色彩搭
42、配页面,同样的版式,给人的感觉是完全不一样的,画面色彩活跃,饱和度高,给人年轻,靓丽的感觉,与插图传递出来的感觉是不一样的,插图给人成熟、时尚、高贵、大方的感觉,用这些色彩没有很好的为主题服务:图 4.2 GUGIRL 广告(2)图 4.3 色彩风格不变,把产品的风格做调整,感觉明显更加统一。产品插图和色彩都给人青春,活泼靓丽的感觉,这样的搭配就是比较合理的了:Flash 广告的设计与实现14图 4.3 GUGIRL 广告(3)4.1.2 简洁大方的板式精简设计中版式有什么原则?如何做到版式的精简设计?首先,要记住什么才是简约的设计:通过最精简的表现手段达到最好的效果,这就是简约的设计。版式设
43、计是通过点线面组成的,点线面的精简运用,是版式设计达到简约效果的前提。组成元素复杂了,页面当然也就复杂了;线元素,直线是最简洁的,曲线显得复杂;点本身是最简洁的元素;面元素,方形是最简洁的,多边形和不规则图形最为复杂。图 4.4 和图 4.5 的版式元素只有直线和面,都是最为简洁的元素,画面没有多余的元素,显得简洁大方,搭配插图,共同达到时尚的效果:第四章 广告风格设定15图 4.4 Strellson 广告(1)图 4.5 Strellson 广告(2)如果使用过多使用曲线或者使用曲线风格,就完全没有了简洁时尚的感觉,反而显得复杂累赘,如图 4.6:Flash 广告的设计与实现16图 4.6
44、 Strellson 广告(3)4.2 广告基调设计在上一节中我们分析了广告风格的表现对于广告整体的影响,我们提到了色彩和板式的设计。而在色彩和板式上要达到简约、时尚的效果,并且要符合运动服装的风格,突出品牌特色,使用 Flash 开发会有很大的优势。在制作 Flash 广告之前,应该对目前的相关作品,以及时尚流行趋势都有一定的了解。在时尚界,黑色被誉为永恒的流行色。对于成年人,黑色内敛、有型、高雅、端庄、专业,甚至邪恶性感。对于年轻人,黑色意味着抗拒、反叛和对既定规则的哀悼。喜欢黑色的人并非追求自我隐藏,而往往相反,在低调的背后他们又期待被发现。没有什么比一个不发光同时又不反光的背景更能凸显
45、个性的眼神与气质。黑是神秘的颜色,因为不发光也不反射光,永远蕴藏着无穷的想象空间,正如人类对未来的无止境的思考与探索。因此,在参考了众多资料,翻阅了大量时尚杂志后,决定把广告的整体色彩基调定为暗色系。在黑色的背景下利用 Flash 加入随机性的光斑,增加广告整体的动感,动静结合,更加符合运动服装所需要的效果。第五章 广告详细设计17第五章 广告详细设计5.1 Photoshop 图层设计自从 Flash 和 Photoshop 更新到 CS3 版本以后,通过 Photoshop 制作的.psd分层文件就可以直接导入 Flash 进行动画的制作。在 Photoshop 里设计好每一个需要动的图层
46、,导入 Flash 后,制作动画就变得很方便。5.1.1 Photoshop 笔刷利用选用黑色为主中间微亮作为背景图层,而并非全黑,并利用笔刷在另一图层抹上一层淡淡的底色,做出类似“星云”的效果,充满神秘而沉稳的气息。图 5.1 Mclovin 的背景及主色调同样利用笔刷及光的效果在另外的图层做出所需要的图形。图 5.2 为油漆点笔刷。Flash 广告的设计与实现18图 5.2 油漆点笔刷图 5.3 为水墨笔刷。图 5.3 水墨笔刷第五章 广告详细设计195.1.2 Photoshop 滤镜利用图 5.4 使用了滤镜中的风以及模糊滤镜的效果,颜色深浅不一准备了两个图层。图 5.4 滤镜效果5.
47、1.3 文字效果图 5.5 所示为两层字体层,其中一层具有投影、外发光、内发光、颜色叠加等效果,使其看起来就像霓虹灯,这在 Flash 制作中会产生很华丽的效果。Flash 广告的设计与实现20图 5.5 文字效果5.1.4 产品展示区域图 5.6 所示为产品展示所需的小图片位置。图 5.6 产品展示区域第五章 广告详细设计215.2 Flash 广告进入画面设计在 Photoshop 图层部分设计后将生成的 .psd 文件导入 Flash 中进行动画部分的设计。5.2.1 笔刷效果的动画设计使用模糊、渐进、旋转的方式将之前制作的油漆点笔刷效果展现出来,在动画进行中同样以渐进、旋转的方式插入水墨笔刷。图 5.7 和图 5.8 为笔刷变化效果图。图 5.7 笔刷变化效果(1)Flash 广告的设计与实现22图 5.8 笔刷变化效果(2)5.2.2 滤镜效果的动画设计在笔刷变化即将结束时加入滤镜效果的动画,使画面看起来紧凑连贯。图5.9 和 5.10 为单独滤镜变化效果对比图。图 5.9 滤镜效果图(1)