补间动画的制作.ppt

补间动画的制作 内容概要 FlashCS4中的动画类型创建传统补间动画创建补间形状动画创建引导层动画创建遮罩层动画 什么是形状补间动画 形状补间动画是指在两个或两个以上的关键帧之间对形状进行补间 从而创建出一个形状随着时间的改变而变成另一个形状的动画效果 在一个关键帧中绘制一种形状的物体 然后在另一个关键帧中更改该物体的形状或绘制另一种形状的物体 Flash可在二者之间的各帧中自动创建形状逐渐变化的过渡帧 最后生成完整的动画 形状补间动画可以实现两个图形之间颜色 形状 大小和位置的过渡 形状补间动画创建完成后 时间轴中对应帧的背景色变为淡绿色 在起始帧和结束帧之间有一个箭头 制作形状补间的条件 形状补间动画的变形对象必须是矢量图 在Flash中绘制的图形都是矢量图 导入的图形均以位图形式出现 如果想要在组合体 实例或位图图像上应用形状补间动画 必须先将这些元素 分离 即打散 要对文本应用形状补间动画 如果是多个文字 则必须 分离 文本两次 将文本先转换成单个文字 再转换为矢量图形 2 创建形状补间动画同一图层上 在绘制着不同矢量图形的两关键帧之间任选1帧 然后再在 属性 面板上的 补间 下拉列表框中选择 形状 选项 如图5 2所示 这样就可以创建一个形状补间动画 图5 1形状补间动画 图5 2选择形状补间 如果两关键帧之中的任何一个关键帧的内容不符合创建形状补间的要求或内容为空 将使创建形状补间动画失败 如图5 3所示 图5 2形状补间动画创建失败 2 形状提示原理继续添加形状提示点 并调节提示点位置 此时图形变化的过程如图5 14所示 图5 14使用形状提示 如图5 15所示 为未添加形状提示点的变化过程 经过观察可以清楚地了解形状提示的功能和原理 即形状提示点用于识别起始形状和结束形状中相对应的点 并用字母a到z来表示 图5 15未使用形状提示 添加形状提示点的过程中应该注意以下几点 1 增加控制点只能在补间动画的开始帧进行 2 控制点用字母表示 最多只有26个 3 控制点最好从矢量图形的左上角开始 按逆时针顺序放置 4 控制点的顺序要符合逻辑 例如 在开始帧的一条直线上按a b c顺序放置3个控制点 在结束帧的相应帧的直线就不能按a c b顺序放置 5 控制点并非设置得越多越好 应该根据实际情况来设置 什么都能变 各种对象的简单变形 制作组合到文字的形状补间动画 什么都能变 各种对象的简单变形 制作文字到图形的形状补间变形 光电时代 定位变形 新建动画文档将素材导入到库 制作定位变形 修改 形状 添加形状提示符 开始时位置结束时位置 光电时代 定位变形 绘图纸外观的形变过程 光电时代 定位变形 添加形状提示的图片重新排列形状提示的图片 光电时代 定位变形 绘画纸外观的形变过程 创建传统补间动画 传统补间动画 又叫做动作补间 中间帧动画 渐变动画 只要建立起始帧和结束帧的画面 中间的部分由Flash自动生成 省去了中间动画制作的复杂过程 是Flash中最常用的动画效果 它所处理的动画对象是舞台中组合后的矢量图形 字符 引入的元件实例以及其他导入的素材对象等 被打散的对象不能产生动作渐变 可制作的动画效果有位置移动 大小变化 旋转移动 逐渐消失等等 产生淡入淡出效果和动态切换画面 还能将它们相互组合制作出式样更加丰富 效果更加吸引人的复杂动画 传统补间动画一般制作流程 一般制作流程 先在一个关键帧中定义实例的大小 颜色 位置 透明度等参数 然后创建出另一个关键帧并修改这些参数 最后创建补间动画 让Flash自动生成过渡状态 两个必要前提 起始关键帧与结束关键帧缺一不可 应用于传统补间的对象必须具有元件或者群组的属性 传统补间动画创建完成后 时间轴中对应帧的背景色变为淡紫色 在起始帧和结束帧之间有一个箭头 动作补间动画 1 动作补间动画的原理动作补间动画是指在两个或两个以上的关键帧之间对元件进行补间的动画 使一个元件随着时间的改变而变其颜色 位置和进行旋转 如图5 49所示 动作补间动画只能对元件进行补间 如果对非元件的对象进行动作补间动画时 软件将自动将其转化为元件 图5 49动作补间动画的原理 2 创建动作补间动画在包含着同一元件两种不同属性的两关键帧之间任选1帧 然后再在 属性 面板上 补间 下拉列表框中选择 动作 选项 或直接在该帧上单击鼠标右键 在弹出的快捷菜单中选择 创建补间动画 命令 如图5 50所示就可创建动作补间动画 如果两关键帧之中的任何一个关键帧的内容为空 创建动作补间动画将失败 如图5 51所示 图5 50右键快捷菜单 图5 51创建失败 传统补间属性 缓动 应用于有速度变化的动画效果 100 100之间的值 0值以上是由快到慢 0值以下是由慢到快 旋转 设置对象的旋转效果 包括 自动 顺时针 逆时针 和 无 4项 紧贴 使物体可以附着在引导线上 同步 设置元件动画的同步性 调整到路径 在路径动画效果中 使对象能够沿着引导线的路径移动 缩放 应用于有大小变化的动画效果 补间动画 补间动画是FlashCS4在原来的基础上新增加的动画功能 它通过为一个帧中的对象属性指定一个值并为另一个帧中的该相同属性指定另一个值来生成动画 如果要创建传统补间动画或者补间形状动画就一定要有关键帧 在关键帧中对象或对象的属性发生变化就形成了动画效果 形状补间动画与动作补间的区别 形状补间可以实现将一幅图形变为另一幅图形的效果 形状补间和动作补间的主要区别 形状补间不能应用到实例上 必须是被打散的形状图形之间才能产生形状补间 形状图形 由无数像素点堆积而成的 并非是一个整体 选中时没有一个蓝色边框 而是显示为掺杂着白点的图形 形状补间的属性 缓动 动画朝着结束方向变化的速率 100 100之间的值 0值以上是减速 0值以下是加速 混合 分布式 创建的动画形状比较平滑和不规则 角形 创建的动画形状会保留明显的角和直线 只适合于具有锐化转角和直线的混合形状 如果所选形状没有角 系统自动还原到 分布式 补间 传统动作补间与动作补间动画的区别 传统动作补间需要先在开始帧和结束帧中放入同一动画帧对象 才能执行插入传统补间的命令 而动作补间动画则只需要在开始帧中放入动画对象 并定义结束帧 即插入空白关键帧 即可选择插入补间动画的命令 且在补间动画中还可控制对象的动作路径 动作补间动画创建完成后 时间轴中对应帧的背景色变为淡蓝色 在起始帧和结束帧之间没有箭头 FlashCS4中的动画类型 2 补间形状在形状补间中 可在时间轴中的特定帧绘制一个形状 然后更改该形状或在另一个特定帧绘制另一个形状 然后 Flash将内插中间的帧的中间形状 创建一个形状变形为另一个形状的动画 反向运动姿势 骨骼 反向运动姿势用于伸展和弯曲形状对象以及链接元件实例组 使它们以自然方式一起移动 可以在不同帧中以不同方式放置形状对象或链接的实例 Flash将在中间内插帧中的位置 实例 火焰的跳动效果铅笔画直线效果 火焰的跳动效果 选择圆形工具 画一个竖长的椭圆 选用油漆桶工具 打开调色板 选择线性渐变 调出桔红色到黄色的渐变 点击新建在椭圆上涂色 删掉线条按住Ctrl的同时 点住椭圆顶部的一点向上拖 可以拉出一个尖点 调整形状如在第20帧上按F6 加入一个关键帧 调整火焰的形状如图 1 20帧之间的任意一帧上单击 选择Modify 修改 frame 帧数 打开frame 帧数 对话框 在tweening 变化 右边的小三角上点击 在下拉菜单中选择shape 形状 点击舞台的空白处 在第一帧上点右键 选择copyframes 复制帧 在第40帧上点右键 选择pasteframes 粘贴帧 在第20 40帧之间的任意一帧单击 选择Modify 修改 frame 帧数 打开frame 帧数 对话框 在tweening 变化 右边的小三角上点击 在下拉菜单中选择shape 形状 点击舞台的空白处 完成 选择Control 控制 TestMovie 测试影片 观看动画 铅笔画直线效果 画一条很短的直线 在第30帧按F6加入关键帧选用scal 缩放 工具 把鼠标放在直一右边的控制点上 把直线拉长 如图在1 30帧间的任意一帧单击 选择Modify 修改 frame 帧数 打开frame 帧数 对话框 在tweening 变化 右边的小三角上点击 在下拉菜单中选择shape 形状 点击舞台的空白处 新增一层 在新加层的第一帧画一个铅笔 位置放在小短线的上方 如图在新增层的第30帧按F6 加关键帧 把铅笔入到长线的右端 在新层的1 30之间任意一帧单击 选择Modify 修改 frame 帧数 打开frame 帧数 对话框 在tweening 变化 右边的小三角上点击 在下拉菜单中选择shape 形状 点击舞台的空白处 如图完成 Control 控制 testmovie 测试影片 观看动画 引导层动画 使用运动引导层可以创建特定路径的部件动画效果 实例 组或文本块均可沿着这些路径运动 两种引导层普通引导层 只起到辅助静态对象定位的作用 影片放映时不可见 无需使用被引导层 可单独使用 与普通图层的属性相似 图层面板中 右键快捷菜单 引导层 运动引导层 总是与至少一个图层相关联 如果需要可以与任意多个图层相关联 这些被关联的图层称为被引导层 图层面板中 右键快捷菜单 添加传统运动引导层 通过拖拽可增加或减少被引导图层 路径动画指对象 包括元件的实例 组合的图形和静态文本 沿路径进行运动变化 路径动画是运动渐变的一种特殊应用 只要在运动渐变的图层上新增了一个特殊层 引导层 并在引导层中绘制引导路径 补间实例或文本块就可以沿着路径运动了 多个图层可以链接到一个引导层 使多个对象沿同一条路径运动 在Flash中 引导层中的曲线可以封闭 但是如果要制作环绕运动的动画通常并不使用封闭的曲线 而是在封闭曲线上打开一个小缺口 使曲线产生两个端点 然后再制作路径动画 引导层动画 制作实例 激光写字雨滴 遮罩动画 遮罩层中的任何填充区域都是完全透明的 而任何非填充区域都是不透明的 在遮罩层上绘制的图形或输入的文字 相当于在遮罩层上挖掉了相应形状的洞 形成挖空区域 通过挖空区域 显示下面图层中的内容 而遮罩层中没有绘制图形或输入文字的地方就成了遮挡物 把下面图层的内容完全掩盖起来 遮罩层中的内容可以包括图形 文字 实例 影片剪辑在内的各种对象 但Flash会忽略遮罩层中内容的具体细节 只关心它们占据的位置 在遮罩层中绘制各种图形或输入文字时可以不必考虑颜色 每个遮罩层可以有多个被遮罩层 这样可以将多个图层组织在一个遮罩层之下创建非常复杂的遮罩效果 两大类遮罩动画 遮罩层运动 被遮罩对象运动 遮罩层动画实例一 聚光灯效果将舞台背景设置成黑色遮罩层 来回滚动的小球被遮罩层 在舞台上要显示出来的文字类似效果 打字效果 花样年华 滚动字幕效果 遮罩层动画实例二 制作地球仪遮罩层 圆形元件被遮罩层 地图水平移动制作卷轴效果制作卷轴两端的手柄 进行水平方向的位置移动 将手柄做成元件 遮罩层 矩形由小到大的变化被遮罩层 最终显示的文字 遮罩层动画实例三 制作放大镜制作小字遮罩层 挖空小字的矩形条进行水平移动被遮罩层 小字制作大字遮罩层 显示大字的圆形进行水平移动被遮罩层 大字制作放大镜 制作一个和大字遮罩层中的圆相同大小的放大镜 利用遮罩做的简单特效 1 创建影片剪辑元件 名为 曲线动画 把图层名称更改为 曲线 画一条曲线 笔触高度为2 颜色任意 选中曲线 修改 形状 将线条转换为填充 将线条转换为填充 2 在该元件中创建新图层 名称为 矩形 把该图层放在 曲线 图层的下方 画一个矩形 从左到右渐变 中间白色透明度为100 两边白色透明度为0 把矩形放到曲线的右边 3 在 矩形 图层的第10帧处插入关键帧 把矩形放到曲线的左边 并创建形状补间动画 4 在 矩形 图层的第25帧和40帧处插入关键帧 并创建补间动画 把40帧处的矩形透明度都设为0并将宽度变小 5 把 曲线 图层上的帧延长到第40帧处 选中图层 右键选择 遮罩层 6 从库中把 曲线动画 元件拖入到主场景中的合适位置 将中心点 小白圆 往右拖离一定矩离 打开 窗口 变形 在 旋转 中输入30 点击下面的 复制并运用变形 按钮 连按11次 制作流动的动画 新建一flash文档 550 x400 导入几张图片 将一张图片拉到舞台上 设置图片宽为1100 高为400 打对齐面板相对于舞台右对齐 第50帧插入关键帧 点击图片 打开对齐面板相对于舞台左对齐 建立传统补间动画 新插入一层 画一无笔触任一色矩形 大小为550 x400 居中对齐 第50帧插入帧 右击该层 设为遮罩层 新插入一层 将同一图片从库中拖出 打开对齐面板 宽 高匹配 即550 x400 居中对齐 第50帧插入帧 新插入一层画一无笔触任一色的矩形 大小为550 x400 居中对齐 用变形工具将注册点移到右边中间 在第50帧插入关键帧 回到第1帧 将矩形宽度缩小到5像素 建立补间动画 设为遮罩层 这样流动的图片效果就做成了 制作流动的动画 你可以在新的一层第51帧 插入空白关键帧 将第2张图拖入 这一次图片的宽度为550 而高度为800 在第100帧插入关键帧 第1帧相对舞台上对齐 第100帧下对齐 建立补间 新插入一层 画一无笔触任一色矩形 大小为550 x400 居中对齐 第100帧插入帧 右击该层 设为遮罩层 第三层第51帧插入空白关键帧 将相同图片拖入 大小匹配 居中对齐第四层第51帧插入空白关键帧 画一无笔触任一色的矩形 大小为550 x400 居中对齐 用变形工具将注册点移到上边中间 在第50帧插入关键帧 回到第1帧 将矩形高度缩小到5像素 建立补间动画 设为遮罩层 在第101帧做第三张图片 做法同上面两张图片 只是注意一点 第一层图片的运动方向跟第4层的遮罩运动方向刚好相反 创建反向运动 反向运动 IK 是一种使用骨骼的有关节结构对一个对象或彼此相关的一组对象进行动画处理的方法 使用骨骼 元件实例和形状对象可以按复杂而自然的方式移动 只需做很少的设计工作 例如 通过反向运动可以更加轻松地创建人物动画 如胳膊 腿和面部