Flash网络广告动画优化技巧探讨

申小春

摘要：Flash凭借其操作简便、功能强大的特点，成为了网络广告动画的宠儿。但面对日益拥挤的网络资源和带宽的限制，要减少网络广告动画的下载和回放时间，制作出高品质的Flash动画就必须对广告作品进行优化处理。笔者在文中主要讨论了通过对图片、图形、声音、文字以及Flash中其他要素进行优化等方法来达到对Flash作品瘦身的目的。

关键词：Flash；网络广告；动画；优化

随着网络技术的不断更新发展，Flash已大量渗透于教育、广告、影视传媒、音乐、游戏等各个领域。虽然目前我们迎来了3G网络时代，数据交换也都采用了尖端的光缆技术，然而网络传输依然受硬件的限制。就拿一个支持同时在线过亿访问量的门户网站来说，其所承受的下载压力可想而知。因此，如何在保证不损失其质量的情况下，让Flash作品小巧精致、播放流畅就成为必须考虑的问题。很显然，对Flash影片文件进行瘦身优化成为优选，下面笔者就来跟大家探讨一下几种优化方法。

图片的优化

图片因为包含的色彩较多导入到Flash后按大小不同占用相应的字节数，所以很多Flash设计师常常会通过压缩图片质量的方法使SWF文件变小。其实这是个无奈之举，因为图片的压缩所节省的字节数往往是以牺牲图片的质量作为代价的。同样是图片，不同的文件格式其大小亦不同，多数人会使用JPG格式的图片或PNG格式的图片做广告，JPG格式的还好，如果在一个限定20KB的广告中用了PNG格式的图片，这个广告就不好做了，因为没法控制其大小。

通常的做法是用BMP格式的图片代替JPG和PNG格式的图片，当需要用透明底时，在Flash中将图片打散，然后通过抠图将透明底部分去掉即可。但需注意的是：在导入位图前需要对图片的背景做特殊的填色处理，一来将不需要的画面填充单色，这样可使导入的图片文件小一些；二来抠边的位图在动画输出时往往由于矢量边缘计算到像素单位显示，使得位图的边缘漏出背景的杂色，所以将背景色尽量填充成与图片边缘相近的颜色，或者与Flash背景相似的颜色。这样抠出来的图片就能得到更清晰的边缘，因为此时图片的压缩是不会影响被矢量抠边的边缘的，从而能以更小的字节数得到更清晰的视觉感受。

图片在具体使用时我们还得注意以下几点：①能不用图片的地方尽量不要用图片。复杂的背景一般是最占空间的元素，而且超出场景的图片一定要切除，免得增加无谓的大小。②无关紧要的图片可降低质量。那些在动画中表现为动作快，并一闪而过的配角图片可适当将质量降低以减少文件大小。③图片可使用Photoshop进行缩放。如果导入的图片在使用时需要缩放到需要的尺寸，最好不要在Flash里直接缩放，那样Flash输出时还是按照图片的原尺寸大小输出。④连续图案背景可用位图填充方式解决。遇到连续图案背景时，可先用Photoshop裁剪一部分输出，然后在Flash里画一个与需要背景一样大的矢量形状，用位图填充，最后用渐变变形工具调节填充区域，一样可以达到与之前导入位图一样的效果[1]。这样处理的话，仅计算这一小部分位图大小，也能节省不少空间。具体操作方法如上页图1所示。⑤尽量不要打散图片。如果非特殊需要，就不要把图片分离打散，图片打散后会增加文件大小。⑥发布时可以适当调整图片质量。正式发布时，在“发布设置”里统一将JPG图片设置为一般50%～80%。

图形的优化

矢量图形的使用是Flash的一个重要特点，相比位图而言，矢量图在缩放时不会改变画质，非常适合做缩放、旋转和位置移动的动画。通常很多人都想当然地认为矢量就是大小不变的，是没法再压缩的，甚至连一些设计师都不例外。其实不然，矢量元素的复杂程度、节点的数量、节点的类型都是影响字节数的重要因素。我们都知道两点之间直线距离最短，同样两点之间直线也是最优化的，因此在直线中间添加一个点，字节数就会大一点。也许微乎其微，但是一个广告中矢量元素数量一旦增加就会积少成多，最终造成比较大的影响。当然我们也可以通过对矢量图形进行整体压缩以达到优化的目的，快捷键（Ctrl+Alt+Shift+C）选择一个压缩参数即可。

同样，我们在具体使用矢量图形时也要注意以下几个方面：①尽量使用简单的矢量图形。矢量图形越复杂，CPU运算起来就越费力，也会占用很多的空间。因此，可以使用菜单命令“修改→形状→优化”，将矢量图形中不必要的线条删除，从而减小文件。②AI矢量图形应整理后再使用。从Illustrator导入进来的AI矢量图形，有些结构太复杂，同样会增加文件大小，适当打散处理，删除不需要的部分，或者选择输出位图再导入。③多用实线，少用虚线。限制特殊线条类型如短划线、虚线、波浪线等的数量。由于实线的线条构图最简单，因此使用实线将使文件更小。④对矢量图形的填充尽量少使用过渡色，因为使用过渡色填充一个区域比使用纯色填充区域要多占50字节左右。⑤矢量背景的处理技巧也是影响文件大小的关键性因素之一。我们经常因遇到广告中无法使用大的图片背景而困扰，因为强行使用后得进行压缩，而过度压缩效果会变得很差。对于广告背景我们往往采取矢量绘制的办法，这是一个相当有难度的技术，我们可以将其分为两种情况，没有循环规律的背景图片和有一定循环规律的背景图片。对于能找到循环规律的用复制元件的方法排列或对称出所需背景，通过对各个元件的相关属性参数调节实现需要的变化效果。

如图2所示要在20KB的广告中表现这样复杂的画面，尤其是玉米地的背景该如何处理，是一个比较棘手的问题。如果因为复杂完全删除，那广告的效果就会大打折扣。当然我们可采取矢量绘制的方法来实现，画面看起来复杂其实也是有规律可循的。只要用基本的绿色绘制玉米地大致的轮廓，然后概括地添加暗部和亮部的叶子，接着单独绘制一个大致相似的玉米来。绘制时切忌太追求细节，否则复制的数量多了会大大增加文件大小。通过这样的处理，基本上主要元素都呈现了，而其字节数还比较优化，产品和任务以及LOGO总共才用4张图片依然可以保证足够的清晰度。完成后的效果见图3所示。

声音的优化

Flash广告动画中声音可以为动画带来节奏感、韵律感。但我们知道声音文件通常都比较大，因此为了不影响下载播放速度，Flash广告动画在使用声音文件时最好挑选声音类型、采样频率和声音位数较为适中的声音。

1.声音的设置

一般情况下，将声音设置成采样频率为“22KHz”，声音位数为“16bit”，品质为“快速”等属性即可[2]。为了让声音也能像动画一样边下载边播放，一般声音选取的是流声音。而对于流声音而言，压缩方式则一般最好选择Flash能支持的MP3格式，因为在相同质量的情况下，MP3文件的体积要小得多。

2.对声音进行剪辑

如果在具体使用时只用到了某个文件的某段范围的音乐，尽管我们可以采用Flash进行剪辑，但这样并不能减少Flash的文件量。因此，最好的做法是用声音编辑软件（Goldwave或Cooledit）将有用的范围剪辑出来再导入到Flash中去，这样既能得到想要的效果同时也减少了文件的大小。

文字的优化

如果广告中有太多文字占用字节数又不能删减，通常的做法是不要打散文字，而是在文件属性面板中选择文字类型为设备字体，这样文字在Flash中将不通过计算节点信息的方式运行，而是调用终端设备的系统字体呈现，所以一般字体选择默认电脑系统都有的黑体或者宋体就可以了。只是选择设备字体将会牺牲平滑性和无法直接添加透明度动画，这些动画效果只能通过转换为元件添加。

对于文字处理部分，不要直接从Photoshop里导出文字图片再导入Flash，那样会对文件大小产生很大的影响。广告中出现最多的还是文字，所以文字必须要在Flash中绘制。很多业余设计者屈服于数千种可用字体的使用，从而使得他们的设计看起来像勒索字条。而且绘制文字时一定要限制字体和字体样式的数量，尽量不要使用太多不同的字体，太多的字体会增加文件大小，如果要增加文字的多样性，可以用不同的颜色和大小，还有字体的间距和倾斜，而且通过使用Flash中的滤镜效果一样可以绘制你想要的效果[3]。

Flash其他要素的优化

1.画面的尺寸

Flash动画文件的长宽尺寸越小越好，尺寸越小，文件就越小。为减小文件，可以考虑在Flash里将电影的尺寸设置小一些，然后导出SWF电影。接着将“菜单→文件→发布设置”中“HTML”选项卡里的电影尺寸设置大一些，这样在网页里就会呈现出尺寸较大的电影，而画质丝毫无损，依然优美。

2.元件的使用

如果动画中的元素有使用一次以上者，则应考虑将其转换为元件。因为动画文件只需储存一次元件的图形数据，重复使用元件并不会使文件明显增大。通常，我们可以通过对元件进行色调、改变透明度等处理做成五彩缤纷的视觉效果。需要特别注意的是，不要在同一帧上放置过多的“影片剪辑”元件，否则会成倍增大文件的大小。

元件的类型也在一定程度上影响文件大小，图形元件比影片剪辑元件在字节数方面要优化些。随着版本的提高，设计中通常将元件设置成影片剪辑类型，以便设置滤镜效果，但到最后定稿时最好要检查一下，将没有包含动画和滤镜效果的元件改成图形元件。

3.动画的影响

动画的帧数也影响动画的字节数，同一段动画延长播放的时间字节数就会增加，所以有时可以通过缩短动画时长来减少字节数。但很多时候动画的时长不能减少，那我们理论上可以用程序控制元件内动画播放的速度，让改短后的时间轴延时播放。而且，关键帧越多动画文件就会越大，因此，能用补间动画来表示的尽量不要用关键帧动画来实现。

动画面积、位移幅度、形变幅度都会影响文件大小。这就要求我们平时在做动画时形成良好的习惯，不做多余的动画。例如，一段文字遮罩，尽量只在有效的遮罩范围做被遮罩动画，不要将遮罩层画得过大，或遮罩外两头还有多余的动画。运动到舞台以外的动画都应删除，以免积少成多，造成影响。

4.预装载与装载的使用

为了不让浏览者厌烦，使用预下载画面是个很不错的办法，但是预下载页面不要做得太复杂，不然很容易适得其反，较大的音效文件尤其需要预先下载。同时，最好将电影分成多个子电影，然后再通过主电影里的Load Movie、Unload Movie命令随时调用、卸载子电影。

Flash动画文件庞大还有其他一些原因，以上只是笔者这些年的一些实践体会，如何更加有效地对广告动画瘦身减肥还需在以后的实践中不断探索改进。