会动的爆炸图片素材

Flash大型动画贺卡制作例解

一、如何查看源代码

这个动画中包含的物件,素材等都比较多,因此我们也特地把源代码提供给大家下载。这可是第一次提供大型动画源代码哟!源文件文件下载地址是:

。下载完成后先播放观看几遍ycard,以加深对动画效果的认识。好了,现在运行你的Flash

6,打开文件(别告诉我你还没当下来)同时建立一个新文件。我们根据这个动画源文件逐步讲述制作过程。切换至新文件,选择Modify(修改)菜单下的Movie(影片),在弹出的对话框中如下图进行设置(图2)。

Forame

Rate播放速度为每秒20帧(高一些的播放速度可以使动画更加流畅)。Width宽和Height高分别为500和400像素,设置完成按OK关闭。然后画两个黑色长方形遮在画面上下,产生宽银幕的遮边效果(看图1静止帧你就看得出来),并将遮边所在的层锁定,其他的动画元素所在的层都处于遮边层之下。

二、动画开场

基本工作完成后我们开始编辑动画。切换至,先看Loading部分,是背景不断变换,这是用两张图片不断交替隐现产生的。按“Ctrl+L”打开Library库面板,在其中的序幕文件夹中有一个背景循环的Movie

Clip影片夹子,在它上面点右键选择Edit进行编辑,进入背景循环工作区,我们看它的Timeline时间线(图3)。

可以看到,这个隐现过程包含两个层,上下两层其实是一个图片,只是做了一个反转,然后设置上层第一帧为显现,第十五帧透明度为“0”隐藏,设置Motion变化。产生一个渐隐效果,而下层正好相反,产生渐现感。这个红色背景是导入的位图文件,它在Library面板序幕文件夹的红色背景Graphic图形物件中。在必要时可以进入其工作区选择File菜单下的Import导入新图将其换掉,注意保持大小一致。

返回主场景,在Loading部分画面中间还有一个《电脑报》的Logo(标志),它位于Library面板“序幕”文件夹的祝贺Logo

Graphic物件内,可以在其上点右键选择Edit进入工作区。Library是Flash中非常重要的一个工具面板,我们制作动画时所有的元素,包括声音、图片、文字等都存放在Library中,可以用“Ctrl+L”快捷方式打开。OK!接下来还有一个Loading...的文字,是一个MovieClip,在Library中的名字是loading,过后有一个Complete提示,在主场景的Loading完成层中,进行黑白颜色变换产生闪动。我们看主场景Timeline,在Loading层的5、6、9、10帧上分别有简单的Actions,设置它们循环,当影片装载完成后跳至完成提示。Loading完成的18帧同样有一个

Actions,功能为Stop,因为动画是要用按钮进行播放的。Play按钮在Library按钮文件夹中。同时注意,按钮层处于黑色遮边层之上,不然显示不到,我们设置它的Actions为gotoAndPlay19。

三、闪烁效果

这是动画的开场部分,你可以按照你的素材进行编辑,或者你比较懒,直接把源文件的素材替换掉就可以了。我们接着让动画开始播放。下面的动画有不断的闪动反转片效果,看起来炫,其实很简单。我们来看白色闪光那一层(图4)。

创建一个Graphic物件,然后在里面画一个白色矩形,拖入场景内并调整大小直至遮住整个画面,然后设置闪动效果。如图中的Timeline设置,透明度由0快速过渡到100不透明,然后再过渡至透明,接着65透明度跳跃至0,40跳跃至0,这样效果就出来了。自己动手试试,不过不要闪得太厉害,小心眼睛:

注意:随着第一次白色闪动完成,背景已经换掉了。思考一下,当白色闪至不透明时,将新的背景放入场景,当白色闪烁过渡至透明,新的背景也逐渐显现了。新背景出现后开始闪烁,还有反转片的效果,那其实是两张相同的图,一张在

Photoshop中做了色彩反相处理(图5)。

在背景的变换过程中,始终穿插着文字的闪烁。文字是一个Graphic物件,位于Library面板的文字中。依然通过快速变化实现闪烁效果,并依次闪烁出C、P、C、W。这里就一个小技巧,我们可以把所有文字放在一个Graphic中,每帧一个文字。拖入场景,这样文字会随着Timeline的播放而变化,而我们需要出现某个特定文字的时候,可以用到Instance面板(快捷方式

“Ctrl+I”例如P字母处于文字符号的第二帧。那么我们设置Instance面板为SingleFrame单帧模式。First为2(图6)。

影片继续播放,出现《电脑报》文字以及网址,使用简单的隐现效果。然后进入到下一个画面:小编拜年标题部分。背景也相应切换至一个有中国传统风格的图形,它位于Library面板的“传统红色”物件内。接着掉下来一个报社的红色Logo。你可以在Library序幕中的“祝贺Logo”中找到。做法非常简单。先把我们已经做好的文字放进去,然后用矩形工具画一个正方形,填充为红色,再用铅笔画一些黄色的小点,通过旋转工具做成动画中的形状。有兴趣画一个自己的Logo放进去。接着会有“小编大拜年”这几个造型字。在Library的“传统文字”中,你可以根据自己的想法修改。这个文字的绘制方法也很简单,先画一个黑色圆形,再输入文字“小”,选择一种有书法感的字体,如果你的系统中没有一样的字体也没关系,选一种近似的就可以,设置为土黄色。“编”的做法一样。下面“大拜年”这三个字使用了描边,先输入文字,“Ctrl+B”将其打散。通过墨水瓶工具做一个黄色描边,即可完成。

四、绘制鞭炮

下面出现的两串鞭炮比较费工夫。要先用工具栏中的画图工具画出一个鞭炮的形状,填色备用(图7)。

按照图7的步骤画出鞭炮,最后记住使用渐变工具多试几次红色渐变,直到满意为止。接着要制作鞭炮动画了,一长串鞭炮噼里啪啦慢慢放完,这个工作没有捷径,只能发扬“钉子精神”,一点一点手工完成,方法是这样的,先在Insert菜单New

Symbol下建立一个Movie

Clip影片夹子,然后把刚才画好的鞭炮物件从Library面板拖进来,使用“旋转”工具调整倾斜度,再拖进来一个鞭炮,调整倾斜度,一直这样排列完成整串鞭炮。不要着急,要有耐心。这才刚开始呢!

耐着性子终于做好鞭炮后,我们准备点燃鞭炮了。建立一个新层,画两个爆炸后的火花,因为两个火花不够表现效果,而都画在同一层的话又容易出现粘连,因此建立新层来画,做完之后调整好位置。接下来是燃放过程,依然要发挥一下刚才的“钉子精神”,在鞭炮层内隔两三帧插入一个关键帧,然后从最底部删除一两个鞭炮,调整火花位置,依次插入关键帧,删除鞭炮,调整火花位置直到这串鞭炮放完。真是麻烦,还不如到楼下商店买串真的一放多省事(图8)。

五、图片的扫描效果

现在我们回到主场景,从Library面板把鞭炮动画拖入场景,左右各一串,左边的那串小一点,调整好位置。动画中两串鞭炮是从上面一前一后甩下来的,因此我们要做一个简单的Motion来达到效果。先将鞭炮放在场景上方,然后空十几帧插入一个关键侦,再将鞭炮移动到要出现的位置,设置好Motion运动,鞭炮从顶部甩下来的效果就出来了。鞭炮放完后转场进入场景2,我们可以点击Timeline右上角的Edit

Scene按钮在两个场景之间切换(图9)。

进入场景2。也就是我们这个动画的主要内容区域,《电脑报》各个版块编辑照片,老编故事以及贺词等都会在这里出现。内容多多,大家快来吧。在这里古朴的背景经过闪动被一个科技背景所取代,这个背景图在Library照片文件夹“科技背景”内(你可以直接弄张图替换它)。接着便是各大版块的编辑开始亮相,我们设计了一种扫描效果,扫描完成后照片逐渐显现(图10)。

我们来看下这个效果的实现方法。首先,场景中出现一个照片外轮廓的扫描线。这是一个Mask效果,先画一个矩形方框至合适位置,删除中间的填充只保留边线部分。这个是轮廓边线层,接着建立一个新层处于它之下,做一个矩形渐变填充,并进行Shape边画,从左边移动至右边(图11)。

移动完成后在边线层点右键选择Mask,测试,无效果,这是因为在Flash中Line的对象不能进行Mask操作,需要先将其转换为Fill模式。我们选中边线,在Modify修改菜单下的Shape形状子项里选择Convert

Lineto

Fill命令将边线转换为Fill模式,再次测试,完成效果。接着还有轮廓内部的两次扫描动作。同样是一个Mask效果,因为我们只需要让这个扫描效果出现在边框线内部,因此做一个矩形,调整大小和位置与边框线内大小相同。用同样方法制作一个渐变填充的运动。这次在填充上要有一定要求,因为扫描尾部是逐渐隐没的,因此需要进行一次白色至透明的渐变填充。从Windows菜单Panels下打开Fill面板,选择左边的填充滑杆,然后打开Mixer面板,将Alpha透明度设置为“0”(图12)。

设置好以后对这个透明渐变进行Shape移动操作,这次从左移动至右边后还要再次移动回来,这样才完成一个扫描循环,给照片出场铺路。OK,完成以后该出现照片了,照片有一个独立的层,以渐显的方式出现。从现在起出现的9张照片及版块介绍模式都一样,因此我们把照片放在一个独立的Graphic中,每帧一张照片,这样我们在切换照片的时候就可以通过前面学习的技巧用Instance面板来指定。因为位置与大小的关系,照片的尺寸最好要保持一致,这样才能保证不错位。

接下来出现的是各版块的名称和祝词,跟制作照片的方法一样,做到一个Graphic中,用Instance面板来控制该出现哪个。同时你肯定注意到了,背景图也在不断闪动,其中包含前面提到的白色闪动,还有就是颜色会不断地变化。这是用Effect面板的Advanced高级色彩进行调整(图13)。

Flash中的这个功能非常强大,不仅可以调整透明度,还可以对每种单色的比率数值进行精确调整,通过它,我们就可以对背景图片产生非常多的色彩效果。

照片依次介绍完成之后就是老编故事。随着一阵笑声,老编出场(他有“伪善”的笑容,“狠毒”的心肠,让小编们整天“提心吊胆”,所以我们使用黑色的背景衬托出那种气氛),照片和文字的出现上使用简单的Motion透明渐现渐隐。通过照片配以文字的方式刻画出老编的形象,最后以一句:“会吗?小编天真地想!”结束。如果大家的贺卡也有这种场景的需要,嘿嘿,换张照片肯定经典。

六、影片收尾

随后礼花炸开出现电脑报的字样,至此动画基本播放完成,进行收尾工作,传统图案的背景逐渐出现,放出一张全体编辑的合影,旁边缓慢地出现上滚的贺词。由于要让贺词只在出现的地方滚动,因此我们还要做最后一个Mask,先做好祝贺文字的Graphic物件,然后建立一个MovieClip用来实现文字滚动,在第一层内画一个矩形,它是文字需要出现的区域,注意大小。然后建立新层,使它处于矩形层之下,将贺词放进来做一个缓慢向上移动的Motion,过渡帧越多,移动越慢。然后在矩形层名称区点右键选择Mask,滚动文字创建完成,将它放入场景中。动画制作基本结束(图14)。

此外,还要做一个重复播放的按钮,创建一个按钮,起名Replay,将其放到左下角位置,设置Actions跳转并播放场景一的第一帧。代码如下。

on(release){

gotoAndPlay("Scene1",1):

}

至此,动画基本完成,接下来的工作就是要给动画加上音乐,我们动画中的背景音乐一共分四段,第一段在开场部分,第二段在照片展示部分,第三段是老编故事的吓人音乐,最后是结束后贺词的背景音乐。同时场景中还有一些事件声音(比如鞭炮什么的)。

七、添加音效

好,现在我们来看看动画中的音乐是如何配进去的。回到场景一从头开始。打开Library面板可以在Sound文件夹中找到我们导入的一些音效。这里的音效大部分来自闪盟在线(

)。在场景一的背景音乐层中第20帧是我们插入的音乐,因为前面是Loading部分,装载完后会停下来,当我们点了Play按钮以后动画正式播放,背景音乐也跟着响了起来。接着在Layer

33的第149帧我们放了一个物体掉在地上的声音,刚好配合小编的“小”字掉下来。紧跟着大拜年三个字落下,因此在层Layer32的176帧插入了一个物体砸下的声音。在层Layer

30和Layer

31帧配合鞭炮我们特地找到了鞭炮爆炸的效果加进去。这样场景一的配音完毕,我们跳转至场景二中。随着几下闪动,切换至有科技色彩的背景中,我们挑选轻快节奏的音乐开始播放。注意听,它的声音是由小至大开始的。这里,我们用到了Flash中的声音渐现Fade

in(图15)。

我们在Sound面板的Effect项中选择Fade

in来实现。由于这段音乐播放时间有限,而我们的动画又比较长,因此在Loops循环项中我们设置了6次循环。背景音乐完成后开始配合照片扫描的效果音乐,大家可以听到,当照片边线闪烁的时候有一个电流的声音,我们把他加在了Layer36的第70帧,照片边线闪烁的时候。在后面的动画中,照片会依次出现,因此我们这个音效要依次加到每张照片的边线闪烁里。

完成后照片内部同样还要扫描两次,我们挑选了扫描的声音,并准备在Layer35出现两次,在后面的照片中以同样的方式出现(图16)。

后面,老编出场时Layer

38的1223帧配上背景音乐,跟着笑声在层“怪笑”的第1236帧响起来。礼花部分配合了爆炸的声音。最后,动画结束的时候要响起结束的背景音乐。我们把它放在最后一帧,同时设置一个Stop停止操作,不然播放完后会自动跳转从头播放。

提示:如何调整更换的素材尺寸

不过在替换时注意与原素材的尺寸位置,如果不一致的话有可能出现错位。这里还有一个小的技巧。选择Windows菜单Panels下的info面板(图17)。在这个面板里你可以看到,选中任何一个物件,在面板上就会出现相应的宽高与坐标位置,我们可以用这个工具以像素级精度进行物件的大小及位置调整,如果你要替换素材的话,这个面板起到的作用很大,它可以调节物体的大小、位置等,最起码比瞪大双眼用鼠标一点点拖动轻松得多。

提示:如何替换Library中的图片

按“Ctrl+B”打开Library库面板,在照片文件夹的科技背景Graphic物件上点右键选择编辑进入它的工作区。先建立一个新层,用File菜单的Import命令导入一张替换新图片,完成后我们需要将新图片的大小与位置与原来的素材保持一致(要做到一丝不差,不然的话在动画中会出现错位)。

现在教大家如何精确调整新图与原图的大小。使用info面板,选择原图,在info面板中出现了相关数据,我们得到W宽183;H高124;X坐标-91.5,Y坐标-62。得到这些数据后记下来,再选择新图,把刚才得到的原图的数据填进去。这样,两张图片的大小和位置就绝对一致了。

如何替换Library中的声音

声音的替换相对简单些,将你准备的声音导入后,它会出现在Library面板中,然后我们在需要替换的位置建立新层插入关键帧,将声音拖进来并把原来的声音层删掉就可以了。