djane
先说一下目前大家做flash的几种情况,分别针对这几种情况,各举例说明。

一般来说,目前广告的制作大体分三种:

A 客户给出要求,由我们自己出创意并设计出来,动画效果基本没有过多要求,全要我们自己发挥的。

B 客户提供了广告公司做好的ai/cdr等广告样式,只要我们做出flash格式并加些效果的。

C 提供了其它的尺寸,要求修改成所需要尺寸的。

基本是以上三种。

A 客户给出要求,由我们自己出创意并设计出来,动画效果基本没有过多要求,全要我们自己发挥的

做这种广告的时候,不知道大家习惯怎么做。可能大多都是打开flash软件,建立好场景,把要用的图和文字 在里面写出来,分好屏幕,做装饰。

这没有问题,但前题是设计师的脑子里要有个广告的大概样子,要知道什么东西占k大,什么东西点k小,避免生成大k数的效果和手段。

此项最要注意的是:图片的处理。图片一定要在ps软件中,处理成所需要的大小,再导入到flash里,放在相应的位置。

所以,要养成做flash广告前,在ps中做好场景 的分镜头稿件。就是把分几屏,每一屏的内容都做出来,只是没有动画效果的。

如图:

这是ps 中做出来的第一屏的稿。以此为例子。

下面分析一下上图是如何以最小的k数在flash中实现的。

一:背景 可以flash中画个和场景一样的方形图,填上红色色值放在最低层做背景。
(不要只调底色,因为很多情况会把flash控制成背景透明,如果只用底色。那在网上的时候就秀明了)



二 边框 

上图的边框很简单,我们可以在flash中描下 这个部分。做成一个元件,通过复制/旋转或利用水平翻转+垂直翻转,得到四个角的图形,加上直线工具。得到一个

矢量化的边框。

如图下图:我花了两分钟,描出来的矢量边框。





二 logo 这个案例我没有矢量logo原文件,为了考虑logo的清楚度和k数,分析了他的背景是个纯色,所以截取了 

这样一块就好了,把它放在flash中相应的位置。这个图要在ps中压一下,我对比一下gif/jpg 两种格式,发现gif 32色得到的是最小的。

目前这个flash基本被实现出来了。样子是:

现在只差右边的文字 效果了。文字的大小/字体/间距 等要和设计稿里一样。

一共三屏文字,我就不一一的抓图了。 最后做出来的这个flash,大小是10.5k.文字还做了过光,淡入淡出等效果。

这个广告的标准要求是小于18k,这样还有8k的空间,目前我做的这个没有放楼图。8k,可以加一张到两张楼图进来了。

如图:加楼图后是这样的,


图片处理成4.5k的图片,没有影响 视觉。在flash中还加了上下滑动的动画效果。目前这个三屏的flash做,有两屏加了楼图,像上面的样子。这个广告全下来是18.9k.虽然超点0.9但是还在18k的范围内。这个三屏动画里有三张图片:楼图01 楼图02 logo图。三屏文字效果。如果logo换成矢量的。估计还会减下2k左右吧。

此案例完成。



B 客户提供了广告公司做好的ai/cdr等广告样式,只要我们做出flash格式并加些效果的

首先注意:ai 或 cdr 格式文件里 的矢量元素都是可以转到flash中变成矢量元素的,这样做出来的flash一般不会超标。

目前是:很多人往往不这样做。ai 里或cdr里是矢量的,可是flash中全是透明的png图。

熟悉软件是最主要的,学会怎么样软件相互通用吧。

ai中矢量的元素,是可以直接copy到flash中,在flash中粘贴一下,会弹出下面的

,选择“使用ai文件导入器首选项招贴”,招贴到flash的时候就是矢量的了。

有的时候 ai 中的一些复杂的渐变文件粘贴到flash后会成为位图,这样就得要在ai中把渐变色改成一种纯色,再粘贴到flash中,拉上相同的渐变色。

或是导出为swf,emf,wmf,eps等形式,再导入到flash中,也会有很大成功的机率。

cdr也是一样,不同的是有些cdr效果,要转成eps/emf/wmf 后,用ai再打开,再导出,再导入进flash,反正这样的问题得大家去试。

还有一个重要的是:ai 或 cdr 是有很多里面也是有图的。比如一些大背景,等。如下图:



这是ai中不知道做者在哪儿导进来的,如果我把这个图导出成背景图到flash中,大约60k,这样flash就没有办法做了。我用了一个“抓屏”的方法

,就是把ai中与背景无关的层隐藏掉,只有背景,显示放在100%上,抓一个屏幕,ps中扣出这个背景图,存出去,ok,2.6k.这样导出为jpg,在导

入到flash中,就k数很少了。


B 提供了别的尺寸,要求修改成所需要尺寸的

目标广告超标,要改成标准的。

a 一要检查文字。

因为广告中点内容最多的就是文字,我最近改的一些不知道哪儿做的广告,发现很多文字 都做成了png图,无语。

先看文字,要是做成图了,要重新打字,并把文字打散。再做效果。k数一般都会下来。

有人要问:打散后 如果下次再改文字 ,就有点费力了,因为要重新打字,做效果。这里有个好方法:共享一下,如下:

做文字的时候,用两个图层。第一个层写上你要用的文字,把他变成引导层,第二个层用这个文字打散后做成元件做效果。如图:

文字引导层开放眼睛,场景混乱看不清。因为文字太多了。

关闭眼睛,场景就清晰了,因为备份的内容关了。

对比一下两张的区别,变成小锤子的是我放文字的引导层,不管把这个层的眼睛关掉与否,生成的flash都没有这个层的内容,但这个层的内容在软件中是存在的。

这就可以做成文字的备份层了。

b 二就要看图片。

很多人做广告为了省事。常常在flash中把大图变小。比如我做一个100-300的文件,我的楼图可能很大。导到flash中为了方便,我做成如下:

本图中黄色部门为场景大小,这图很大,

为了达到这样的效果,有很多人用了把大图“遮罩”,甚至把大图拉伸成场景的大小,还有的会把大图打散成矢量,把场景以外无关的部门删除。

这几种都是不行的。只要在flash中编辑大图,不管是删除了还是拉伸,还是切割,结果都是原来大图的k数。

想达到小k数,只能在ps中,处理成和场景 大小相匹配的大小,导入到flash中使用,虽然观看效果一样。但是k数不一样。ps中处理的小。flash中处理则不会小。


c 三 简单图形的图片尽量矢量化。(上面/下面都有详细的介绍)

d 四 重复利用相同的元件 





以上是两个swf的截图,第一个是一个方块,第二个是多个方块。

但是这两个swf都是一样的k数,1.6k。

这是 重复利用同一个元件,第一个swf中是一个背景色,加一个方块的元件。第二个是把这一个方块元件复制了n个,这样,其实就是一个方块元件的k数大小。

如果第二个swf中的所有方块全是单独的矢量文件,并不是同一个元件的复制 ,生成的swf是2.4k,比重复利用
元件的大了0.8k。

此特性可以用在背景图的制作(小图案做成一个元件,复制 平铺),边角装饰物的制作(四个角可以只用一个元件,复制出四个调整角度),重复的文字/效果 等。

e 五 检查“运动补间”



如图: 长补间和短补间生成的k数也不一样。把整个广告所有补间缩短,也会缩小广告的k数。如果只缩短了一处或着几处的补间,没有什么效果。此方法要缩就把所有的补间都缩短,才会看到一些效果。

我经常看到很多人做成:



有一些效果,做成很长的运动补间,这样也会点k的,尽量在广告中不要有这样的长补间,如果有些效果需要长时间循环,可以做成一个影片剪辑,

就可以循环了,解决了长补间的问题。

f 六图片合理拆分 

有些图片实在无法压缩到满意的k数,可以想点其它办法合理分割一下

如图:这张图就是合成的。改后才2k, 

原图 9.6k

分析:原图重要表现的是黄昏的意境,只要有这两人和远山,就行了。我只在ps中做了下面的人和远山的大小,如图:

上面黄色天空是在flash中画的渐变色块。吸好这张图中天空的渐变色就行了。如图:两个层一前一后。就形成了新图,虽然云的部分没有表达出来,
但这不是重要的,这样一下就压下来了。


f 图片gif加描边

还有一种情况:有时很小的图片占用很大的k数。

一般是装饰用的花纹呀,边角类的。如:

这上面的边角小花是png的。占18k.

我改的方法是:扣出来三朵花的一朵,在ps中存成gif图。带透明通道,32颜色。并加上了一个和广告中背景色一样的“杂边”。如图:




这张图中边角小花就是由ps输出的小花,

做成一个元件,复制了三个。变化一下大小。组在一起。形成了一个角的花组。另一个角再复制这个组合就形了。利用了重复元件的原理。

这样,18k的小花,就变成2k的小花了。一下就解决了问题。 
1 保存图片质量

所有广告中用到的图片都要在ps中用  功能,如图:



视图片的色彩/内容等选择来jpg还是gif格式,纯色图片或是色彩细节不多的图,内容不复杂的图,都可以选为gif,色彩过渡丰富或内容复杂的图,选 jpg.
在选gif时,用  这个下拉来选把适当的色彩,以增/减k数,但要注意图片质量,颜色值小图片k数也小,但图片也会虚,反之则大。

在选jpg时,用  这个下拉来选把适当的色彩,以增/减k数,但要注意图片质量,品质值小图片k数也小,但图片也会虚,反之则大。

要找到一个良好的结合点。

例子:a:  格式: jpg  品质: 54  K数:4.85k

例子:b:  格式: gif  颜色: 256  K数:3.25k

例子:c:  格式: gif  颜色: 32  K数:1.72k

以上三个同样的图片,视觉效果基本一样,不存在视觉花屏现象,但三种格式,K数也不同。第三种最小。

2 内容矢量化

除了广告中用到的图片处理成最小之外,尽量做到其它内容 矢量化 ,包括背景图,文字,装饰物等。

也就是说除了客户要求的图片用上之外,最好不要再用其它图片了。客户没有提供矢量格式的,如果简单的东西,自己在flash里描一下。变成矢量的。

如图:本logo只有jpg格式,但这样的logo或是图片因为造型比较简单,可以在flash中,建立两个层,把本原logo放在下面层并锁定

在上一层图层中用直线工具,配合直线的转曲等功能,描边出来,在填充上颜色,还原出一个矢量的logo。

4 文字选择适当的安体,并打散为矢量形状。 

所用的到的文字,首选 方正大黑,方正大标宋等,常归字体,字体不同k数也不同,这几个是常见的打散后占k不大的字体。

字体一定要打散成矢量后再做效果。至于怎样做字体的备份,上面有讲到。好好看吧。


还有很多呢,真的写不动了,这些大家要是都能消化就很好了。
以后希望大家广告按标准走,听说现在要抓超标的,会罚钱的,当然也有实在压不下去的。做个6.7屏的内容谁也不好压。
一般我们这出的广告都在四屏内。做设计的有责任和销售做斗争!客户说分7屏我们要勇敢的回绝掉。做设计也有要自己的想法,
不能只做别人的工具!(打字匆忙,如有错字,兄弟姐妹们包涵!!)
 
 
原文链接:http://tws.fang.com/adys/index.html

分类:

技术点:

相关文章: