1、课程设计 II 报告共 18 页- 1 -多媒体设计Flash 动画制作目录1 设计内容 .- 2 -1.1 Flash 背景 .- 2 -1.2 设计内容 .- 3 -2 设计目的和要求 .- 3 -2.1 设计目的 .- 3 -2.2 设计要求 .- 3 -2.2.1 基本要求 .- 3 -2.2.2具体要求 .- 3 -2.2.3总体要求 .- 4 -3 设计环境或器材、原理与说明 .- 4 -3.1 硬件及软件环境 .- 4 -3.2 说明 .- 5 -4 设计过程文档 .- 5 -4.1 需求分析 .- 5 -4.2 需求设计 .- 5 -4.3 概要设计 .- 6 -4.4 详细设
2、计 .- 6 -4.4.1帧的选取 .- 6 -4.4.2帧的移动 .- 6 -4.4.3帧的复制 .- 7 -4.4.4帧的插入和删除 .- 7 -4.4.5形状补间动画的概念 .- 7 -4.4.6创建形状补间动画的方法 .- 7 -4.4.7关于 Flash中对图片的处理技术 .- 8 -4.4.8具体流程 .- 8 -4.5 系统测试 .- 17 -5 设计结果与分析 .- 17 -6 设计体会与建议 .- 17 -7 参考文献 .- 18 -课程设计 II 报告共 18 页- 2 -多媒体设计Flash 动画制作1 设计内容1.1 Flash 背景Flash 是由美国 Macrome
3、dia 公司出品的用于矢量图编辑和动画创作的专业软件。Flash 软件主要用于动画制作，使用该软件可以制作出网页交互式动画,还可以将一个较大的交互式动画。Flash 还被广泛用于多媒体领域，如交互式软件开发、产品展示等多个方面。随着 Flash 的广泛使用，出现了许多完全使用 Flash 制作的多媒体作品。由于 Flash 具有支持交互、文件体积小、效果棒等特性，并且不需要媒体播放器之类软件的支持，因此这样的多媒体作品取得了很好的效果，应用范围不断扩大。Flash 是一个优秀的矢量绘图与动画制作软件，它秉承了矢量绘图软件的所有优点，能制作出声色俱佳的动画效果。强大的动画编辑功能使得设计者可以随
4、心所欲地设计出高品质的动画，更加靓丽的图片色彩，且使 Flash 具有更大的设计空间。Flash 有三重意义：1) FLASH 英文本意为“闪光” ；2）它是全球流行的电脑动画设计软件；3）它代表用上述软件制作的流行于网络的动画作品。Flash 是一种交互式矢量多媒体技术，他的前身是Futureplash，早期网上流行的矢量动画插件。后来由于 Macromedia 公司收购了 Future Splash 以后便将其改名为 Flash2，到现在最新的 flashcs 3。现在网上已经有成千上万个 Flash 站点，著名的如Macromedia 专门 ShockRave 站点，全部采用了 Shoc
5、kwave Flash 和 Director。可以说 Flash 已经渐渐成为交互式知量的标准，未来网页的一大主流。Flash 最早期的版本称为 Future Splash Animator，当时 Future Splash Animator 最大的两个用户是微软（Microsoft）和迪斯尼（Disney） 。1996 年 11 月，Future Splash Animator 卖给了MM（M） ，同时改名为 Flash1.0。Macromedia 公司在 1997 年 6 月推出了Flash 2.0，1998 年 5 月推出了 Flash3.0。但是这些早期版本的 Flash 所使用的都是
6、 Shockwave 播放器。自 Flash 进入 4.0 版以后，原来所使用的 Shockwave 播放器便仅供 Director 使用。Flash 4.0开始有了自己专用的播放器，称为“Flash Player” ，但是为了保持向下相容性，Flash 仍然沿用了原有的扩展名：.SWF（Shockwave Flash） 。2000 年 8 月 Macromedia 推出了 Flash5.0，它所支持的播放器为 Flash Player 5。Flash 5.0 中的 ActionScript 已有了长足的进步，并且开始了对 XML 和Smart Clip（智能影片剪辑）的支持。ActionSc
7、ript 的语法已经开始定位为发展成为一种完整的面向对象的语言，并且遵循 ECMAScript 的标准，就像 javascript 那样。 2002 年 3 月 Macromedia 推出了 Flash MX 支持的播放器为 Flash Player 6。Flash 6 开始了对外部 jpg 和 MP3 调入的支持，同时也增加了更多的内建对象，提供了对 HTML 文本更精确的控制，并引如 SetInterval 超频帧的概念。同课程设计 II 报告共 18 页- 3 -时也改进了 swf 文件的压缩技术。之后 Macromedia 有相继推出了 Flash 8，Flash 9 及现在的 Fla
8、sh CS3。相信 Flash 的软件以后还会在不断的更新，使其更加完美。1.2 设计内容本设计我主要是用 Flash MX 2004 多媒体制作软件制作的一个简单的南京邮电大学图书馆简介动画，其主要由两部分组成，即动画和音频两部分。即主要是利用这种多媒体软件来制作动画。用Flash 软件做出的动画作品，其最大的特点是它能够把一些矢量图、位图、歌词和文字做成交互性很强的动画，不仅具有视觉和听觉的双重感受，而且使其更具有趣味性和创造性。2 设计目的和要求2.1 设计目的课程设计是教学计划的重要组成部分，是学生在校学习期间进行实践的一个重要教学环节。通过课程设计，使得学生能综合运用所学的知识，上机
9、解决一些与实际应用结合紧密的问题，巩固多媒体设计的基本知识和方法，通过 Flash 软件实现动画设计，进一步培养学生理论联系实际、综合分析和解决问题的能力。 2.2 设计要求 2.2.1 基本要求作品要求描述南邮仙林校区的某部分地貌、建筑等，画面精致，生动优美，有一定的交互性，最好能起到地图指示的作用。2.2.2具体要求1）严格遵守纪律，按计划进度完成课程设计任务。2）严格遵守实验室的各项规章制度，严禁做与实验无关的任何事情。课程设计 II 报告共 18 页- 4 -3）在课程设计过程中，要求理论联系实际，注意所学知识的综合运用，注重创造力的培养。4）课程设计过程中，要始终坚持严肃认真、实事求
10、是、独立思考、虚心学习、刻苦钻研的态度，要加强对基础理论、基本知识与基本技能的掌握和运用。5）请注意保存和备份自己的文档。6）禁止利用实验室条件进行看电影、打游戏、聊天等与老师布置的上机任务不相干的事情。2.2.3总体要求设计及实现要体现科学、合理性功能丰富、符合设题目要求 界面友好、外观漂亮、大方设计成果设计具有原创性设计报告正确合理、反映系统设计流程文档内容详实程度设计报告文档格式规范、排版美观3 设计环境或器材、原理与说明3.1 硬件及软件环境硬件：一台计算机软件：Flash MX 2004课程设计 II 报告共 18 页- 5 -3.2 说明运用 flash 制作动画是一个非常新颖的项
11、目，应该可以给人以视觉上的全新感受，故规划系统功能模块如下：1）动画模块：该模块主要制作动画所需要的动画场景。2）音频模块：该模块主要是插入动画的灵魂歌曲。4 设计过程文档4.1 需求分析动画是将静止的画面变为动态的艺术。实现由静止到动态，主要是靠人眼的视觉残留效应。利用人的这种视觉生理特性可制作出具有高度想象力和表现力的动画影片。动画以人类视觉的原理为基础。如果快速查看一系列相关的静态图像，那么我们会感觉到这是一个连续的运动。每一个单独图像称之为帧。帧是动画电影中的单个图像。动画与动画设计(即原画)是不同的概念，原画设计是动画影片的基础工作。原画设计的每一镜头的角色、动作、表情，相当于影片中
12、的演员。所不同的是设计者不是将演员的形体动作直接拍摄到胶片上，而是通过设计者的画笔来塑造各类角色的形象并赋予他们生命、性格和感情。动画片中的动画一般也称为“中间画” 。这是指两张原画的中间过程而言的。动画片动作的流畅、生动，关键要靠“中间画”的完善。一般先由原画设计者绘制出原画，然后动画设计者根据原画规定的动作要求以及帧数绘制中间画。原画设计者与动画设计者必须有良好的配合才能顺利完成动画片的制作。动画绘制需要的工具一般有：拷贝箱工作台、定位器、铅笔、橡皮、颜料、曲线尺等。方法是：按原画顺序将前后两张画面套在定位器上，然后再覆盖一张同样规格的动画纸，通过台下拷贝箱的灯光，在两张原画动作之间先画出
13、第一张中间画（称为第一动画），然后再将第一动画与第一张原画叠起来套在定位器上，覆盖另一张空白动画纸画出第二动画。依此方法，绘制出两张原画之间的全部动作。4.2 需求设计1) 确定动画的展示流程及各镜头的脚本；2）拍摄一些与动画制作相关的照片，如图书馆的内部重要部分及学校的正门；3）对拍摄好的照片进行一系列的处理；课程设计 II 报告共 18 页- 6 -4）将处理好的图片导入到 Flash；5) 进行制作；6) 配上合适的音乐。在分镜头画面脚本绘制过程中，应养成填表的好习惯，在表格中注明画面的景别，画面景别使用的专业术语有：大特写、特写、近景、中景、全景、远景、全远景、纵深景等。4.3概要设计
14、本设计主要用到了对帧的操作技术。简要如下：帧的选取，帧的移动，帧的复制，帧的插入和删除等基本操作，另外还用到一些遮罩效果，时间轴特效。本设计分模块进行逐个制作：1）在动画的播放过程中，一直有上下小遮罩层，上面标注：南京邮电大学，下面标注：07002907制作。它是开始播放时从中间渐渐拉开的遮罩层。2）文字的制作，尽量使文字的插入效果看上去匹配图片的动画效果，其次对文字可以做一些效果，比如文字的探照灯效果，多彩的艺术字等。3）图片的插入以及一些特效编辑模块，如图片的动作效果，形状效果，旋转进入画面，缩放等。4）对音乐的处理也是一个关键点，因为要将音乐中关于歌曲的歌唱和歌词移动的速度匹配，因此需要
15、对帧，声音的操作同步。5）最后新建一层选取最后一帧，添加一个按钮，其具有的功能是：点击该按钮可以重新开始播放该动画。且该帧还应添加一个动作：停止。4.4详细设计4.4.1帧的选取1）多帧的选取，按住 Ctrl 键再选取；2）非关键帧的单帧选取，按 Ctrl 点选；3）运动（motion）或形状（shape）的选取，光标变成手掌直接点选。课程设计 II 报告共 18 页- 7 -4.4.2帧的移动1）单帧（关键帧）的移动，用鼠标左键按住该帧不放的同时，在本层上进行左右移动；2）多帧移动，选取多帧，用鼠标左键按住不放，移动到别层或本层不同位置（注如果原位置有帧，将会被复盖） 。4.4.3帧的复制1
16、）选取单帧或多帧，按 Alt 键出现手掌加号，则可拖到目标粘贴位置方开鼠标 OK，可以本层也可以其它层；2）选取单帧或多帧，按 Ctrl+C 复制，到目标粘贴位置按 Ctrl+V 粘贴。可以本层也可以其它层，其它场景，共它文件都可以。4.4.4帧的插入和删除1）单帧插入/删除，在插入/删除位置按 F5/Shift+F5，如果想同时对所有层一起插入/删除，则把光标点到上面的刻度尺位置，按 F5/Shift+F5。如果只想对某几个层（只可以是连续的层）同时插入/删除，则你在最高层（或最底层）的插入/删除位置按住 ctrl 垂直往下（或往上）选择所有要插入/删除层按 F5/Shift+F5；2）多帧
17、插入/删除，选取多帧按 F5/Shift+F5，关于所有层或某几个层的插入方法同上述，只是选取帧是选取多帧或单帧的分别。 4.4.5形状补间动画的概念在 Flash 的时间帧面板上，在一个时间点（关键帧）绘制一个形状，然后在另一个时间点（关键帧）更改该形状或绘制另一个形状，Flash 根据二者之间的帧的值或形状来创建的动画被称为“形状补间动画” 。构成形状补间动画的元素：形状补间动画可以实现两个图形之间颜色、形状、大小、位置的相互变化，其变形的灵活性介于逐帧动画和动作补间动画二者之间，使用的元素多为用鼠标或压感笔绘制出的形状，如果使用图形元件、按钮、文字，则必先“打散（Ctrl+B） ”再变形
18、。课程设计 II 报告共 18 页- 8 -4.4.6创建形状补间动画的方法在时间轴面板上动画开始播放的地方创建或选择一个关键帧并设置要开始变形的形状，一般一帧中以一个对象为好，在动画结束处创建或选择一个关键帧并设置要变成的形状，再单击开始帧，在【属性】面板上单击【补间】旁边的小三角，在弹出的菜单中选择【形状】 ，此时，时间轴上的变化，一个形状补间动画就创建完毕。Flash 的【属性】面板随鼠标选定的对象不同而发生相应的变化。当我们建立了一个形状补间动画后，点击时间帧， 【属性】面板。图片的动画效果，文字的遮罩效果，文字的淡入淡出效果，元件的制作与素材的引用，Flash 音乐导入与播放控制，F
19、lash 中声音和声道平衡的控制。设置关键帧（F6） ，在后面出设计关键帧并补间动画，如图 1 所示。图 14.4.7关于 Flash中对图片的处理技术Flash 动画时间的技巧对动画时间的基本考虑是放映速度：电影和电视的放映速度是 24 帧/秒，而动画片一般有 12 帧就可以了，然后录制或拍摄时进行双格处理。如果绘制动作较快的动画最好进行单格处理，即每秒要绘制 24 个画面。对于快速奔跑的动作，一般采用 8 帧单格画面。对于物体发生震动用单格处理两端的动作就可以了。动画的间格距离表现：物体的静止到移动到静止都有类似的规律：静止开始时速度慢、运动中的速度快、运动停止时的速度慢。表现在帧数上则是
20、：从静止到运动帧数逐渐减少，从运动到静止帧数逐渐增加，中间运动过程的速度最快，帧数也最少。动画中经常会有循环动作，但不同的情况需要的帧数也是不同的。4.4.8具体流程1)动画的开场效果制作开场是个拉幕的效果，由两个遮罩层从中间拉起来，首先映入眼帘的是南京邮电大学的正门，如图 2，图 3，图 4。图 2，动画的开始画面，遮罩层还未开始拉开；图 3，遮罩层已经拉开一点了；图 4，遮罩层已经完全拉开。当遮罩层完全拉开后，就会一直保持在图 4 这个状态，直至动画的结束。课程设计 II 报告共 18 页- 9 -图 2图 3课程设计 II 报告共 18 页- 10 -图 42）动画的补间动作制作该动画的很多部分都采用了补间动作效果，如图 5，图 6 。图 5 是该图片的初始状态 1；图 6 是该图片缩小后的状态 2，在这两个图片的过程中，因为采用了补间动作效果，所以在播放过程中，随着时间的推移，该图片会自动由状态 1 渐渐转变成状态 2。最后，我会插入一个空白关键帧（F7）,这样在观看的时候，就像其在中间淡去了或消失，紧接着就是“主要介绍：图书馆”几个文字的出现。由补间动作制作，可以达到很好的图片动画。
