Adobe Animate CC 全方位教程
Animate 是 Adobe 旗下的一款强大的 2D 矢量动画软件，它完美继承了 Flash 的衣钵，并融入了更多现代功能，是制作网页动画、游戏、应用程序和交互式内容的首选工具之一。
（图片来源网络，侵删）
第一部分：基础入门篇 (适合零基础)
1 认识界面
启动 Animate 后，你会看到一个由多个面板组成的窗口，熟悉这些面板是高效工作的第一步。
- 舞台: 这是你的“画布”，所有最终会显示在观众面前的元素都在这里，你可以通过
Ctrl + +/-(Windows) 或Cmd + +/-(Mac) 来缩放舞台视图。 - 时间轴: 这是动画的“灵魂”，它决定了元素在不同时间点出现、移动、变化和消失的顺序，时间轴由图层和帧组成。
- 工具栏: 位于左侧，包含了所有用于创建和编辑图形的绘图工具，如选择工具、钢笔工具、画笔、矩形、椭圆等。
- 属性检查器: 位于右侧，当你选中舞台上的某个元素（图形、实例、文本等）时，这里会显示并允许你修改该元素的属性，如位置、大小、颜色、滤镜等。
- 库: 位于右侧，是一个“资源仓库”，你在这里导入的图片、声音、符号等都会存放，方便重复使用和管理。
2 核心概念
-
帧:
- 关键帧: 动画发生变化的点，一个物体从左边移动到右边，那么它在左边和右边的位置就是两个关键帧。
- 普通帧: 延续前一帧的状态，用于显示动画的持续过程。
- 空白关键帧: 一个全新的、没有任何内容的关键帧。
-
图层:
就像 Photoshop 里的图层一样，用于将不同的元素（如背景、角色、UI）分开管理，避免互相干扰，方便修改。
（图片来源网络，侵删） -
符号:
- 这是 Animate 最重要的概念之一，符号是可以在文档中重复使用的“可重用对象”。
- 图形: 最简单的符号，通常用于制作动画片段（如一个角色走路的循环）。
- 按钮: 用于创建交互式元素，包含四个关键帧：弹起、指针经过、按下、点击。
- 影片剪辑: 功能最强大的符号，可以包含自己的独立时间轴，可以看作是“动画中的动画”。
3 第一个动画：制作一个弹跳的小球
这是所有动画软件的经典入门案例。
- 绘制小球: 在工具栏选择“椭圆工具”，按住
Shift键在舞台上画一个正圆，在属性检查器中填充颜色，去掉边框。 - 创建关键帧:
- 在时间轴上,选中第1帧（它自动成为关键帧）。
- 将小球拖到舞台的顶部。
- 在时间轴上点击第20帧,按
F6插入一个关键帧，第1到第20帧之间会有一条灰色箭头，表示两个关键帧之间有内容。
- 创建补间动画:
- 选中第1帧到第19帧之间的任意一帧。
- 在右键菜单中选择 “创建传统补间”。
- 现在你拖动第1帧的小球,会发现第20帧的小球也会跟着移动，Animate 自动生成了小球从顶部落下的动画。
- 制作弹跳效果:
- 在第20帧,将小球拖到舞台底部。
- 选中第20帧,在属性检查器中，找到“旋转”选项，选择“自动”。
- 选中第10帧,按
F6插入关键帧，将小球向上移动一点，模拟压缩和回弹。 - 选中第1帧到第9帧,创建传统补间；选中第11帧到第19帧，创建传统补间。
- 测试动画: 按
Ctrl + Enter(Windows) 或Cmd + Enter(Mac) 来预览你的第一个动画！
第二部分：进阶技巧篇
1 形状补间
与“传统补间”作用于“符号”不同，“形状补间”作用于“矢量图形”。
- 用途: 制作图形的变形动画，如一个圆形变成一个方形，或者文字变成图形。
- 方法:
- 在第1帧画一个圆形,并按
F6在第20帧插入关键帧。 - 删除第20帧的圆形,画一个方形。
- 选中两个关键帧之间的所有帧（不包括关键帧本身）。
- 在右键菜单中选择 “创建形状补间”。
- 提示: 如果变形效果不理想，可以在中间插入“形状提示”（
Ctrl + Shift + H），来指定哪些点应该对应变形到哪些点。
- 在第1帧画一个圆形,并按
2 遮罩动画
遮罩可以让你只看到特定区域内的内容,常用于文字显示、聚光灯效果等。
（图片来源网络，侵删）
- 原理: 遮罩层上的“填充区域”会变成一个“窗口”，显示其下方被遮罩层的内容。
- 方法:
- 准备两层：一层是被遮罩层（比如一张风景图），另一层是遮罩层（比如一个文字）。
- 确保文字图层在风景图图层的上方。
- 在文字图层上右键,选择 “遮罩层”。
- 只有文字区域内的风景图才会显示。
- 如果想让文字“擦除”风景图，可以给被遮罩层（风景图）做传统补间动画。
3 骨骼绑定
这是制作复杂角色动画的利器,可以让你像操控木偶一样操控角色。
- 用途: 制作角色行走、奔跑、对话等流畅自然的动画。
- 方法:
- 绘制一个角色,并将其转换为“图形”符号。
- 选中角色符号,点击顶部菜单栏的 “骨骼工具”。
- 在角色的关节处（如肩膀、手肘、手腕）点击并拖动，创建骨骼链。
- 创建骨骼后,Anima会自动进入“姿势模式”，你只需要在不同时间点移动角色的四肢，Animate会自动计算中间的过渡动画，这就是“反向动力学”的威力。
4 创建交互式按钮
-
创建按钮符号: 按
Ctrl + F8(Windows) 或Cmd + F8(Mac)，选择“按钮”类型。 -
编辑四个状态:
- 弹起: 按钮的默认外观。
- 指针经过: 鼠标悬停时的外观（可以改变颜色或添加滤镜）。
- 按下: 鼠标点击时的外观（可以向下移动一点）。
- 点击: 这是按钮的“热区”，可以设置一个比按钮本身大的区域，方便点击。
-
添加代码: 选中舞台上的按钮实例，打开“动作”面板（
F9），输入以下代码来测试：myButton.addEventListener(MouseEvent.CLICK, onClick); function onClick(event:MouseEvent):void { trace("按钮被点击了！"); // 这里可以添加跳转网页、播放声音等操作 }
第三部分：导出与发布
动画完成后,你需要将其导出为适合不同平台的格式。
- 文件 -> 发布设置:
- HTML 5: 这是最现代的发布方式，可以将动画发布为网页，并支持 Canvas 和 WebGL 渲染，适合制作网页游戏和交互式内容。
- SWF: 这是传统的 Flash 格式，适用于需要旧版 Flash Player 的环境。注意： 现在大多数浏览器已默认禁用 Flash Player。
- 视频: 可以导出为
.mp4、.mov等格式，方便上传到视频网站（如 YouTube、Bilibili）。 - GIF: 适合制作简单的动图。
- PNG 序列: 将动画的每一帧导出为一张静态图片，方便导入到 Premiere Pro 或 After Effects 中进行后期合成。
第四部分：学习资源推荐
1 官方资源
- Adobe Animate 官方教程: Adobe 官网提供了大量高质量的入门和进阶视频教程，是最权威的学习来源。
2 视频平台
- Bilibili (B站): 国内最好的学习平台之一，有大量免费且优质的中文教程。
- 搜索关键词：
Animate 教程、Animate 入门、Animate 骨骼绑定、Animate 游戏。 - 推荐关注一些专业的动画或游戏 UP 主。
- 搜索关键词：
- YouTube: 国际化的学习平台，教程资源极其丰富。
- 搜索关键词：
Adobe Animate Tutorial,Animate CC for beginners,Animate Rigging。 - 推荐频道：
Brackeys(虽然主攻 Unity，但其动画思路很棒),TheNewBoston,School of Animation。
- 搜索关键词：
3 书籍
- 《Adobe Animate CC 经典教程》：官方出品，内容系统，适合系统性学习。
4 社区与论坛
- Behance: 查看其他艺术家的 Animate 作品，激发灵感。
- Reddit: r/animate 板块，可以提问和分享。
- 国内设计论坛: 如站酷、UI中国等，也有 Animate 相关的讨论和作品。
学习路线建议
- 第一周：熟悉界面和基本操作。 跟着教程，熟练绘制图形、使用图层、理解帧的概念，完成“小球弹跳”等简单动画。
- 第二周：掌握核心动画类型。 深入学习“传统补间”和“形状补间”，并尝试制作遮罩动画。
- 第三周：学习符号和交互。 重点练习按钮的制作和简单的 AS3 代码交互。
- 第四周及以后：挑战高阶技术。 专门攻克“骨骼绑定”，并尝试制作一个简单的 2D 角色或小游戏。
- 持续练习： 找一些你喜欢的作品进行模仿，这是最快进步的方法，然后尝试创作自己的原创作品。
祝你学习愉快,早日成为 Animate 高手！
