课件29张PPT。第5课 制作动画“草地上的毛毛虫” 教学目标1、了解逐帧动画的基本知识。
2、能制作简单的逐帧动画。重点难点1、了解逐帧动画的基本知识。
2、制作简单的逐帧动画。教学导入 从今天起,我们要开始学习Flash 8.0的动画制作了,我们先从“逐帧动画”学起。“逐帧动画(Frame By Frame)”是一种常见的动画手法,它的原理是在“连续的关键帧’’中分解动画动作。也就是说,在逐帧动画中,每一帧中的内容都是不同的,将这些帧连续播放后就形成了动画。 一、逐帧动画的概念 在时间帧上逐帧绘制帧内容称为逐帧动画。由于逐帧动画的帧序列内容不一样,这不仅增加了制作负担,而且最终输出文件也很大。但是,它的优势也很明显:因为是一帧一帧的画,电影的播放模式相似,所以逐帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容,如3D效果、人物或动物急剧转等等很细腻的动画效果。
逐帧动画在时问帧上表现为连续出现的关键帧,每个关呵帧中都有一个独立的动画信息(如图5-1所示)。 二、创建逐帧动画的几种方法1、用导入的静态图片建立逐帧动画
将JPG、PNG等格式的静态图片连续导人Flash中,这样就能建立一段逐帧动画。
2、绘制矢量逐帧动画
使用鼠标或者电子画板在场景中一帧帧地画出每帧所需的内容。
3、文字逐帧动画
用文字作帧中的元件,实现文字跳跃、旋转等特效。
4、导入序列图像
可以导人GIF序列图像、SWF动画文件或者利用第三方软件(如Swish、Swift 3D等)产生的动画序列。三、绘图纸功能 绘图纸是一个帮助定位和编辑动画的辅助功能,这个功能对制作逐帧动画特别有用。通常情况下,Flash在舞台中一次只能显示动画序列的单个帧,而通过使用绘图纸功能,就可以在舞台中一次查看两个或多个帧。
当创建好一个动画后,我们可以用鼠标左键单击时间轴下方的“绘图纸外观”按钮,这样就可以切换到“绘画纸外观”(如图5-2所示)。
图5-3所示的是使用绘图纸功能后的场景。可以看出,在当前帧中内容用全彩色显示,其他帧的内容以半透明显示时,看起来好像所有帧的内容都画在一张半透明的绘图纸上,这些内容相互层叠在一起。使用绘图纸功能有助于我们观察动画中的每一帧的情况,发现问题并及时进行修改。当然,即使在绘图纸模式下也只能编辑当前帧的内容。四、动手制作逐帧动画 学习了逐帧动画的特点和创建方法后,现在就让我们来动手制作逐帧动厕,以加深对逐帧动画的认识。
一条毛毛虫在一片绿色的草地上快速前行,这是一个利用导人连续位图而创建的逐帧动画(如图5-4所示)。 在下面的逐帧动画制作过程中,我们会用到一张包含有动画序列的GIF图片和一张作为背景的JPG图片。同学们在开始制作逐帧动画以前可以到互联网上搜索自己喜欢的动画图片和背景图片,虽然图片的内容各不相同,但是制作逐帧动画的方法与过程是相同的。操作步骤 步骤1:执行“文件”→“新建”命令,在弹出的“新建文档”对话框中选择“常规”选项卡中的“Flash文档”选项,点击“确定”按钮,新建一个影片文档。
步骤2:将“图层1”重命名为“草地”,用鼠标单击选中时间轴上的第一帧,然后执行“文件”→“导入”→“导入到舞台”命令,将名为“草地.jpg"的图片导入到场景中,使用“任意变形工具”将图片的大小调整到与舞台尺寸相同(如图5-5所示)。 步骤3:新建一个图层并命名为“毛毛虫”,选择第一帧,执行“文件”→“导入”→“导入到舞台”命令,将名为“毛毛虫.gif”的图片导入,Flash 8.0会自动把GIF图片序列按序以逐帧形式导入舞台(如图5-6所示)。 GIF图片序列被Flash导入后,它们就被Flash自动分配叫关键帧中,有多少个图片序列就会创建多少个关键帧。
此时,时间帧区出现连续的关键帧,从左向右拉动时间轴上的播放头,就会看到毛毛虫在向前移动(如图5-7所示)。 通过预览我们会发现,被导入的图片序列的位置不是我们需要摆放的地方,默认状况下,被导入的对象都被放在场景坐标中“0,0”处,必须通过调整使它们移动到合适的位置上(如图5-8所示)。
我们可以一帧一帧地调整位置,完成一幅图片后记下其坐标值,再把其他图片设置成相同坐标值。不过这样做太耗费时问了,好在Flash 8.0为我们提供了更方便的功能——“多帧编辑”。
操作步骤步骤1:
先把“草地”图层加锁,然后按下时间轴面板下方 的“编辑多个帧”按钮,再单击“个改绘图纸标记”按钮,在弹 出的菜单中选择“绘制全部”选项。步骤2:
执行“编辑”→“全选”命令,此时我们可以看到,时间轴中的全部帧和场景中的全部元件都被选中了。步骤3:
用“选择工具”对们于场景上方的毛毛虫进行拖动,就可以一次把所有帧中的图片全部移动到场景中的指定位置了。步骤4:新建一个图层并命名为“标题”,单击工具箱中的“文本工具”按钮,在“属性”在板中进行设置,其参数如下:文本类型“静态文本”,字体为“黑体”,字体大小为“45”,颜色为“深绿色(#006600)”。
步骤5:在文本框输入“草地上的毛毛虫”几个字,然后将 其移动到合适的位置。 此时,“草地上的毛毛虫”已经基本制作完毕,不过还有一点小问题,当使用播放头浏览动画过程的时候会发现,“草地”背景只在第一帧出现。那是因为我们没有给“草地”背景添加过渡帧。首先应给“草地”层解锁,然后在第20帧的位置点击鼠标左键选中该帧,按下键盘上的【F5】键插入一帧,程序会自动添加过渡帧使帧内容延续(如图5-13所示)。小知识 还有两种方法可以插入帧:一种是在“时间轴”上要插入帧 的地方点击鼠标右键,在弹出的快捷菜单中选择“插入帧”命令;另外还可以通过执行“插入”→“时间轴”→“帧”命令来完成插入帧的操作。思考:为什么要到最后才给“草地”层添加过渡帧呢?(因为我们首先创建了“草地”层,但当时并不知道整个动画的长度,所以要等动画制作完成后才添加。而“标题”层是最后创建的,所以自动添加了过渡帧。现在3个图层的帧数是20,这样 就能保证动画的完整了)。测试存盘 动画制作完成了,应该先预览一下。执行“控制”→“测试影片”命令,这时会弹出一个动画播放窗口。仔细观察动画有无问题,如果满意,就将它保存起来。执行“文件”→“保存”命令,随后会弹出一个“另存为”对话框。在这里我们可以 设置文件存放的路径和文件名,我们将文件命名为“草地上的毛毛虫”,以“FLA”的文件格式存盘。
FLA的文件格式是Flash的播放文件,就要使用Flash的“发布设置”功能了。要发布Flash文档,请首先选择发布文件 格式,执行“文件”→“发布设置”命令后就会弹出“发布设置”对话框,在“发布设置”对话框中可以设置要发布的文件模式、文件名称、保存目录等,设置完毕后单击“发布”按钮就可以导出Flash的播放文件。想一想
1、既然完成“毛毛虫”层的制作后再添加图层可以自然添 加过渡帧,那为什么我们要先制作“草地”层呢?
2、为什么使用“绘图外观”功能时只有当前帧中的内容用 全彩色显示,而其他帧的内容却是半透明的呢?课堂练习 1、结合所学内容制作一个简单的逐帧动画。
2、使用“发布设置”功能尝试发布各种不同的文件。全课小结 同学们,在这一节课里,你有什么收获呢?THANK YOU