网页动画设计与制作Flash MX 2004 教学课件 作者 陈永东 项目7-一般动画的设计.ppt

《网页动画设计与制作Flash MX 2004 教学课件 作者 陈永东 项目7-一般动画的设计.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、网页动画设计与制作Flash项目七一般动画的设计项目七一般动画的设计【项目背景】小张在进入一家网络公司一段时间后，已经能够使用网页动画设计软件的基本功能。现在，公司经理要求他为电子商务网站设计一些常用的一般动画，包括依次显示公司名称的动画、产品图片沿某个路径运动的动画、形状变化的动画、望远镜动画等。【项目分析】1．常用的一般动画设计方法分哪几种？2．应该在什么场合选取哪种类型的动画设计方法？【任务分解】任务1：设计逐帧动画。任务2：设计渐变动画。任务3：设计引导层动画。任务4：设计遮罩动画。任务1设计逐帧动画读懂时间轴上动画的表示方式。创建逐帧动画。了解时间轴按钮。使用绘图纸方式扩

2、展观察方式。1．读懂时间轴上动画的表示方式（1）补间动作：用起始关键帧处的一个黑色圆点指示，而中间的补间帧有一个浅蓝色背景的黑色箭头。（2）补间形状：用起始关键帧处的一个黑色圆点指示，而中间的帧有一个浅绿色背景的黑色箭头。（3）虚线标记，表示补间是断的或不完整的。（4）单个关键帧：用一个黑色圆点表示。单个关键帧后面的浅灰色帧包含无变化的相同内容，并带有一条黑线，而在整个范围的最后一帧还有一个空心小矩形。（5）出现一个小a标记，表明已利用“动作”面板为该帧分配了一个帧动作。（6）出现红色小旗标记，表明该帧包含一个标签或注释。（7）出现金色的锚记，表明该帧是一个命名锚记。2．创建逐帧动

3、画（1）单击层名称使之成为活动层，然后在动画开始播放的层中选择一个帧。（2）如果该帧不是关键帧，可执行“插入”→“时间轴”→“关键帧”命令，使之成为一个关键帧。（3）在序列的第一个帧上创建插图。此时，可以使用绘画工具，也可以从剪贴板中粘贴图形，或导入一个文件。（4）单击同一行中右侧的下一帧，然后执行“插入”→“时间轴”→“关键帧”命令，或者右键单击它，然后从快捷菜单中选择“插入关键帧”。这将添加一个新的关键帧，其内容和第一个关键帧一样。（5）在舞台中改变该帧的内容，设计动画接下来的变化或新增的信息。（6）为了完成逐帧动画序列，可重复第4步和第5步，直到创建了所需的动作。（7）如果要

4、测试动画序列，可执行“控制”→“播放”命令，或单击“控制器”上的“播放”按钮。3．了解时间轴按钮4．使用绘图纸方式扩展观察方式1（1）在舞台上同时查看动画的几个帧：可以单击“绘图纸外观”按钮。在起始绘图纸外观和结束绘图纸外观标记（在时间轴标题中）之间的所有帧被重叠为“文件”窗口中的一个帧4．使用绘图纸方式扩展观察方式2（2）控制绘图纸外观显示：要控制绘图纸外观显示，可执行以下操作之一。将具有绘图纸外观的帧显示为轮廓：可单击“绘图纸外观轮廓”按钮。更改任一绘图纸外观标记的位置：将它的指针拖到一个新的位置。编辑绘图纸外观标记之间的所有帧：单击“编辑多个帧”按钮。（3）更改绘图纸外观标记

5、的显示：更改绘图纸外观标记的显示的方法如下。单击“修改绘图纸标记”按钮，出现一个菜单，然后可从菜单中选择其中一个选项。。任务2设计渐变动画了解补间动画的类型。使用“属性”面板的相关选项创建补间动画。使用“创建补间动画”命令创建补间动画。使用“补间形状”创建动画。掌握在补间形状中使用形状提示的方法。1．了解补间动画的类型“补间动画”也称“渐变动画”，主要用于补间实例、组和类型属性的变化，即它能自动补全两个关键帧之间各帧的画面。Flash可以补间实例、组和类型的位置、大小、旋转和倾斜。另外，Flash可以补间实例和类型的颜色、创建渐变的颜色切换或使实例淡入淡出。补间动画主要有两大类。（

6、1）以同一个实例的位置、大小、旋转、倾斜及颜色的变化的动画为主，又称“补间动作”或“运动渐变动画”。这种类型的动画还可以利用引导层创建按指定路径运动的动画，该问题将在下一个任务中讨论。（2）以两个不同实例间形状的变化的动画为主，又称“补间形状”，或“形状渐变动画”。2．使用“属性”面板的相关选项创建补间动画1（1）单击层名称使之成为活动层，然后在动画开始播放的层中选择一个空白关键帧。（2）创建补间动画的第一个帧，可以执行以下操作之一。用钢笔、椭圆、矩形、铅笔或刷子工具创建一个图形对象，然后把它转换为一个元件。在舞台中创建一个实例、组或文本块。将元件的实例从“库”面板中拖出。（3）在

7、动画要结束的地方创建第二个关键帧，然后选择结束帧（在时间轴上紧贴着第二个关键帧的左侧）。（4）在第二个关键帧，对项目执行以下操作之一，以更改结束帧中的实例、组或文本块。将项目移动到新的位置。修改该项目的大小、旋转或倾斜。修改该项目的颜色（仅限实例或文本块）。2．使用“属性”面板的相关选项创建补间动画2（5）单击补间帧范围内的任何帧，然后从”属性”面板（可执行“窗口”→“属性”命令打开）中的“补间”下拉式列表框中选择“动作”，或者可以右键单击第一个关键帧，然后在快捷菜单