多媒体动画制作技术.ppt

6.1 6.1 动画的基本概念动画的基本概念 动画规则动画规则 电脑动画电脑动画 动画制作软件动画制作软件 动画文件格式动画文件格式 6.2 GIF6.2 GIF动画制作动画制作 6.2.1 GIF 6.2.1 GIF动画特点动画特点 6.2.2 6.2.2 制作制作GIFGIF动画过程动画过程 6.3 FLASH6.3 FLASH动画制作动画制作 6.3.1 FLASH 6.3.1 FLASH窗口界面窗口界面 6.3.2 6.3.2 组件应用技术组件应用技术 6.3.3 6.3.3 图层和帧图层和帧 6.3.4 6.3.4 几类简单动画实例几类简单动画实例 6.3.5 6.3.5 基本的动作语言应用基本的动作语言应用 学习目标学习目标1.掌握动画的概念及基本原理；2.了解GIF动画制作的过程及特点；3.熟练使用Flash软件；4.了解基础动画制作的技术与方法；5.能应用Flash软件独立制作简单的动画实例。动画规则动画规则（1）动画由多幅静止画面组成，并且画面必须连续；（2）画面之间的内容必须有所差异；（3）画面表现的动作必须连续，即后一幅画面是前一幅画面的继续。电脑动画电脑动画 电脑动画（Computer Animation）是一种借助计算机生成一系列可动态实时演播的连续图像的技术，它是计算机图形学和艺术相结合的产物。电脑动画的原理与传统动画基本相同，只是在传统动画的基础上将计算机技术应用于动画的处理和应用中，并可实现传统动画无法达到的效果。1.电脑动画的特点电脑动画的特点（1）与传统动画相比，在制作以及应用领域上，电脑动画都存在着无比的优越性。（2）电脑动画具有质量高、制作周期短、管理简单化等优点。（3）动画制作软件及硬件技术的支撑。2.电脑动画的分类电脑动画的分类 二维动画是平面上的画面，又叫二维动画是平面上的画面，又叫“平面动平面动画画”。二维动画是对手工传统动画的一个改。二维动画是对手工传统动画的一个改进，具有非常丰富的表现手段、强烈的表现进，具有非常丰富的表现手段、强烈的表现力和良好的视觉效果。力和良好的视觉效果。二维动画二维动画二维动画二维动画三维动画三维动画三维动画三维动画 三维动画，又称三维动画，又称3D3D动画，是近年来随着计算机动画，是近年来随着计算机硬件技术的发展而产生的一种新兴技术，主要硬件技术的发展而产生的一种新兴技术，主要表现三维的动画主体和背景。表现三维的动画主体和背景。3.电脑动画的制作方法和技术电脑动画的制作方法和技术（1）关键帧动画 关键帧制作的基本原理即是用户设定首帧和尾帧的属性和位置后，中间帧由计算机自动生成。（2）逐帧动画 逐帧动画有点类似于前面涉及到的翻转书.逐帧动画示例逐帧动画示例（3）路径动画）路径动画 路径动画就是由用路径动画就是由用户根据需要设定好户根据需要设定好一个路径后，使场一个路径后，使场景中的对象沿着路景中的对象沿着路径进行运动。径进行运动。（4）变形动画）变形动画 变形动画是通过记录物体的变形过程来制作动变形动画是通过记录物体的变形过程来制作动画的方法画的方法.（5）过程动画）过程动画 过程动画指的是动画中物体的运动及变形用一个过程来描述。动画的制作及浏览都是过程化管理的，三维动画制作软件中的粒子系统就属于这一动画制作方式。过程动画效果过程动画效果 粒子系统制作的特效粒子系统制作的特效（5）关节动画）关节动画关节动画可分为正向动力学和反向动力学。正向动力学是通过对关节旋转角设置关键帧，得到相关联的各个肢体的位置；反向动力学是用户指定末端关节的位置，由计算机自动计算出各中间关节的位置。关节动画制作关节动画制作 此类动画技术大量此类动画技术大量地运用于动物与人的地运用于动物与人的动画建模中动画建模中（6）对象动画）对象动画 在多媒体制作中，对象动画可以算是最基础最有效的一种动画技术。Flash是典型的基于对象的动画软件。在用Flash制作动画过程中，最基本的元素就是对象，在编辑区内创建的任何元素都是矢量的对象。4电脑动画的应用领域电脑动画的应用领域（1 1）电影业）电影业 这些恐龙中一部分是这些恐龙中一部分是用模型、一部分是用用模型、一部分是用三维动画制作而成的，三维动画制作而成的，两者完美地结合才能两者完美地结合才能达到这么以假乱真的达到这么以假乱真的境界境界 电脑动画的应用领域电脑动画的应用领域（2 2）电视片头和电）电视片头和电视广告视广告 计算机动画能制计算机动画能制作出一些神奇的视作出一些神奇的视觉效果，营造出一觉效果，营造出一种奇妙无比、超越种奇妙无比、超越现实的夸张浪漫色现实的夸张浪漫色彩彩 。电脑动画的应用领域电脑动画的应用领域（3 3）科学计算和工）科学计算和工业设计业设计 借助动画技术，可借助动画技术，可以使人们将产品的以使人们将产品的风格、功能仿真、风格、功能仿真、力学分析、性能实力学分析、性能实验以及最终的产品验以及最终的产品都呈现出来。都呈现出来。电脑动画的应用领域电脑动画的应用领域（4）教育和娱乐 计算机动画在教育中的应用前景非常宽阔，教育中的有些概念、原理性的知识点比较抽象，这时借助计算机动画把各种现象和实际内容进行直观演示和形象教学，大到宇宙，小到基因结构，都可以淋漓尽致地表现出来。电脑动画的应用领域电脑动画的应用领域 计算机动画计算机动画创设的真实的场创设的真实的场景、逼真的人物景、逼真的人物形象以及事件处形象以及事件处理，受到了娱乐理，受到了娱乐界的极力推崇界的极力推崇 。电脑动画的应用领域电脑动画的应用领域（5）虚拟现实 虚拟现实是利用计算机动画技术模拟产生的一个三维空间的虚拟环境系统。在动画制作的基础上，借助于系统提供的视觉、听觉及触觉的设备，“身临其境”地置身于这个虚拟环境中随心所欲地活动，就像在真实世界中一样。动画制作软件动画制作软件 MayaMaya3DS MAX3DS MAXFlashFlashAnimator StudioAnimator StudioAnimator Studio Animator Studio是美国Autodesk公司于1995年在操作系统上推出的一种集图像处理、动画设计、音乐编辑、音乐合成、脚本编辑和动画播放于一体的二维动画设计软件。Flash 它是一种交互它是一种交互式动画设计工具，式动画设计工具，用它可以将音乐、用它可以将音乐、声效、动画以及声效、动画以及富有新意的界面富有新意的界面融合在一起，以融合在一起，以制作出高品质的制作出高品质的网页动态效果。网页动态效果。3DS MAX 3DS MAX3DS MAX被广被广泛应用于广告、泛应用于广告、影视、工业设影视、工业设计、建筑设计、计、建筑设计、多媒体制作、多媒体制作、游戏、辅助教游戏、辅助教学以及工程可学以及工程可视化等领域视化等领域.Maya MayaMaya不仅包不仅包括一般三维和括一般三维和视觉效果制作视觉效果制作的功能，而且的功能，而且还结合了最先还结合了最先进的建模、数进的建模、数字化布料模拟、字化布料模拟、毛发渲染和运毛发渲染和运动匹配技术等动匹配技术等 .动画文件格式动画文件格式 GIFGIF动画格式动画格式动画格式动画格式FLIC(FLI/FLC)FLIC(FLI/FLC)格式格式格式格式SWFSWF格式格式格式格式AVIAVI格式格式格式格式MOVMOV、QTQT格式格式格式格式6.2 GIF动画制作动画制作 GIF动画制作工具介绍 ImageReady是一款专门用来编辑动画的软件，它弥补了Photoshop在编辑动画以及网页素材方面的不足。ImageReady中包含了大量制作网页图像和动画的工具，甚至可以产生部分html代码，可以说是功能强大.ImageReady界面界面 6.2.2 制作过程制作过程“弹指神功弹指神功“变化过变化过程程6.2.2 制作过程制作过程预览与存储预览与存储预览与存储预览与存储图层与帧的配合图层与帧的配合图层与帧的配合图层与帧的配合制作制作制作制作GIFGIF动画动画动画动画弹指神功制作过程弹指神功制作过程 6.3 FLASH动画制作动画制作 FLASHFLASH窗口界面窗口界面窗口界面窗口界面1菜单栏2工具箱3.时间轴4.4.舞台工作区舞台工作区5.5.属性设置面板属性设置面板6.3.2 组件应用技术组件应用技术 在讲组件之前，首先要理解一个概念，即元件。元件是在讲组件之前，首先要理解一个概念，即元件。元件是flashflash动画中的主要动画元素，分为影片剪辑、按钮、图形动画中的主要动画元素，分为影片剪辑、按钮、图形三种类型，它们在动画中各具不同的特性与功能。三种类型，它们在动画中各具不同的特性与功能。FlashFlash运运用它可以更好地管理对象。用它可以更好地管理对象。在不给图形元件和影片剪辑赋予动作的时候，这两种元件在不给图形元件和影片剪辑赋予动作的时候，这两种元件类型是没有什么大的区别的，可以在类型是没有什么大的区别的，可以在FlashFlash制作中通用，但制作中通用，但是每个元件都有自己的特点。利用图形元件制作的移动渐是每个元件都有自己的特点。利用图形元件制作的移动渐变动画放到场景中的时间线上，不必通过【文件】变动画放到场景中的时间线上，不必通过【文件】|【发布【发布】就可以直接按】就可以直接按“Enter”“Enter”进行测试。而影片剪辑是不行的。进行测试。而影片剪辑是不行的。另外，影片剪辑可以独立于时间轴播放，而图形元件不可另外，影片剪辑可以独立于时间轴播放，而图形元件不可以。综合区分图形元件与影片剪辑可以参考各自的属性面以。综合区分图形元件与影片剪辑可以参考各自的属性面板。板。按钮元件的时间轴与其他元件不同，只有按钮元件的时间轴与其他元件不同，只有四个帧。分别是：弹起，鼠标经过，按下四个帧。分别是：弹起，鼠标经过，按下和点击。如图和点击。如图6-306-30所示。所示。现在再来看什么是组现在再来看什么是组件技术。件技术。Flash MXFlash MX以以上版本的组件概念是上版本的组件概念是由由flashflash的智能剪辑延的智能剪辑延伸而来的，组件即是伸而来的，组件即是被封装好的具备一定被封装好的具备一定功能的对象。因此，功能的对象。因此，若要创建一个组件，若要创建一个组件，必须创建一个影片剪必须创建一个影片剪辑元件并将它链接到辑元件并将它链接到该组件的类文件中。该组件的类文件中。图图6-336-33是是Flash 8.0 Flash 8.0 的的组件面板。组件面板。6.3.3 图层和帧图层和帧1 1图层图层图层图层形象地说，图层可以看成是叠放在一起的透明胶片，形象地说，图层可以看成是叠放在一起的透明胶片，如果层上没有任何东西，就可以透过它直接看到下如果层上没有任何东西，就可以透过它直接看到下一层。所以可以根据需要，在不同层上编辑不同的一层。所以可以根据需要，在不同层上编辑不同的动画而互不影响，并在放映时得到合成的效果。动画而互不影响，并在放映时得到合成的效果。图层可以分为普通图层、引导层和遮罩层。图层可以分为普通图层、引导层和遮罩层。2 2帧帧帧帧随着时间轴的推进，动画会按照时间轴的横轴方向随着时间轴的推进，动画会按照时间轴的横轴方向播放，而帧的所有操作均在时间轴上进行。在时间播放，而帧的所有操作均在时间轴上进行。在时间轴上，每一个小方格就是一个帧，在默认状态下，轴上，每一个小方格就是一个帧，在默认状态下，每隔每隔5 5帧进行数字标示，如时间轴上帧进行数字标示，如时间轴上 1 1、5 5、1010、15 15 等数字的标示。等数字的标示。帧可以分为关键帧、过渡帧、空白关键帧三类。帧可以分为关键帧、过渡帧、空白关键帧三类。6.3.4 简单动画实例简单动画实例1逐帧动画逐帧动画2移动动画（移动动画（Motion）3变形动画变形动画1.逐帧动画逐帧动画（1 1）新建文件）新建文件（2 2）打开）打开“文件文件”“”“导入导入”“”“导入到导入到舞台舞台”命令，将目录下的图片导入到场景命令，将目录下的图片导入到场景中。在单击打开按钮后，中。在单击打开按钮后，FlashFlash将自动检将自动检测到该图片是一系列图片中的第一张，所测到该图片是一系列图片中的第一张，所以会出现对话框提示是否导入所有动画序以会出现对话框提示是否导入所有动画序列。列。1.逐帧动画逐帧动画（3 3）单击）单击“是是”允许将整个动画允许将整个动画序列导入，此时，序列导入，此时，按按“Enter”“Enter”键就键就可以查看结果了可以查看结果了 .2.移动动画（移动动画（Motion）（1 1）新建文件；）新建文件；（2 2）插入两个图形元件，笑脸和哭脸）插入两个图形元件，笑脸和哭脸 2.移动动画（移动动画（Motion）（3 3）回到主场景，将）回到主场景，将laughfacelaughface拖到第拖到第1 1帧，帧，并置于舞台顶端；延续运动时间，在第并置于舞台顶端；延续运动时间，在第1717帧帧处将处将laughfacelaughface拖到舞台底端，并设定移动动拖到舞台底端，并设定移动动画，在属性面板中给小球一个加速度，即设画，在属性面板中给小球一个加速度，即设置缓动值置缓动值.2.移动动画（移动动画（Motion）自定义缓动值自定义缓动值 2.移动动画（移动动画（Motion）（4）在第20帧设定空关键帧，并将cryface拖入到场景中，位置与原图吻合。从第17帧到19帧，larughface由于碰到地面发生变形，因此，用任意变形工具将圆脸挤成椭圆形，第20帧的cryface也被变形至第19帧的椭圆状。2.移动动画（移动动画（Motion）2.移动动画（移动动画（Motion）（5 5）2121帧时，恢复至帧时，恢复至1919帧模式，帧模式，2525帧对应帧对应1717帧模式，即恢复至原形。从帧模式，即恢复至原形。从2525帧帧4040帧，帧，laughfacelaughface又跳跃至高处，设定动画的同时给小又跳跃至高处，设定动画的同时给小球一个减速运动的过程。球一个减速运动的过程。3.变形动画变形动画（1 1）新建文件，在工具箱中选择椭圆工具，）新建文件，在工具箱中选择椭圆工具，并绘制一个正圆并绘制一个正圆.3.变形动画变形动画（2 2）选择第一帧，在属性面板中选择创建形状渐）选择第一帧，在属性面板中选择创建形状渐变动画变动画“shape”“shape”。而后在第二十帧中插入关键帧，。而后在第二十帧中插入关键帧，选中所画的圆，执行选中所画的圆，执行“修改修改”“”“形状形状”“”“将将线条转换为填充线条转换为填充”。3.变形动画变形动画（3 3）在第）在第4040帧处插入关键帧，绘制和第一帧帧处插入关键帧，绘制和第一帧同样的无填充的外框圆形。而后预览，就可以同样的无填充的外框圆形。而后预览，就可以看到该形状渐变形成了很复杂的变化看到该形状渐变形成了很复杂的变化.基本的动作语言应用基本的动作语言应用 通过通过Windows(Windows(窗口窗口)/Actions()/Actions(动作动作)命令，命令，调出面板：调出面板：基本的动作语言应用基本的动作语言应用（1 1）Play(Play(播放播放)（2 2）Stop(Stop(停止停止)1一些常用的Action基本的动作语言应用基本的动作语言应用（3）Go to and Play(跳至并播放)（4）Get URL(获取 URL)（5）Load Movie(载入影片)（6）Unload Movie(影片卸载)（7）Tell Target(告知目标)（8）If Frame Is Loaded(如果帧已经装入)基本的动作语言应用基本的动作语言应用（9）On Mouse Event(鼠标事件)：响应鼠标事件的动作集合，常常与按钮组件有关。Press：按下鼠标 Release 激活，而非 Press 动作 Roll Over：鼠标移入引发的事件 Roll Out：鼠标移出引发的事件2.Action实例实例（1 1）打开）打开FlashFlash，按，按Ctrl+F8Ctrl+F8，新建立一个，新建立一个影片剪辑，并起名字为影片剪辑，并起名字为circlecircle。实例实例（2 2）回到舞台工作区，按）回到舞台工作区，按F11F11打开库，将打开库，将circlecircle影片剪辑拖放到舞台中。并给这个实例起个名字影片剪辑拖放到舞台中。并给这个实例起个名字叫叫mcmc。（现在就可以按。（现在就可以按Ctrl+Ctrl+回车键测试效果，回车键测试效果，就可以看到这个圆形一直在不停的移动。）就可以看到这个圆形一直在不停的移动。）（3 3）添加脚本，现在要让这个）添加脚本，现在要让这个mcmc在影片一开始在影片一开始不要自动播放。选中时间轴的第一帧，按不要自动播放。选中时间轴的第一帧，按F9F9打打开动作面板，输入：开动作面板，输入：_()_()6-71 6-71 第一帧的动作设置第一帧的动作设置第一帧的动作设置第一帧的动作设置（4 4）接下来做几个按钮，分别表示播放、暂）接下来做几个按钮，分别表示播放、暂停、前进、后退、停止。并摆放在舞台上。停、前进、后退、停止。并摆放在舞台上。（5 5）现在要添加控制影片的脚本，把脚本直接写）现在要添加控制影片的脚本，把脚本直接写在舞台上这些按钮的身上。选中播放按钮，打开在舞台上这些按钮的身上。选中播放按钮，打开动作面板，输入：动作面板，输入：on(release)on(release)_();_();如果要在按钮身上写脚本的话，必须使用如果要在按钮身上写脚本的话，必须使用onon(事件事件)/)/脚本程序脚本程序 的格式来写！上面的脚本作的格式来写！上面的脚本作用就是：当在这个按钮上按一下鼠标（用就是：当在这个按钮上按一下鼠标（releaserelease事件）的时候，就会执行下面的事件）的时候，就会执行下面的_();_();程序，它的程序，它的意思是让舞台上的意思是让舞台上的mcmc开始播放！开始播放！（6 6）同理，选中舞台上的暂停按钮，在它上面输入：）同理，选中舞台上的暂停按钮，在它上面输入：）同理，选中舞台上的暂停按钮，在它上面输入：）同理，选中舞台上的暂停按钮，在它上面输入：on(release)on(release)_()_()在前进的按钮上输入：在前进的按钮上输入：on(release)on(release)_();/_();/表示播放下一桢表示播放下一桢 在后退的按钮上输入：在后退的按钮上输入：on(release)on(release)_();/prevFrame_();/prevFrame表示回到动画的上一桢表示回到动画的上一桢 在停止的按钮上输入：在停止的按钮上输入：on(release)on(release)_root.mc.gotoAndStop(1);/_root.mc.gotoAndStop(1);/跳到跳到mcmc影片的第一桢，并停止播放影片的第一桢，并停止播放 图图6-73 脚本控制的移动动画脚本控制的移动动画 本章小结本章小结本章主要介绍了多媒体动画制作过程中的一些基本章主要介绍了多媒体动画制作过程中的一些基本概念与技术，涉及到以下几个知识点：本概念与技术，涉及到以下几个知识点：1 1电脑动画的相关概念电脑动画（电脑动画的相关概念电脑动画（Computer Computer AnimationAnimation）是一种借助计算机生成一系列可动）是一种借助计算机生成一系列可动态实时演播的连续图像的技术，它是计算机图形态实时演播的连续图像的技术，它是计算机图形学和艺术相结合的产物。根据不同的分类维度，学和艺术相结合的产物。根据不同的分类维度，电脑动画可以有很多种类。电脑动画可以有很多种类。本章小结本章小结 2 2动画的基本原理视觉暂留原理，即物体移开后其形动画的基本原理视觉暂留原理，即物体移开后其形象在人眼视网膜上还可停留约至秒，因此，当以每秒象在人眼视网膜上还可停留约至秒，因此，当以每秒2424帧的速度播放静止的单独画面时，就会看到连续的画面。帧的速度播放静止的单独画面时，就会看到连续的画面。3 3GIFGIF动画的概念及特点动画的概念及特点GIF(Graphics Interchange GIF(Graphics Interchange Format)Format)，原义是，原义是“图像互换格式图像互换格式”，是，是CompuServeCompuServe公公司在司在19871987年开发的图像文件格式。年开发的图像文件格式。GIFGIF图像的深度从图像的深度从lbitlbit到到8bit8bit，也即，也即GIFGIF最多支持最多支持256256种色彩的图像。另外，在种色彩的图像。另外，在一个一个GIFGIF文件中可以存多幅彩色图像，如果把存于一个文件中可以存多幅彩色图像，如果把存于一个文件中的多幅图像数据逐幅读出并显示到屏幕上，就可文件中的多幅图像数据逐幅读出并显示到屏幕上，就可构成一种最简单的动画。构成一种最简单的动画。本章小结本章小结4 4ImageReadyImageReady软件及软件及FlashFlash软件的使用软件的使用ImageReadyImageReady是一款专门用来编辑动画的软件，是一款专门用来编辑动画的软件，其中包含了大量制作网页图像和动画的工具，甚其中包含了大量制作网页图像和动画的工具，甚至可以产生部分至可以产生部分htmlhtml代码。代码。FlashFlash是美国的是美国的MACROMEDIAMACROMEDIA公司于公司于19991999年年6 6月推出的优秀网月推出的优秀网页动画设计软件。它是一种交互式动画设计工具，页动画设计软件。它是一种交互式动画设计工具，用它可以将音乐、声效、动画以及富有新意的界用它可以将音乐、声效、动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。面融合在一起，以制作出高品质的网页动态效果。它的最大特点是能使用矢量图形和流式播放技术、它的最大特点是能使用矢量图形和流式播放技术、能通过使用关键帧和图符使得所生成的动画文件能通过使用关键帧和图符使得所生成的动画文件非常小以及动画编辑功能等。非常小以及动画编辑功能等。5 5FlashFlash软件的基本技术元件、组件、图层、软件的基本技术元件、组件、图层、帧等。元件是帧等。元件是flashflash动画中的主要动画元素，分动画中的主要动画元素，分为影片剪辑、按钮、图形三种类型，它们在动画为影片剪辑、按钮、图形三种类型，它们在动画中各具不同的特性与功能。中各具不同的特性与功能。FlashFlash运用它可以更运用它可以更好地管理对象。组件即是被封装好的具备一定功好地管理对象。组件即是被封装好的具备一定功能的对象。图层可以看成是叠放在一起的透明胶能的对象。图层可以看成是叠放在一起的透明胶片，如果层上没有任何东西，就可以透过它直接片，如果层上没有任何东西，就可以透过它直接看到下一层。图层可以分为普通图层、引导层和看到下一层。图层可以分为普通图层、引导层和遮罩层。在时间轴上，每一个小方格就是一个帧。遮罩层。在时间轴上，每一个小方格就是一个帧。一般来说，帧可以分为关键帧、过渡帧、空白关一般来说，帧可以分为关键帧、过渡帧、空白关键帧三类。键帧三类。本章小结本章小结本章小结本章小结6几种动画类型的制作逐帧动画、移动动画、变形动画。逐帧动画由一系列的相关帧构成，其优点是便于进行精确地操作控制，而缺点是需要大量的人工绘图，文件比较大。区别于逐帧动画，移动动画需要满足以下几个条件：至少两个关键帧；关键帧中必包含必要的组合实体；需设定移动渐变的动画方式。