平面动画设计-动画基本原理及技术

1、平面动画设计 - 动画基本原理 及技术导入动画基本原理及技术教学目标：了解动画的基本原理； 了解电脑动画的特点和制作的一般过程； 掌握 Flash 平面动画制作软件的特点； 掌握 Flash 动画中逐帧动画的制作方法。 教学重点：Flash 平面动画制作软件的特点；Flash 动画中逐帧动画的制作方法。 教学难点：逐帧动画的制作。 教学媒体： 多媒体网络实验室、多媒体课件、动画素材 课时安排：2 学时首先播放两个用 Flash 制作的动画（商业广 告和用 Flash 制作的网页） ，以激发学生学习该 门课程的兴趣。然后通过动画的发展来导入新课。 1831 ：法国人约瑟夫安东尼普拉特 奥在可转动

2、圆盘上画了一些图片。 1906 ：美国人 J 斯泰瓦德制作非常接近 现代动画概念的短片“滑稽面孔的幽默形 象”。 1908 ：法国人 Emile Cohl 首创用负片制 作动画影片，解决影片载体的问题。 1909 ：美国人 Winsor McCay用一万张图 片表现一段动画故事， 世界上第一部真正的动画 短片。 1915 ：美国人 Eerl Hurd 发明动画制作 新工艺在赛珞璐片上画动画片， 再拍摄成动 画影片。 1928 ：华特迪斯尼( Walt Disney) ， 商业动画影片之父的动画精品。 现在：“电脑动画”、“电脑动画特技 效果”。新课1动画原理用图片和动画展示早期的动画效果。11

3、 什么是动画英国动画大师约翰海勒斯：动作的变化是 动画的本质。由于每幅画面物体位置和形态不 同，因此连续观看时给人以活动的感觉。动画利用人类眼睛的“视觉滞留效应”，物 体在大脑神经中停留 1/24s ，因此若连续更换 24 幅以上的画面，则给人视觉上形成连续的影象。传统动画的性质 由多幅画面构成， 称为 “帧动画”新的本质动画除了动作的变化，还发展 出颜色、材料质地、光线强弱的变化等等。动画规则1.2.1 构成规则动画由多画面组成，并且画面必须连续;画面之间的内容必须存在差异 ;画面表现的动作必须连续。表现手法相关规则：在严格遵循运动规律的前提下，可进行 适度的夸张和发展 ;节奏的掌握以符合自

4、然规律为主要标 准;节奏通过画面之间物体相对位移量进行 控制。1.3 全动画和半动画“全动画”指在动画制作中，为了追求 画面的完美、 动作的细腻和流畅， 按照每秒播放 24 幅画面的数量做作的动画，具有极佳的观赏 性。“半动画”又称“有限动画”，采用少 于每秒 24 幅的画面来绘制动画，常见的一般为 每秒 6 幅。一般采用重复动作、 延长画面动作停 顿的画面数来凑足 24 幅画面。全动画和半动画几乎需要完全相同的技巧， 不同之处仅在于制作画面的工作量和经济原因。1.4 动画制作过程 动画制作过程中，要事先准确的策划好每一 个动作的时间、 画面数， 以此来避免财力和时间 的浪费。 动画制作过程一

5、般为：（1）制作声音对白和背景音乐。由声音 计算动画格数；（2）制作关键画面。设计人员绘制动画 人物造型、景物等关键画面；（3）绘制动画画面。绘制人员绘制关键 画面间的过渡插画；（4）复制成赛珞璐片；5）上色。为赛珞璐片上的人物和景物上色；（6）核实检查动画画稿。拍摄电影胶片 前最后检查；（7）拍摄电影胶片。赛珞璐片到电影的 拍摄；（8）后期制作。 对胶片进行剪辑和编辑， 以达到最好的银幕效果。 电脑的出现使这个过程得以简化： 有些人 完成动画画面的绘制以后采用图像扫描仪把画 稿转换成数字图像，利用电脑来上色或其他处 理，或者再利用专门的设备把数字图像转换成录 像带，供电视播放用。2. 电脑动

6、画 指用计算机制作的动画。 发展经历三个阶段：第一阶段：用电脑画出简单的线条和几何图 形，电脑把绘画过程记录下来，在需要时，可利 用电脑重复绘画过程，使人们看到活动的画面。第二阶段： 活动的主体从简单的线条、 几何 图形过渡到比较复杂的图形。 画面上的变化模式 和多种颜色的运用使这一阶段的动画具有良好 的视觉效果，开始体现电脑动画的风格。第三阶段： 模拟手工动画， 进一步制作收集 动画难以表现的题材。21 电脑动画基本概念电脑动画的种类 :帧动画 模拟以帧为基本单位的传统动 画，占动画产品的 98%。矢量动画 经过电脑运算而确定的运行轨 迹和形状的动画。按表现形式分： 平面动画亦称“二维动画”

7、，以传统平面绘画为基础的动画变形动画 将物体形态从一种形态过渡到 另一种形态的动画。空间动画 亦称“三维动画”， 形成三维 造型及空间运动的动画。电脑动画的特点 :所有动画必须经过电脑的运算和处理。 电脑软件是动画制作的必要条件，并提供自 动动画功能。电脑动画以文件形式保存，采用国际标准的FLC和 GIF89a 格式。动画制作软件Animator Pro 、 Animation Studio 、 Flash 、 WinImage：morph等用于制作各种平面动画，例 如专业动画、网页动画、变形动画等。3D Studio 、3D Studio Max 、Cool 3D 、Maya 等用于各种各样

8、的三维动画， 例如三维动画、 文 字三维、特技三维动画等。实际动画素材中，一般不止使用一个动画软 件，而是多个动画软件共同编辑的结果。3.Flash 动画制作软件Flash 简介Flash 是 Macromedia 公司推出的著名的矢量 动画制作软件 ，用它能制作精湛的网页画面。Flash 制作的动画， 除在网页浏览外， 还可以 在专门的播放器播放， 也可以直接输出为可执行 文件、 AVI 文件、 GIF 动画或图像。Flash 的制作是以时间轴为主线， 方便地控制 每一关键帧，还可根据需要，调整每秒显示帧数。Flash 应用的几个方面Flash 2D 动画制作：包括 MTV动画、片头光 盘、

9、广告动画等 。多媒体课件开发 ：用 Flash 制作出来的课件 具有高质量低容量的特点， 适应了网络课件的要 求。基于网页的 Flash 动画：由于受网络速度的 影响，人们都希望用在网页里的素材容量越小越 好。而 Flash 是基于矢量模式的， 做出来的动画 容量可以很小。Flash 的基本概念图层一个图层， 指动画编辑的物理层 , 层如一张透 明的纸 , 除了画有图形或文字的地方，其他部 分都是透明的； 图层又是相对独立的， 修改其中 一层，不会影响到其他层。图层有 4 种状态： 活动状态：可以对该层进行各种操作。 隐藏状态：即在编辑时是看不见的， 锁定状态：被锁定的图层无法进行任何操 作。

10、外框模式：处于外框模式的层，其上的所有 图形只能显示轮廓。场景场景犹如一个舞台，所有的演员与所有的情 节，都在这个舞台上进行。舞台由大小、音响、 灯光等条件组成，场景也有大小、色彩等的设置。对场景的主要操作 :（1）添加一个新场景 , 有两种方法；（2）清除某个场景：也有两种方法；（3）为场景改名。帧和关键帧 在时间轴上，每一个小方格就是一个帧，时 间轴是对帧进行操作的场所。 在默认状态下， 每 隔 5 帧进行数字标示。帧在时间轴上的排列顺序决定了一个动画的 播放顺序， 至于每帧有什么具体内容， 则需在相 应的帧的工作区域内进行制作 。动画播放的内 容即帧的内容 。在 Flash 制作中， 不

11、必将所有动作制作出来， 只需制定起始和结束这两个关键帧。两个关键帧之间的部分就是过渡帧 ，是起始 关键帧动作向结束关键帧动作变化的过渡部分。 这部分的延续时间越长，整个动作变化越流畅， 动作前后的联系越自然。在一个关键帧里，什么对象也没有，就称为 空白关键帧。特别是那些要进行动作（ Action ） 调用的场合，常常是需要空白关键帧的支持的。Flash 的基本操作（1）创建 Flash 文件：在启动 Flash 软件后 就自动创建了一个文件名为 “无标题 -1 ”的 Flash 文件。（2）修改影片 / 文档属性：在创作 Flash 动 画之前， 先要对屏幕的大小， 背景颜色以及播放 速度进行

12、设置。（3）导入对象：执行“文件 / 导入库”菜单 命令，将弹出“导入到库”对话框，选择要导入 的文件 。4）制作动画（5）预览动画：动画创作完毕，执行“控制/ 测试影片” 菜单命令， 或按 Ctrl+Enter 组合键 调试影片 。（6）保存动画：执行“文件 / 保存”菜单命 令，保存格式为 fla, 称为动画源文件。（7）发布动画： Flash MX支持多种格式的输 出，包括 swf 、html 、gif 、exe、jpeg 等 。主 要输出的是 swf 和 html 格式。元件与库元件是 Flash MX中一个很基本的概念，它是 指在 Flash 中所创建的图形、 按钮和影片剪辑 3 种

13、元素，所有的元件都存放在库里 。（1）图形元件。图形元件可以是静止的图片， 也可以是动画 ，但不能被用于添加交互行为。（2）按钮元件。按钮元件可以响应鼠标事件， 有 Up、鼠标经过、 Down和反应区四种状态。影片剪辑元件。影片剪辑元件使用相对 较复杂， 可以看成是一个独立的动画。 当播放主 动画时，影片剪辑元件本身也在循环播放。动画基本类型逐帧动画补间动画引导动画遮罩动画注：该部分内容会在后续的课程中作重点讲 解，第一次课仅作了解。实例制作注：实例操作仅限于最基本的逐帧动画。实例操作网络小广告的制作打开 Flash 软件。选择“文件” / “导入” / “导入到库”， 将需要的两张图片导入进

14、库。选中第 1 帧，从库中拖动一张图片至舞台， 根据图片的大小更改舞台的大小， 然后使图片相 对于舞台居中。选中第 10 帧插入一个空白关键帧， 从库中 拖动另一张图片至舞台。同理，选中第 20 帧插入一个空白关键帧， 放入第一张图片。使用快捷键 Ctrl+Enter 预览动画效果。最后保存文件。（2）走动的小鸡设定宽 400 像素、高 150 像素的淡绿色舞 台。进入创建名为“并立”的图形元件编辑场景， 用椭圆工具、 铅笔工具、 选择工具和颜料桶工具 画一只头朝右两脚并立的小鸡。按下快捷键 Ctrl+L 打开库面板，在元件列 表区选中“并立”元件名，右击，执行“重制” 命令，把新元件命名为“右前”；单击“编辑元 件”按钮，打开名为“ 右前 ” 图形元件的编 辑场景，把小鸡修改成右脚在前的形状。用同样的方法新建一只名为“左前” 的小 鸡图形元件。回到场景 1 ，执行“ 视图 网格显示 网格”命令 。选中图层 1 的第 1 帧，把 “右 前”小鸡元件拖到舞台最左边。在第 3 帧插入空白关键帧，单击“绘图纸 外观”按钮，把 “并立”小鸡元件拖到舞台的 适当部位，让右脚的位置在前一只小鸡的前脚位 置上。在第 5 帧插入空白关键帧，把 “ 左前” 小鸡元件拖到舞台的适当部位， 让后脚的位置在 前一只小鸡的右脚位置上。在第 7 帧插入空白关键帧，把 “并立”小 鸡元件拖