网页设计基础教程与上机指导利用Fireworks制作动画.pptx

《网页设计基础教程与上机指导利用Fireworks制作动画.pptx》由会员分享，可在线阅读，更多相关《网页设计基础教程与上机指导利用Fireworks制作动画.pptx（12页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、会计学1网页设计基础教程与上机指导利用网页设计基础教程与上机指导利用Fireworks制作动画制作动画教学提示和教学目标教学提示和教学目标n n教学提示：在教学提示：在FireworksFireworks中，可以通过称为动画元件的对象中，可以通过称为动画元件的对象分配属性来创建动画。一个元件的动画被分解成多个帧，分配属性来创建动画。一个元件的动画被分解成多个帧，帧中包含组成每一步动画的图像和对象。一个动画中可以帧中包含组成每一步动画的图像和对象。一个动画中可以有一个以上的元件，每个元件可以有不同的动作。不同的有一个以上的元件，每个元件可以有不同的动作。不同的元件可以包含不同数目的帧。当所有元件

2、的所有动作都完元件可以包含不同数目的帧。当所有元件的所有动作都完成时，动画就结束了。成时，动画就结束了。n n教学目标：教学目标：n n掌握创建逐帧动画掌握创建逐帧动画n n掌握创建元件动画掌握创建元件动画n n掌握创建其他动画掌握创建其他动画n n掌握制作逐字变色动画掌握制作逐字变色动画第1页/共12页25.1 创建逐帧动画创建逐帧动画n n逐帧动画需要用户更改影片每一帧中的舞台内容。简单的逐帧动画并不需要用户定义过多的参数，只需要设置好每一帧，动画即可被播放。逐帧动画最适合于每一帧中的图像都在更改的动画，而不仅仅是简单地在舞台中移动的复杂动画。n n25.1.1 关于n n25.1.2 编

3、辑帧n n25.1.3 帧延时第2页/共12页25.1.1 关于关于n n通过创建多个帧可以生成动画。使用【帧】面板可以看到每个帧的内容。【帧】面板是创建和组织帧的地方。可以命名帧、重新组织帧、手动设置动画的定时以及将对象从一个帧移到另一个帧。n n每个帧都有若干相关的属性。通过设置帧延时或隐藏帧，可以在制作和编辑过程中使动画达到自己想要的效果。第3页/共12页25.1.2 编辑帧编辑帧n n可以在【帧】面板中添加、复制、删除帧和更改帧的顺序。n n1.1.添加帧添加帧n n2.2.添加多帧添加多帧n n3.3.复制帧复制帧n n4.4.删除帧删除帧第4页/共12页25.1.3 帧延时帧延时n

4、 n对动画中各帧延迟时间进行设置，会影响动画播放的总时间，也对动画中各帧延迟时间进行设置，会影响动画播放的总时间，也可以影响动画的流畅效果以及动画的总体效果。设置帧延时的操可以影响动画的流畅效果以及动画的总体效果。设置帧延时的操作步骤如下。作步骤如下。n n(1)(1)在在【帧帧】面板中选择需要设置帧延时的帧，按住面板中选择需要设置帧延时的帧，按住ShiftShift键可以同时选择多键可以同时选择多帧。帧。n n(2)(2)单击单击【帧帧】面板右上角的按钮，在弹出的菜单中选择面板右上角的按钮，在弹出的菜单中选择【属性属性】命令，命令，弹出弹出【帧属性帧属性】对话框。对话框。n n(3)(3)在

5、在【帧延时帧延时】文本框中输入需要设置的时间。设置完毕后，单击此对文本框中输入需要设置的时间。设置完毕后，单击此对话框以外的区域或按话框以外的区域或按EnterEnter键，即可完成对该帧延迟时间的设置。键，即可完成对该帧延迟时间的设置。第5页/共12页25.2 创建元件动画创建元件动画n n动画元件可以是创建或导入的任何对象，并且在一个文件中可以有许多元件。每个元件都有它自己的属性并可独立运动。n n25.2.1 元件和实例n n25.2.2 编辑元件第6页/共12页25.2.1 元件和实例元件和实例n n如果文档中有重复使用的元素，可通过复制和粘贴操作在文档中如果文档中有重复使用的元素，可

6、通过复制和粘贴操作在文档中创建对象。创建对象。n n元件和实例还有一些其他用处，如制作动画。元件和实例还有一些其他用处，如制作动画。FlashFlash的元件和实例，的元件和实例，就是通过创建元件，并不停地改变实例属性，来表示运动的感觉。就是通过创建元件，并不停地改变实例属性，来表示运动的感觉。一个元件就像一个木偶，一举一动都是由操作者完成。一个元件就像一个木偶，一举一动都是由操作者完成。n n可以随时使用可以随时使用【动画动画】对话框或对话框或【属性属性】检查器来更改动画元件检查器来更改动画元件的属性。还可以在元件编辑器中编辑元件的图片。元件编辑器可的属性。还可以在元件编辑器中编辑元件的图片

7、。元件编辑器可以在不影响文档其他部分的情况下编辑元件。也可以通过移动元以在不影响文档其他部分的情况下编辑元件。也可以通过移动元件的运动路径来更改元件的运动。件的运动路径来更改元件的运动。n n因为动画元件被自动放到因为动画元件被自动放到【库库】面板中，所以可以重新使用它们面板中，所以可以重新使用它们来创建其他动画。来创建其他动画。第7页/共12页25.2.2 编辑元件编辑元件n n可以处理动画元件的属性，使网站富有生气。可以更改元件动画的速度、不透明度和旋可以处理动画元件的属性，使网站富有生气。可以更改元件动画的速度、不透明度和旋转的各种属性。通过处理各种属性，可以使元件显示为旋转、加速、淡入

8、淡出或者是这转的各种属性。通过处理各种属性，可以使元件显示为旋转、加速、淡入淡出或者是这些动作的任意组合。些动作的任意组合。n n可以通过可以通过【动画动画】对话框或对话框或【属性属性】面板来更改元件的属性，面板来更改元件的属性，【属性属性】面板如图面板如图25.2225.22所所示。示。n n在在【属性属性】面板中可以进行如下设置。面板中可以进行如下设置。n n【帧帧】：在动画中包含的帧数，尽管滑块只允许设置最大值为：在动画中包含的帧数，尽管滑块只允许设置最大值为250250，但可以在，但可以在【帧帧】文本框中输入任何数字。文本框中输入任何数字。n n【方向方向】：对象移动的方向：对象移动的

9、方向(以度为单位以度为单位)。值的范围是从。值的范围是从0 0度到度到360360度。度。n n【缩放缩放】：从开始到完成的淡入淡出的百分比。值的范围是从：从开始到完成的淡入淡出的百分比。值的范围是从0%0%到到250%250%。默认值。默认值是是100%100%。n n【不透明度不透明度】：从开始到完成的淡入淡出的百分比，值的范围是从：从开始到完成的淡入淡出的百分比，值的范围是从0%0%到到100%100%。默。默认值是认值是100%100%。n n【旋转旋转】：从开始到完成元件旋转的数量：从开始到完成元件旋转的数量(以度为单位以度为单位)。值的范围是从。值的范围是从0 0度到度到36036

10、0度。度。要想让元件旋转不只一圈，可以输入更高的值，默认值是要想让元件旋转不只一圈，可以输入更高的值，默认值是0 0度。度。n n【顺时针顺时针】和和【逆时针逆时针】表示对象的旋转方向。表示对象的旋转方向。【顺时针顺时针】表示顺时针旋转，表示顺时针旋转，【逆时针逆时针】表示逆时针旋转。表示逆时针旋转。第8页/共12页25.3 创建其他动画创建其他动画n nFireworks 8在制作GIF动画上有着强大的功能。动画制作完成之后，就需要对其进行优化以达到最佳的显示效果，并且经过导出设置以及预览等步骤，最终将其导出为GIF动画格式。下面就来介绍GIF动画的制作过程。n n25.3.1 打开文件生成

11、动画n n25.3.2 导入现有GIF动画第9页/共12页25.3.1 打开文件生成动画打开文件生成动画n n在在Fireworks 8Fireworks 8中可以通过打开一组图像文件来快速中可以通过打开一组图像文件来快速创建动画，这种方式最适合网页横幅广告。打开文创建动画，这种方式最适合网页横幅广告。打开文件生成动画的具体操作步骤如下。件生成动画的具体操作步骤如下。n n(1)(1)选择选择【文件文件】|【打开打开】命令，弹出命令，弹出【打开打开】对话框。对话框。n n(2)(2)在对话框中如果要选择多个连续的文件，按住在对话框中如果要选择多个连续的文件，按住ShiftShift键键或用鼠标

12、进行框选，此时可以看到选定的文件被添加到或用鼠标进行框选，此时可以看到选定的文件被添加到【文件名文件名】文本框中。文本框中。n n(3)(3)在对话框中选中在对话框中选中【以动画打开以动画打开】复选框，单击复选框，单击【打开打开】按钮，按钮，FireworksFireworks就会在单个文件中打开所需要的文件。就会在单个文件中打开所需要的文件。在在【帧帧】面板中可以看到每个文件都按选定的顺序放置面板中可以看到每个文件都按选定的顺序放置在在【帧帧】面板中。面板中。第10页/共12页25.3.2 导入现有导入现有GIF动画动画n n导入现有导入现有GIFGIF动画的具体操作步骤如下。动画的具体操作步骤如下。n n(1)(1)选择选择【文件文件】|【打开打开】命令，弹出命令，弹出【打开打开】对话框。对话框。n n(2)(2)在对话框中选择要导入的在对话框中选择要导入的GIFGIF动画，单击动画，单击【打开打开】按按钮，弹出钮，弹出FireworksFireworks提示框。提示框。n n(3)(3)单击单击【确定确定】按钮，自动在按钮，自动在【帧帧】面板中添加新的帧。面板中添加新的帧。第11页/共12页