Flash实训报告资料

1、课程设计报告设计题目 : 迎 春 动 画系 部 专 业 班 级 学 号 姓 名 指 导 教 师 完 成 日 期 2015年1月9日 课程设计任务书专业电子商务班级课程名称动画制作设计题目迎春动画指导教师起止时间2014年12月29日至1月9日周数2周设计地点管理系机房设计目的：掌握动画制作过程中的基本操作，图层的应用，逐帧动画，引导层使用，动画整体的设计。设计任务或主要技术指标：1. 绘制元件、设计好布局。2. 利用所学的各种动画制作知识对动画进行相应的处理；3. 色彩的搭配必须符合动画设计的要求。设计进度与要求：第1-3天：布置任务，查找相关资料，查找素材；第4-7天：熟悉软件的基本使用，制

2、作动画；第8-12天：查找相关资料，撰写课程设计报告；第13-14天：进行答辩； 主要参考书及参考资料：1. 郑芹，Flash动画设计（第2版），电子工业出版社，2012.62. 黄刚，FLASH MX 标准教程M，北京：中国宇航出版社，2006.5教研室主任（签名） 系（部）主任（签名） 年 月 日课程设计评定意见设计题目： 迎春动画 学生姓名： 专业 班级 评定意见：评定成绩： 指导教师（签名）： 年 月 日摘要本文主要介绍了此次Flash动画设计实训以运用Flash一系列制作技术，围绕羊年新春为主题制作动画的过程。在制作过程中首先要确定动画剧本，寻找音乐及动画素材，然后设计动画场景，创建

3、动画中所需的各类图形元件，影片剪辑等，并插入文字，导入声音，添加按钮等到flash进行制作，最后进行测试调试及保存，完成了整个动画的制作。整个制作过程中遇到许许多多制作的问题，但通过反复演练之后找到了解决的办法，通过此次课程设计，使自己更加熟练的运用了Flash动画设计软件，将所学运用到实际过程中，达到了学以致用的目的，让自己受益匪浅。关键词：Flash制作 新春动画 图形元件 影片剪辑目 录第一章 引言1第二章 实训目的2第三章 实训环境23.1 FLASH简介23.2 FLASH动画的特点23.3 FLASH动画的应用领域3第四章 内容及程序34.1实训内容34.2 制作流程34.3制作步

4、骤4第五章 软件测试145.1软件测试的目的及意义145.2 软件通过的测试发现的问题145.3解决软件测试发现的问题155.4测试结论16第六章 实训后的作品评价16总 结17参考文献18第一章 引言FLASH是美国macromedia公司于1999年6月推出的优秀网页动画设计软件。它是一种交互式动画设计工具，用它可以将音乐，声效，动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。FLASH的前身是Futureplash，早期网上流行的矢量动画插件。后来由于Macromedia公司收购了Future Splash以后便将其改名为 Flash2，到现在最新的flash4。现在网上

5、已经有成千上万个Flash站点，著名的如Macromedia专门ShockRave站点，全部采用了Shockwave Flash 和Director。可以说Flash已经渐渐成为交互式知量的标准，未来网页的一大主流。作为电子商务专业的学生，学习Flash动画设计，是必然的。Flash动画设计课程是一门教习Flash动画的基本操作和动画设计方法的一门课程。Flash把音乐，动画，声效，交互方式融合在一起，越来越多的人已经把Flash作为课件动画设计的主要工具，并且创作出了许多令人叹为观止的动画课件(电影)效果。Flash强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画，通过ACTIO

6、N和FS COMMAND可以实现交互性，使Flash具有更大的设计自由度，另外，它与当今最流行的课件设计工具Director配合默契，可以制作出优秀的幼儿多媒体课件。 Flash 8.0 的出现更是使Flash在面向对象开发方面达到了一个前所未有的令人唏嘘的高度。类、包、继承、封装、丰富的组件、项目管理、版本控制，这些以往只能在专业的面向对象的应用程序集成快速开发环境中才能见到的东西已经统统的在Flash中得到了贯彻。本文主要介绍了此次Flash动画设计实训以运用Flash一系列制作技术，围绕羊年新春为主题制作动画的过程。在制作过程中首先要确定动画剧本，寻找音乐及动画素材，然后设计动画场景，创

7、建动画中所需的各类图形元件，影片剪辑等，并插入文字，导入声音，添加按钮等到flash进行制作，最后进行测试调试及保存，完成了整个动画的制作。第二章 实训目的Flash是动画过程中很重要的一门二维软件课程，是做动画不可缺少的一部分，对于初学的我们来说，这次实训是一个很好的锻炼平台。我们一直在课本上学习理论知识。这次通过实训，是我们在理论的基础上向实践能力的升华，对我们有很大的意义。培养了我们自己的思维能力和创造能力，能根据自己所学创作出作品。并对flash的学习过程进行总结，改进自己的不足之处，掌握flash中图形的绘制方法。还锻炼我们实际能力，了解并熟悉flash动画的制作方法和具体流程。通过

8、本次实训了解和学习一些硬件资源的使用，增加我们对这门专业的更多的了解。第三章 实训环境 3.1 FLASH简介FLASH是美国macromedia公司于1999年6月推出的优秀网页动画设计软件。它是一种交互式动画设计工具，用它可以将音乐，声效，动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。FLASH的前身是Futureplash，早期网上流行的矢量动画插件。后来由于Macromedia公司收购了Future Splash以后便将其改名为 Flash2，到现在最新的flash4。现在网上已经有成千上万个Flash站点，著名的如Macromedia专门ShockRave站点，全部

9、采用了Shockwave Flash 和Director。可以说Flash已经渐渐成为交互式知量的标准，未来网页的一大主流。3.2 FLASH动画的特点FLASH动画在网上广为使用，使得大众对它好评以及钟情的原因在于它拥有很多独特和而且便利的特点：l FLASH动画使用矢量图形系统，使用Flash创建的元素是用矢量来描述的。矢量图形可以任意缩放尺寸而不影响图形的质量。l FLASH动画具有流式播放技术，使得动画可以边下载边播放，即使后面的内容还没有下载到硬盘，用户也可以开始欣赏动画。l Flash动画文件容量小，通过关键帧和组件技术的使用使得所生成的动画(.swf)文件非常小，几K字节的动画文

10、件已经可以实现许多令人心动的动画效果，使得动画可以在打开网页很短的时间里就得以播放。用户只要为自己的浏览器安装一次插件（Flash Plug-in），以后就可以直接观看动画。l FLASH动画支持MP3数据流式音频，可以将MP3音频压缩格式的文件直接导入Flash中，将音乐、动画、声效等融为一体。l FLASH动画具有增强的Flash交互功能，即Flash使用ActionScript语句，增强了对于交互事件的动作控制，使用户可以更精确、更容易的控制动画的播放。 l FLASH动画拥有强大的网络传播能力。l FLASH动画拥有崭新的视觉效果。l FLASH动画制作成本低。l FLASH动画在制作

11、完成后可以把生成的文件设置成带保护的格式，从而维护了设计者的版权利益。3.3 FLASH动画的应用领域1.随之计算机的普及以及网络的快速发展，网络动画是Flash的一个重要应用领域。2.用Flash制作游戏有很多优势，如成本较低、跨平台开发、集成多种媒体形式和媒体设备、成果易于发布、DIY精神的体现等。3.制作教学课件4.FLASH电子贺卡5.制作广告、动画特效6.搭建FLASH动态网站以及网站导航条7.制作企业作品展示第四章 内容及程序4.1实训内容在本次实训任务中，我们围绕着羊年新春为主题制作动画。通过我们查找的相关资料、素材，绘制出各类元件、并设计好布局，利用所学的各种动画制作知识对动画

12、进行相应的处理，最后进行测试调试出我们做的动画并撰写课程设计报告。4.2 制作流程制作FLASH动画大致分为6个步骤，可以用如图4.1的流程图来概述。策划动画收集素材制作动画调试动画测试动画保存动画图4.1 FLASH动画制作流程图4.3制作步骤首先做准备工作，绘制我们所需要的各个部分并转化成元件，尤其在作品中重复使用的，将之做成元件是最好的选择，对作品来说既能节省空间又方便进行下面的动画制作，在此，我将绘制好的元件分类做成了文件夹放置于库中，如图4.2库中元件展示所示，细节的元件在后续的作品中有添加和运用。图4.2 库中元件展示1.制作片段1（1）新建文件，将文件中唯一的图层重命名为“背景1

13、”，选择菜单项“文件”“保存”，将该文件命名为“新年快乐.fla”。（2）选中“背景1”图层的第1帧，选择库中“背景”文件里的“背景1”拖入到舞台并调整其大小，使其刚好铺满舞台，用做片段1的背景。（3）选中该图层的第125帧，按F5功能键“插入帧”，时间轴面板如图4.3所示。图4.3 第125帧插入帧的时间轴面板（4）在“背景1”上插入一个新图层，重命名为“闪星”，选择该图层的第1帧，然后从库中将“闪星”影片剪辑元件拖入舞台中，并根据舞台需要多次放置其在舞台上的位置，最后在该图层的第125帧处“插入帧”。（5）在“闪星”图层上方插入一个新图层，重命名为“滚动的福”，选择该图层的第1帧，然后从库

14、中将“滚动的福”影片剪辑元件拖入舞台之外左方的视图区，接着选择该图层的第30帧、第60帧、第90帧、第105帧插入关键帧，并不断调整其位置，最后选择图层的第1帧、30帧、第60帧、第90帧，鼠标右击，插入“创建补间动画”。 最后在该图层的第125帧处“插入帧”。如图4.4所示。图4.4 时间轴面板（6）在“滚动的福”图层上方插入一个新图层，重命名为“文字1”，选择该图层的第90帧按F6功能键“插入关键帧”，从库中将“文字1”图形元件拖入到舞台中并调整其位置，最后在该图层的第125帧处“插入帧”。（7）在“文字1”图层上方插入一个新图层，重命名为“框1”。选择该图层的第112帧按F6功能键“插入

15、关键帧”，从库中将“框”图形元件拖入到舞台并调整其覆盖整个背景面板，然后调整其“属性”|“颜色”中的Alpha为0%，选择该图层的第125帧按F6功能键“插入关键帧”，然后调整其“属性”|“颜色”中的Alpha为100%。最终动画片段1完成效果如图4.5所示。图4.5 动画片段12制作片段2（1）接下来开始片段2的制作，为了方便后面的管理，首先我在时间轴上创建了一系列的图层，并分别命名，然后将一类的图层在集中放入到一个文件夹中，如图4.6创建图层所示。图4.6 创建图层（2）在“片段2”文件夹中，插入一个新图层，重命名为“背景2”， 选中“背景2”图层的第125帧按F6功能键“插入关键帧”，选

16、择库中“背景”文件里的“背景2”拖入到舞台并调整其大小，使其刚好铺满舞台，用做片段2的背景。选中该图层的第284帧，按F5功能键“插入帧”。（3）在“背景2”图层上方插入三个新图层，分别重命名为“牌子1”、“牌子2”、“牌子3”，再分别选中这三个图层的第125帧、第145帧和第165帧“插入关键帧”。因为动画需要，要让这三个牌子分别落下并且具有动态效果，因此从库中将“牌子”图形元件拖入舞台中进行调整位置，并为其分别“创建补间动画”。如图4.7所示。图4.7 牌子的补间动画（4）在“牌子3”图层上方插入三个新图层，分别重命名为“财”、“神”、“到”，再分别选中这三个图层的第190帧、第195帧和

17、第200帧“插入关键帧”，然后分别从库中将“财”、“神”、“到”三个图形元件拖入舞台中并调整其位置，如图4.8所示。图4.8文字位置（5）接下来要做鞭炮燃烧的动画，插入新建元件【影片剪辑】，在库中将鞭炮文件打开，在这个影片剪辑中做鞭炮燃烧的逐帧动画，为了动画的更真实性以及作品的需要，这里分别新建了三个图层，在图层1第1帧插入关键帧，将“鞭炮1”图形元件拖入舞台中，在图层2第2帧插入关键帧，将“鞭炮2”图形元件拖入舞台中，同“鞭炮1”位置相重合，在图层3第3帧插入关键帧，将“鞭炮3”图形元件拖入舞台中，同“鞭炮2”位置相重合，做成效果如图4.9所示的鞭炮燃烧的影片剪辑。图4.9鞭炮燃烧的影片剪辑

18、（6）返回场景，插入新图层，重命名为“燃烧的鞭炮”，选择该图层的第125帧插入关键帧，将库中“燃烧的鞭炮”影片剪辑拖入舞台中，进行排列位置制作成许多炮竹燃烧的样子，效果如图4.10所示。图4.10 鞭炮放置效果图（7）接下来制作小女孩手持金元宝动的动画，插入新建元件【影片剪辑】，在库中将身体各部位文件打开，在这个影片剪辑中做小女孩手持金元宝动的补间动画，效果如图4.11所示。图4.11影片剪辑中的补间动画（8）返回“场景”，插入新图层，重命名为“小人1”，并在该图层的第201帧插入关键帧，为了动画的更真实性以及作品的需要，这里每10帧交换一个位置，并用“空白关键帧”隔开，使其出场更加特别。效果

19、如图4.12所示。图4.12小人出场动画（9）在“小人1”图层上方插入一个新图层，重命名为“框2”。选择该图层的第270帧按F6功能键“插入关键帧”，从库中将“框”图形元件拖入到舞台并调整其覆盖整个背景面板，然后调整其“属性”|“颜色”中的Alpha为0%，选择该图层的第125帧按F6功能键“插入关键帧”，然后调整其“属性”|“颜色”中的Alpha为100%。最终完成动画片段2的遮罩效果。3.制作片段3（1）在“片段3”文件夹中，插入一个新图层，重命名为“背景3”， 选中“背景3”图层的第285帧按F6功能键“插入关键帧”，选择库中“背景”文件里的“背景3”拖入到舞台并调整其大小，使其刚好铺满

20、舞台，用做片段3的背景。选中该图层的第339帧，按F5功能键“插入帧”。（2）在该图层的上方插入一个新图层文件夹，重命名为“柱形表”，并在里面分别插入六个新图层，每个图层分别相隔三个帧插入一个“关键帧”，使其产生逐帧动画的效果，如图4.13所示。 图4.13柱形表逐帧动画（3）接下来制作“小人2”影片剪辑，插入新建元件【影片剪辑】，在库中将身体各部位文件打开，在这个影片剪辑中做小女孩眨眼睛，手动的效果，为使动画的更真实性以及作品的需要，分别制作了3种眼睛的原画元件，如图4.14所示。并为了使其更加自然真实，在第1帧插入关键帧，将“眼睛1”图画元件拖入舞台，这里每隔1帧交换一个眨眼睛的元件，共交

21、换5次。然后相隔25帧再将前5次元件重复一次，然后手动的动作是每2帧交换一个动作，时间轴效果如图4.15所示。图4.14 眼睛原画元件图4.15 时间轴面板（4）返回“场景”，插入新图层，重命名为“小人2”，并在该图层的第285帧插入关键帧，将“小人2”影片剪辑拖入舞台中调整其位置。（5）在“小人2”图层上方插入一个新图层，重命名为“文字2”，选择该图层的第303帧按F6功能键“插入关键帧”，从库中将“文字2”图形元件拖入到舞台中并调整其位置，最后在该图层的第340帧处“插入帧”。（6）接下来要做烟花的动画，插入新建元件【影片剪辑】，在库中将闪星文件打开，在这个影片剪辑中做烟花的逐帧动画，时间

22、轴效果如图4.16所示的烟花1的影片剪辑。图4.16 时间轴 （7）返回“场景”，插入新图层，重命名为“烟花”，并在该图层的第285帧插入关键帧，为了动画的更真实性以及作品的需要，这里每隔5帧插入一个关键帧，并且每5帧用“空白关键帧”隔开，使其绽放的各加自然。效果如图4.17所示。图4.17 时间轴（8）在“烟花”图层上方插入一个新图层，重命名为“框3”。选择该图层的第330帧按F6功能键“插入关键帧”，从库中将“框”图形元件拖入到舞台并调整其覆盖整个背景面板，然后调整其“属性”|“颜色”中的Alpha为0%，选择该图层的第339帧按F6功能键“插入关键帧”，然后调整其“属性”|“颜色”中的A

23、lpha为100%。最终完成动画片段3效果。4.制作片段4（1）在“片段4”文件夹中，插入一个新图层，重命名为“背景4”， 选中“背景4”图层的第340帧按F6功能键“插入关键帧”，选择库中“背景”文件里的“背景4”拖入到舞台并调整其大小，使其刚好铺满舞台，用做片段4的背景。选中该图层的第500帧，按F5功能键“插入帧”。（2）接下来制作“小人3”影片剪辑，小人3同小人2做法一样，手肘稍有改动。（3）返回“场景”，插入新图层，重命名为“小人3”，并在该图层的第340帧插入关键帧，将“小人3”影片剪辑拖入舞台中调整其位置。（4）在“小人3”图层上方插入一个新图层，重命名为“小人4”，并在该图层的

24、第442帧插入关键帧，将“小人4”影片剪辑拖入舞台中调整其位置。（5）在“小人4”图层上方插入一个新图层，重命名为“文字3”，选择该图层的第340帧按F6功能键“插入关键帧”，从库中将“文字3”图形元件拖入到舞台中并调整其位置，最后在该图层的第500帧处“插入帧”。（6）接下来要做烟花的动画，插入新建元件【影片剪辑】，在库中将闪星文件打开，在这个影片剪辑中做烟花的逐帧动画，时间轴效果如图4.18所示的烟花3的影片剪辑。图4.18时间轴 （7）返回“场景”，插入新图层，重命名为“烟花2”，并在该图层的第340帧插入关键帧，为了动画的更真实性以及作品的需要，这里每隔15帧插入一个关键帧，并且每段帧

25、用“空白关键帧”隔开，使其绽放的各加自然。（8）在“烟花”图层上方插入一个新图层，重命名为“星空”。选择该图层的第340帧按F6功能键“插入关键帧”，将制作好的“星空“影片剪辑拖入舞台中并调整其位置。（9）新建一个按钮元件，制作一个“replay“的按钮，然后返回场景，在第472帧出插入“关键帧”，将按钮元件拖入舞台中并调整好其位置，然后右击舞台中按钮元件，在出现的菜单项中选择“动作”，然后选择全局函数中影片剪辑控制，在右面的代码框中输入如下代码：on (release) gotoAndPlay(1);然后再将“背景4”、“小人3”、“小人4”、“文字3”、“烟花2”、“星空”图层的第500帧

26、处鼠标点击右键，在出现的菜单项中选择“动作”，然后在代码框中输入如下代码：Stop();最后羊年新春动画就制作完成了，然后导出Flash动画。如图4.19所示。图4.19 导出动画第五章 软件测试5.1软件测试的目的及意义（1）发现错误（2）解决错误（3）有效定义和实现软件成分由低层到高层过程（4）验证软件是否满足任务书和技术要求5.2 软件通过的测试发现的问题（1）在制作片段1里的闪星影片剪辑时，出现颜色无法连贯转换的问题。制作闪星边变换颜色边放大缩小的样子时，出现从一种颜色直接变换为了另一种颜色，中间没有过度效果。（2）在制作片段1里的滚动的福的补间动画时，出现元件图片滚动太快的问题。（3

27、）在制作片段1向片段2过度的遮罩框时，创建了补间动画，但是没有逐渐消失的效果，而是一直没有变化。（4）片段2中的小人1手持金元宝上下动的动作不连贯，出现播放时整体错位的问题。（5）片段3中小人3影片剪辑中小女孩眨眼睛太快。5.3解决软件测试发现的问题（1）针对5.2中的第1个问题重新编辑，对“闪星”影片剪辑里第15帧的“星”图形元件进行属性编辑，调整其颜色中的“色调”值为#FF9900，然后对其创建补间动画，再次测试软件，测试成功，未发现问题。（2）针对5.2中的第2个问题重新整理编辑，发现帧与帧之间间隔太短，造成频率过快，所以重新拉大了帧的位置，再次测试软件，测试成功。（3）针对5.2中的第

28、3个问题选中第112帧的舞台中的“框”元件，调整属性颜色的“Alpha”值为0%，在第125帧处调整属性颜色的“Alpha”值为100%，然后创建补间动画，使其产生遮罩框的效果，再次测试软件，测试成功。（4）针对5.2中的第4个问题在制作补间动画时，在新的关键帧下更换了整体元件，因为该影片剪辑中只有小部分是动的，而其他时不动的，所以更换整体元件，会造成错位现象，这种情况下应该将不动的部分单独放在一个图层中，动的部位在另一个图层中来调整其位置，然后设置其补间动画。（5）针对5.2中的第5个问题因为根据实际情况，人的眨眼睛并不是持续的，而是具有间隔性的，因为做成了逐帧动画，才导致了眨眼频率过快，所

29、以应该调整其间隔，隔开眨眼的频率。再次测试软件，测试成功。5.4测试结论在制作过程中出现的这些种种问题，大多数是因为对软件不够熟悉导致的，对于一些简单问题总是需要很长时间,很多细节上自己还是很粗心，没能做得更好，而且通过实践来看，对于知识的实际应用自己掌握的可以说是差了，最基本的动手能力应用不到位，所以做起作业来感到有些局促和困难。需要时不时的翻翻课本，加深自己的记忆，更好的掌握课本知识。在元件的应用上自己是遇到了难题，不能正确把握元件的使用方法，尤其是按钮和影片剪辑，在查阅资料后，能懂得大部分和简单的运用，并且在与同学交流后，对他们的理解和应用掌握的很完全，于是自己运用他们做一些小例子，彻底明白之后，在实训作品中就应用自如了，这是这次实训中很大的收获。第六章 实训后的作品评价我的作品根据在网上搜索的素材的故事内容进行制作的。总时长20.8s，通过整个实训的完成，总结来说，既有有点又有缺点。1.优点：（1）所有的图形元件还是影片剪辑元件都是自己动手画的，耗时的同时也锻炼了自己的能力，提高了一定的技巧。（2）作品中大量运用补间动画，并且运用一些逐帧动画、引