基于Flash技术的动画设计实现—_模拟神舟六号的发射过程制作

1、中国人民电子工程学院解 放 军地方生学员毕业设计报告报告题目：神州六号的发射升空模拟学员：陆冬 冬学员队别：四系二十六队专业名称：通信 工 程指导教员：晓 静二一一年四月十六日指导教员对毕业设计报告的评语：指导教员：日期：年月日室级答辩评语及成绩：答辩组负责人：日期：年月日专业系意见：（四号黑体）专业系领导：日期：年月日院级答辩评语及成绩：（四号黑体）答辩组负责人：日期：年月日目录摘要：41 Flash 简介：52 Flash 动画的概念52.1 Flash动画原理62.3 Flash动画的简史62.4 Flash动画的特点82.5 Flash的应用领域83 基于 Flash 的神州六号发射升

2、空过程模拟的动画设计93.1动画设计准备工作93.2设计平台103.3设计步骤及功能实现104 变成代码及结合在网页中155 结论16参考文献：16致17附录17摘要：20 世际以来，动画艺术蓬勃兴起。随着电脑进入家庭和数字技术的发展，一种新的动画形式 flash 动画进入人们的日常生活， 并以互联网为主要平台迅速传播，遍及电脑、电视、手机等媒体，受到年轻人的广泛关注和关爱。基于 flash 的多媒体动画技术在迅速发展的过程中不断探索对传统题材表现的广度与深度， 不断尝试技术上的创新， 但目前国对于这一方面的研究还过于零散，缺乏相应的理论指导和较为系统的梳理总结。本文从基于 flash 的动画

3、多媒体动画技术的研究入手， 从目的与意义， 形式与容，思考与发展等几个方面进行探讨， 同时结合实例来分析和讲解 flash 在多媒体动画开发中的应用。本文以 flash 动画的形式展现了神州六号的发射全过程，涉及素材选取、动画制作、测试发布等环节的操作实现。选用“神州六号”如何实现发射过程系统模块为设计总体，详细介绍从“打开发射塔”“开始点火升空”“助推器分离”“ 1、2 级分离” “整流罩分离”“展开太阳翼进入轨道”的整个制作过程。1 Flash 简介：Flash 是 Macromedia 公司出品的，用在互联网上的，动态的，可边下载边播放。 Flash虽然不可以像一门语言一样进行编程，但用

4、其置的语句并结合JavaScript ，用户也可以作出互动性很强的动画。它支持动画、声音的交互，具体的交互，具有强大的多媒体编辑功能、 互动影像。Flash 的 ，再加上 Generator的整合功能，提供Flash 与数据库互动的最佳解决方案。它的流行经历了一个由默默无闻到惊天动地的历程， 并终于迎来了一个它的成功，迎来了市场特别是设计界的关注和认可， 使设计界对未来设计的发展趋势有了一个有据有理的认识，也引发了对 Flash 现象的研究和有关设计探索的兴趣。2 Flash 动画的概念Flash 原本是美国Macromedia 公司推出的一款多媒体动画制作软件。它是一种交互式动画设计工具，用

5、它可以将音乐、声效、动画方便地融合在一起，以制作出高品质的动态效果。由于Flash软件技术极大的降低了传统画绘画的难度，简化了传统动画绘画繁琐程度，又具备动、声、效等综合制作能力，很快便吸引了大批爱好者， 作品在网络上迅速流传开来， 已形成了一种流行趋势。 虽然 flash 有着较强的程序功能，但是大多数人认识 flash 还是因为它制作的 flash 动画，因此， flash 有着也约定俗成指运用 flash 技术制作或创作的动画作品。2.1 Flash动画原理Flash 动画，实际上就是把几幅静止的图像快速连续地播放，肉眼所看到的图像会在大脑中暂留1/16 秒。这就是视觉暂留原理， 也就是

6、动画片会动的原因。电影拍摄和播放的速率都是 24 帧，即一秒钟要播放 24 幅画面；传统的手工动画中，播放十分钟的动画也需要手绘上几千甚至上万幅图片， 利用人眼视觉的暂留，使人感觉物体的移动。 随着影视动画中的发展， 动画制作的工作量越来越大，为了节约成本，只能减少过渡的数量，所以靠手绘很难做到很精细的动画。计算机的出现为动画制作带来福音， 早在六十年代， 计算机就逐步加入到动画的制作中，动画师只要画出关键帧， 而计算机可以通过计算生成过渡帧， 这样大大加快了动画的制作速度和精度。随着计算机硬件与软件的发展， 它与影视动画的联系越来越密切， 设计师可以通过计算机生成模拟的三维模型， 并模拟三维

7、运动。 广义的网络动画包括视频动画，但从制作角度而言， 视频动画的软件主要采用传统的视频编辑软件， 与传统的影视动画没有区别， 只是在网络传播中采取了一些特殊的压缩技术， 所以狭义的 FLASH动画不包括视频动画。2.3 Flash动画的简史Flash动画的历史不长。20 世纪90 年代中期，网上出现了一家名为FutureSplash 的小公司，它成功推出了一种风格新颖的网页设计格式。这是一种矢量格式， 它不是由像素构成， 而是由平滑的曲线构成， 使计算机的处理器读取这些平滑的矢量比处理像素要容易得多。 矢量线的另一个长处在于其可测性不再成为问题，这就是 flash 的前身。当一家名为 Mac

8、romedia 的公司注意到了 Future Splash ，并抓住时机在 1996 年收购，将其改名为 Flash ，并在 Flash 中引入了动作脚本的概念，它使得该程序能够在中构建出交互性。1997 年 6 月 Macromedia 公司推出了 Flash2.0 ，自 Flash 进入 4.0 版以后，开始有了自己专用的播放器，称为“Flash Player”。 2002 年 3 月 Macromedia推出了 Flash MX 支持的播放器为 Flash Player6。Flash 6 开始了对外部JPG和 MP3调入的支持，同时也增加了更多的建对象，提供了对HTML文本更精确的控制，

9、并引入如SetInterval超频帧的概念。同时也改进了swf文件的压缩技术。 2000 年 8 月 Macromedia 推出了 Flash5.0，它所支持的播放器为FlashPlayer 5。 Flash 5.0中的ActionScript已有了长足的进步，并且开始了对XML和 Smart Clip （智能影片剪辑）的支持。ActionScript的语法已经开始定位为发展成为一种完整的面向对像的语言，并且遵循ECMAScript 的标准，就像javascript那样。2002年 3 月 Macromedia 推出了 Flash MX支持的播放器为Flash Player 6。Flash 6

10、 开始了对外部 jpg 和 MP3调入的支持，同时也增加了更多的建对象，提供了对 HTML文本更精确的控制，并引如 SetInterval 超频帧的概念。同时也改进了 swf 文件的压缩技术。 那么， “MX”究竟是什么意思呢？到目前为止， 还没有一个官方的证实， 如果一定要认为是某个单词的缩写， 那么可以把 Macromedia Experience 作为最好的答案。最权威答案来自 Macromedia Designer & Developer Center （ Macromedia设计师和开发者中心）负责人的说法：1）所有的产品都搭载上 MX绰号，是因为它们都是一个完整产品家族的一部分，而

11、且，我们相信通过整套前台和后台综合的产品， 可以让用户更高效得完成各种复杂项目。2）比起仅仅从版本号升级，例如Flash 由 5 升级到 6，用 MX标签可以体现更重要的升级，看起来用户好像得到了全新的产品，从5 到了 MX。3）MX意味着 Macromedia 以此尝试一些新的事物，就我的观点来看，FlashMX不仅仅是一次革命性的升级，还是Macromedia 一个重大演变的一部分。我不能说得太多，因为Flash MX 仅仅是一个开始，接下来的几个月中会更有体现。虽然他依旧没有回答MX到底是什么意思，而最后一句“MX意味着 Macromedia以此尝试一些新的事物” ，暴露出 Macrom

12、edia Experience的意思，也就有理由猜测，MX可能是 Macromedia X 的意思，即 Macromedia 的未来之路， Macromedia正试图展开一次全新的革命。2003 年 8 月 Macromedia 推出了 Flash MX 2004 ，其播放器的版本被命名为Flash Player 7。 Flash MX 2004增加了许多新的功能，同时开始了对Flash本身制作软件的控制和插件开放JSFL（ Macromedia Flash javascript API），Macromedia 无疑在开始调动Internet上 Flasher们的巨大力量和集体智慧。2005

13、年 10 月， Macromedia 推出了 Flash 8.0 ，增强了对视频支持。可以打包成 Flash 视频 ( 即*.flv文件 ) ；改进了动作脚本面板。2005 年 Adobe耗资 34 亿美元并购 Macromedia，从此，Flash 便冠上了 Adobe的名头，不久推出了以 Adobe 的名义推出 Flash 产品，名为 Adobe Flash CS3（同时也发布了多款捆绑套装） ，最近又推出了 Adobe Creative Suite 4 Master Collection 套装（简称 Adobe CS4）中，含有最新版的 Flash CS 4 。2.4 Flash动画的特

14、点1）生动、活泼，可以吸引、刺激浏览者点击动画页面，强烈的视觉冲击力可以给浏览者留下深刻的印象。2）占用的存储空间只是位图的几千分之一，非常适合在网络上使用。3）做到真正的无级放大，无论用户的浏览器使用多大的窗口，图像始终可以完全显示，并且不会降低画面质量。4）使用插件方式工作。用户只要安装一次插件，以后就可以快速启动并观看动画。5）可插入 MP3、AVI 音乐及动画。6）使用组件，重复使用及共享。2.5 Flash的应用领域在现阶段， Flash 应用的领域主要有以下几个方面：1）娱乐短片：这是当前国最火爆，也是广大Flash 爱好者最热衷应用的一个领域，就是利用 Flash 制作动画短片，

15、 供大家娱乐。 这是一个发展潜力很大的领域，也是一个 Flash 爱好者展现自我的平台。 用 Flash 制作的一个娱乐短片如图：2）片头：都说人靠衣装，其实也一样。精美的片头动画，可以大大提升把的含金量。片头就如电视的栏目片头一样， 可以在很短的时间把自己的整体信息传播给访问者， 既可以给访问者留下深刻的印象， 同时也能在访问者心中建立良好印象。3）广告：这是最近两年开始流行的一种形式。有了 Flash ，广告在网络上发布才成为了可能， 而且发展势头迅猛。 根据调查资料显示， 国外的很多企业都愿意采用 Flash 制作广告，因为它既可以在网络上发布， 同时也可以存为视频格式在传统的电视台播放

16、。 一次制作，多平台发布， 所以必将会越来越得到更多企业的青睐。4）MTV：这也是一种应用比较广泛的形式。在一些Flash 制作的，几乎每周都有新的 MTV作品产生。在国，用 Flash 制作 MTV也开始有了商业应用， 比如用Flash 制作的 MTV。5）导航条： Flash的按钮功能非常强大，是制作菜单的首选。通过鼠标的各种动作，可以实现动画、声音等多媒体效果， 在美化网页和的工作中效果显著。6）小游戏：利用 Flash 开发“迷你”小游戏， 在国外一些大公司比较流行，他们把网络广告和网络游戏结合起来，让观众参与其中，大大增强了广告效果。7）产品展示：由于 Flash 有强大的交互功能，

17、所以一些大公司，如Dell 、三星等，都喜欢利用它来展示产品。可以通过方向键选择产品，再控制观看产品的功能、外观等，互动的展示比传统的展示方式更胜一筹。8）应用程序开发的界面：传统的应用程序的界面都是静止的图片，由于任何支持 ActiveX 的程序设计系统都可以使用Flash 动画，所以越来越多的应用程序界面应用了 Flash 动画，如金山词霸的安装界面。9）开发网络应用程序：目前Flash 已经大大增强了网络功能，可以直接通过 XML读取数据，又加强与 ColdFusion 、ASP、 JSP和 Generator 的整合，所以用 Flash 开发网络应用程序肯定会越来越广泛地被采用。本毕业

18、设计就是用 Flash 演示神 6 发射过程，包括火箭发射、 火箭拆分、卫星运行、宇航员服装功能介绍等环节， 便于普及神州火箭发射的有关科普知识的普及教育。3 基于 Flash 的神州六号发射升空过程模拟的动画设计3.1动画设计准备工作从整体上讲， 虽然完成一个简单的Flash 对一般的 “闪客” 来说是一件非常简单的事情，但对于初次涉猎此领域的学生， 尤其是要完成一个漂亮的动画设计，不是每个初学者都能完成的事情。他需要完成一系列的动作，如下：1）素材准备。我们从互联网上搜集跟该动画相关的素材，然后用图片处理软件进行加工，并处理成自己需要的素材。2）音乐，音乐可以说是动画中一个不可缺少的元素，

19、给动画加入恰当的音乐，能给动画增添不少色彩。3）必要的工具。如笔、纸用于绘草图。3.2设计平台从选题，创意，结构化分析，素材准备，动画分解制图，动画组合，动画程序编写，全面考虑动画作品的创造力、交互性、原创性、趣味性、功能性、积极性、相关性等。动画设计时兼顾以上知识点，可延伸至互联网供大家分享。设计所用工具如图1 所示 。Flash MX 2004Photoshop CSDreamweaver MX制作动画素材处理后期处理神州六号的发射过程图 1动画采用 Flash MX2004 进行设计，以 Photoshop CS和 DreamweaverMX2004 作为动画辅助制作软件。选用 Phot

20、oshop CS主要完成相关图片（素材）的处理（制作），选用 Dreamweaver MX主要完成如何将制作成功的动画嵌入到网页中去。3.3设计步骤及功能实现1）首页设计基本上许多动画都会制作一个首页画， 即第一个页面， 这也是给浏览者的第一印象。用户通常会根据动画的一个页面来判断该动画的类型， 以及对该动画的制作质量进行评价。 所以这里我们也制作一个宣传页面， 并且设置比较久的停留过程。需要注意的是， 在动画停留的过程， 可以尝试动画中要显示的容逐步移动化形式显示出来，从而达到动静结合的效果。制作背景。依次单击“插入” “新建元素”，弹出“创建新元素”对话框，选择“图形”选项，然后单击“确定

21、”按钮。选择渐变工具。导入素材。单击“文件” “导入”“导入到库”，将会弹出“选择导入文件到库”对话框，再次对话框中， 选择需要导入的火箭素材文件。 然后打开“窗口”“库”面板，并选中刚导入的文件，拖动到现场。动画的上、下、左、右添加 4 个黑色边框，在上边框中加入“神州六号的发射过程”，在下边框中加入“动画制作者” 。首页设计图如图 2 所示。图 22）模块设计主要模块包括：神6 发射过程，包括火箭发射、火箭拆分、卫星运行、宇航员服装功能介绍等。见图3 所示。图 3神 6 发射过程设计：新建一个图层，重命名，在第271 帧处单击鼠标右键，插入一个“普通帧” 。导入神州六号的发射塔素材，并拖到

22、场景中，同时在左上角输入文字“第一步：打开发射塔” ， 在第 340 帧中插入一个普通帧，导入发射塔元件，在 370 插入一个“关键帧” ，并将发射塔元件往右移动一段距离，然后单击鼠标右键，选择“创建补间动画”命令。最终效果如图4 所示。图 4 火箭发射根据第 1 步模块的设计，模仿制作其他模块。结果见图5、 6、 7 所示。3）尾页设计通常来说，动画的最后页面是非常重要的， 这标志着一个动画即将制作完毕。在第 996 帧中插入一个普通帧， 导入相关的素材， 并用文字工具输入自己喜欢的文字，效果如图8 所示。另外本设计还加入神六发射时的真实图片并配有音乐的片花，以加强观赏和视觉冲击效果。见设计动画演示。图 5 火箭拆分图 6 卫星运行图 7 宇航服功能介绍图 8 页尾介绍4 变成代码及 结合在网页中动画设计时，要进行以下两部分编程：第一部分就是当影片播放之后，自动停止动画的播放。 选择第 996