计算机多媒体技术模块4-Flash动画设计.ppt

1、模块4 Flash动画设计 通过“逐帧动画制作”、“形状补间动画制作”、“传统补间动画制作”、“遮罩动画制作”、“路径引导动画制作”5个案例的学习掌握Flash cs5的工作界面、常用绘图工具的使用方法和逐帧动画等五种基本类型动画的制作方法、基本步骤及常用动画制作及设计技巧。教学目标：教学目标：教学要求：教学要求：知识要点能力要求关联知识Flash CS5操作基础知识掌握Flash CS5操作界面、时间轴和面板等的基本操作方法，绘制图形的方法逐帧动画掌握帧和图层的操作方法元件、实例和库掌握创建、编辑、使用和管理元件及元件实例的方法补间动画重点掌握补间动画的创建方法高级动画掌握利用遮罩层、引导层

2、制作动画案例案例1 逐帧动画制作案例目标案例目标 初识Flash CS5动画制作软件。了解Flash CS5界面，掌握Flash CS5操作基础知识。掌握逐帧动画的制作原理及方法。案例说明案例说明 本案例是在蔚蓝的天空中，一只老鹰在从左至右由近及远地飞翔，这是一个利用导入*.gif动画而创建的逐帧动画完成过程完成过程：1.新建文档2.创建背景图层.导入GIF动画4.调整对象大小及位置5.测试存盘相关知识相关知识 1.Flash CS5简介简介 Flash CS5是Adobe公司开发的一款集动画设计Web网页站点开发等功能于一身的优秀软件。从简单的动画到复杂的交互式Web应用程序，从丰富的多媒体

3、支持到流媒体FLV视频文件的在线播放，Flash CS5给了你更多的想象空间和技术支持，你可以结合个人的创意做出有声有色的动画作品及互动性商业网站等。Flash中有5种常见的动画形式：逐帧动画、形状补间动画、传统补间动画、遮罩动画、引导线动画。Flash CS5【开始】页面2.2.文档选项卡文档选项卡 新建或打开一个文档后，在“主工具栏”的上方会显示出该文档的标签（一般叫“文档选项卡”）。如果打开或创建多个文档，“文档名称”将按文档创建的先后顺序出现在“文档选项卡”中。只要单击文件名称，即可快速切换到该文档。用鼠标右键单击“文档选项卡”，在弹出的菜单中可以快速实现【新建】、【打开】、【保存】等

4、功能。【文档】选项卡 3.3.时间轴时间轴 时间轴用于组织和控制文档内容在一定时间内播放的图层数和帧数。Flash文档将帧作为时长的基本单位。图层就像堆叠在一起的多张幻灯胶片一样，每个图层都包含一个显示在舞台中的不同图像。时间轴的主要组件是图层、帧和播放头。4.4.工具面板工具面板 位于工作界面左边的长条形状就是工具面板（也称“工具箱”），工具面板是Flash中最常用的一个面板，用鼠标单击即可选中其中的工具。5.5.舞台舞台 舞台位于工作界面的正中间部位，是创建Flash文档时放置图形内容的矩形区域，这些图形内容包括矢量插图、文本框、按钮、导入的位图图形或视频剪辑等。Flash创作环境中的舞台

5、相当于Macromedia Flash Player 或Web浏览器窗口中在回放期间显示Flash文档的矩形空间。6.6.常用面板简介常用面板简介 默认状态下，在舞台的正下方有4个比较常用的浮动面板，分别是【动作】面板，【属性】面板，【滤镜】面板和【参数】面板。只要单击面板的标题栏名称，即可展开该面板。再次单击该标题栏，可最小化面板。7.7.设计面板组设计面板组 打开【窗口】菜单，可以看到所有的面板被横线分成了几个组，第4组是一些与设计，绘画有关的面板，使用这些面板，可以完成绘制图形，调整位置，改变颜色等工作。“设计面板组”中包括【对齐】面板，【颜色样本】面板，【混色器】面板，【信息】面板和【

6、变形】面板。8.基本绘图工具的使用9.逐帧动画 逐帧动画是一种非常常见的动画形式，它的原理是在每一帧中设置不同的画面，连续播放而形成动画。案例2 形状补间动画制作案例目标案例目标了解形状补间动画基础知识及特点。掌握形状补间动画的制作原理及方法。案例说明案例说明本案例是用30帧实现将一个绿颜色的矩形变为红颜色的圆形的动画。通过形状补间动画，可以创建类似于形变的效果，使一个形状看起来随着时间变成另一个形状。运用它可以制作出各种奇妙的变形效果。完成过程完成过程:1.新建文档2.画矩形3.画椭圆形4.形成形状补间动画相关知识相关知识1.形状补间动画基础知识（1）制作原理 在一个关键帧中绘制一个形状，然

7、后在另一个关键帧中更改该形状或绘制另一个形状。Flash 根据二者之间的形状来创建的动画被称为“形状补间动画”。（2）动画的元素 形状补间动画可以实现两个图形之间颜色、形状、大小、位置的相互变化，其变形的灵活性介于逐帧动画和传统补间动画二者之间，使用的元素多为用鼠标或压感笔绘制出的形状，如果使用图形元件、按钮、文字、则必须先“分离”才能创建变形动画。逐帧动画的帧表现形式（3）在时间轴上的表现（4）制作方法2.形状补间动画的属性面板功能简介3.使用形状提示 形状补间动画看似简单，实则不然。Flash在“计算”2个关键帧中图形差异时，远不如人们想象中的那么“聪明”，尤其前后图形差异较大时，变形结果

8、会显得杂乱无序，这时，“形状提示”功能会大大改善这一情况。(1)形状提示的作用 在“起始形状”和“结束形状”中添加相对应的“参考点”，使Flash在计算变形过渡时依一定的规则进行，从而较有效地控制变形过程。(2)添加形状提示的方法 先在形状补间动画的开始帧上单击一下，在执行【修改】|【形状】|【添加形状提示】命令，该帧的形状上就会增加一个带字母的红色圆圈。案例3 传统补间动画制作案例目标案例目标 了解传统补间动画基础知识及特点。掌握传统补间动画的制作原理、方法及技巧。案例说明案例说明 本案例效果为天空中左下角的飞机逐渐飞向右上角，由近及远，飞机变得越来越小越来越模糊。请在案例中详细了解传统补间

9、动画的创建方法及特点。完成过程完成过程1创建影片文档2导入背景图片3新建飞机元件4利用飞机元件制作动画相关知识相关知识1传统补间动画基础知识 传统补间动画也是Flash中非常重要的动画之一，与形状补间动画不同的是，传统补间动画的对象必须是“元件”或“成组对象”。运用传统补间动画，可以设置元件的大小、位置、颜色、透明度、旋转等种种属性，配合其他方法，你甚至能做出令人称奇的仿3D的效果来。2传统补间动画的属性设置案例4 遮罩动画制作案例目标案例目标了解遮罩动画的概念。掌握遮罩动画的制作原理、方法。案例说明案例说明 本案例效果为随着正圆形的视窗左右运动来显示英文字母“Happy Birthday”。

10、完成过程完成过程1新建文档2创建元件3创建动画相关知识相关知识1遮罩动画的概念 常常看到很多具有眩目效果的Flash作品，而其中不少就是用最简单的“遮罩”完成的，如水波、万花筒、百叶窗、放大镜、望远镜等。2创建遮罩的方法（1）创建遮罩 在Flash中没有一个专门的按钮来创建遮罩层，遮罩层其实是由普通图层转化的只要在某个图层上单击鼠标右键，在弹出的菜单中选择【遮罩层】，该图层就会成为遮罩层，“层图标”就会从普通层图标 变为遮罩层图标，系统会自动把遮罩层下面的一层关联为“被遮罩层”。（2）构成遮罩和被遮罩层的元素 遮罩层中的图形对象在播放时是看不到的，遮罩层中的内容可以是按钮、影片剪辑、图形、位图

11、、文字等，但不能使用线条。如果一定要用线条，可以将线条转化为“填充”。被遮罩层中的对象只能通过遮罩层中的对象被看到在被遮罩层中，可以使用按钮、影片剪辑、图形、位图、文字、线条。（3）遮罩中可以使用的动画形式 可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段，从而遮罩动画变成一个可以施展无限想象力的创作空间。案例5 路径引导动画制作案例目标案例目标掌握创建引导路径动画的方法。掌握应用引导路径动画的技巧。案例说明案例说明 本案例为宇宙中一个运动的星球沿着椭圆轨迹围绕另一个星球运动效果的引导路径动画。完成过程完成过程1新建文档2创建元件3创建动画相关知识相关知识

12、1.创建引导路径动画的方法（1）创建引导层和被引导层（2）引导层和被引导层中的对象（3）向被引导层中添加元件2.应用引导路径动画的技巧（1）“被引导层”中的对象在被引导运动时，还可以做更细致的设置，比如运动方向，在【属性】面板上，选中【调整到路径】复选框，对象的基线就会调整到运动路径。（2）引导层中的内容在播放时是看不见的，利用这一点，可以单独定义一个不含“被引导层”的“引导层”。该引导层中可以放置一些文字说明、元件位置参考等，此时，引导层的图标为。（3）在做引导路径动画时，单击工具箱中的【贴紧至对象】按钮，可以使“对象附着于引导线”的操作更容易成功，拖动对象时，对象的中心会自动吸附到路径端点

13、上。（4）过于陡峭的引导线可能使引导动画失败，平滑圆润的线段才有利于引导动画的成功制作。（5）向被引导层中放入元件时，在动画开始和结束的关键帧上，一定要让元件的注册点对准线段的开始和结束的端点，否则无法引导。如果元件为不规则形，可以点击工具箱中的【任意变形工具】，调整注册点。（6）如果想解除引导，可以把被引导层拖离“引导层”或在图层区的被引导层上单击右键，在弹出的菜单上选择【属性】，在对话框中选择“一般”，作为正常图层类型，（7）如果想让对象做圆周运动，可以在“引导层”画一根圆形线条，再用【橡皮擦工具】擦去一小段，使圆形线段出现2个端点，再把对象的起始、终点分别对准端点即可。（8）引导线允许重

14、叠，比如螺旋状引导线，但在重叠处的线段必须保持圆润，让Flash能辨认出线段走向，否则会使引导失败。经验指导经验指导1.在文本编辑时，对于输入的文本，我们除了可以使用“任意变形工具”对其进行变形操作外，还可以为其添加滤镜，从而美化文本。此外，还可以按快捷键【ctrl+B】将文本分离为矢量图形，然后使用“选择工具”任意调整其形状。2.在Flash动画中，每一个图层都拥有独立的时间轴，可以在不同的图层上制作动画的不同部分。3.图形元件的时间轴是附属于主时间轴的，并与主时间轴同步，因此，将带有动画片段的图形元件实例放在主场景的舞台上时，必须在主时间轴上插入与动画片段等长的普通帧，才能完整播放动画；而影片剪辑的时间轴是独立的，即使主时间轴只有1帧，也可以完整播放其中的内容。4.在传统补间动画和补间动画的开始帧和结束帧中只能有一个补间对象。其中，传统补间动画的创造对象只能是元件实例，补间动画的创建对象可以是元件实例或文本，而形状补间动画的创建对象只能是分离的矢量图形。5.创建引导动画时，位于被引导层中的对象将沿着用户在引导层中绘制的引导线运动。要注意的是，一定要将对象的变形中心的吸附到引导线上，此外，引导线的转折点过多、转折处的线条转弯过急、中间出现中断或交叉重叠现象，都可导致Flash程序无法准确判定对象的运动路径，导致引导失败。