Adobe Animate 入门教程：从零开始做动画
第一部分：准备工作与核心概念
在打开软件之前，我们先了解几个最核心、最基础的概念，这就像学开车前，你得知道方向盘、油门、刹车是干嘛的。
Adobe Animate 是什么？ Adobe Animate 是一款专业的 2D 矢量动画制作软件,它主要用于：
- 制作网页小动画
- 制作游戏角色和场景
- 制作教学动画和演示视频
- 制作卡通片
重要提示： 现在的官方软件名称是 Adobe Animate，但很多人还习惯叫它 "Flash"，它们本质上是同一个软件，Animate 是 Flash 的升级版，我们接下来的教程都以 Animate 为准。
核心概念：时间轴 这是 Animate 的 灵魂！你可以把时间轴想象成电影的剧本或音乐的乐谱。
- 帧： 时间轴上的每一个小格子代表一帧,就是动画的一张静态画面。
- 播放头： 那个红色的竖线,指示当前正在查看的是哪一帧。
- 图层： 就像 Photoshop 里的图层一样，可以把不同的元素（比如背景、角色、文字）放在不同的图层上，互不干扰,方便管理。
核心概念：舞台与工作区
- 舞台： 你能看到的白色矩形区域。最终发布的动画，只有舞台里面的内容会被观众看到。
- 工作区： 舞台周围的灰色区域，这里是你的“后台”,可以在这里放置和准备即将进入舞台的元素。
核心概念：元件 元件是 Animate 中可以重复使用的“积木”，把它放在舞台上，就叫做“实例”，修改元件，舞台上所有对应的实例都会跟着改变,这非常高效！
- 图形： 最简单的元件,通常用于静态图片或与时间轴同步的简单动画。
- 按钮： 用于制作交互式按钮，有“弹起”、“指针经过”、“按下”、“点击”四个状态。
- 影片剪辑： 最强大的元件，它本身就是一个拥有独立时间轴的小动画,可以把一个复杂的角色做成一个影片剪辑元件。
第二部分：你的第一个动画——“小球弹跳”
让我们打开 Adobe Animate，亲手做一个最经典的动画：一个小球从上到下弹跳。
步骤 1：新建文档
- 打开 Adobe Animate。
- 在欢迎界面，选择 “新建”。
- 在弹出的窗口中，选择 “ActionScript 3.0 文档”（对于初学者，这个选项最通用）。
- 在右侧的属性面板中，可以设置舞台的 尺寸 和 帧率，我们先保持默认值（550x400 像素，24fps）。
- 点击 “确定”。
步骤 2：绘制小球
- 在左侧的 工具栏 中，选择 “椭圆工具” (一个圆形图标)。
- 在下方的 属性 面板中，设置一个你喜欢的 填充颜色（比如红色），笔触颜色 选择“无”（点掉那个小铅笔图标）。
- 在 舞台 上按住
Shift键,拖动鼠标画一个完美的圆形。
步骤 3：将小球转换为“图形”元件
- 用 “选择工具” (黑色箭头) 点击选中你画好的小球。
- 按下快捷键
F8。 - 在弹出的窗口中，选择 “图形” 作为类型，给元件起个名字，"ball"，然后点击 “确定”。
- 为什么转成元件？ 因为元件可以方便地做动画，并且可以重复使用,优化文件大小。
步骤 4：制作补间动画 这是 Animate 动画的核心技术——补间动画，你只需要定义好开始和结束的两个关键画面,软件会自动生成中间的过渡帧。
-
设置起始位置：
- 在 时间轴 上，点击 第 1 帧。
- 确保你的小球在舞台的 顶部。
- 在时间轴上，第 1 帧会变成一个 黑色实心圆点，这代表一个 关键帧。
-
设置结束位置：
- 在时间轴上，找到 第 24 帧（按一下
F5可以插入普通帧，但我们直接按F6）。 - 按下
F6，在第 24 帧插入一个 关键帧，你会看到第 24 帧也出现了一个黑色实心圆点,并且舞台上出现了一个小球的副本。 - 用 选择工具，将第 24 帧的那个小球拖到舞台的 底部。
- 在时间轴上，找到 第 24 帧（按一下
-
创建补间：
- 点击选中 第 1 帧到第 24 帧之间的任意一帧（比如第 12 帧）。
- 在 属性 面板中，找到 “补间” 选项。
- 在下拉菜单中，选择 “动画” (Classic Motion Tween 也可以，但新的“动画”更强大)。
- 你会看到，第 1 帧到第 24 帧之间出现了一条带箭头的实线,这代表补间动画创建成功！
步骤 5：测试动画
- 按下键盘上的
Ctrl + Enter(Windows) 或Cmd + Enter(Mac)。 - 一个新的播放窗口会弹出,你会看到小球从上到下平滑地落了下来。
恭喜你！你已经完成了你的第一个 Animate 动画！
第三部分：让动画更真实——“缓动”
你会发现，现在的小球下落是匀速的，看起来很假，现实中，物体下落是越来越快的，我们可以用 “缓动” 功能来模拟这种物理效果。
-
回到编辑界面,关闭弹出的播放窗口。
-
在时间轴上，再次点击选中 第 1 帧到第 24 帧之间的任意一帧。
-
在下方的 属性 面板中，找到 “缓动” 选项（通常是一个滑块，旁边写着 "0"）。
-
将滑块向 右拖动，你会看到数值变成正数（100）。
- 正缓动： 动画开始快，结束慢，非常适合模拟小球下落（加速）。
- 负缓动： 动画开始慢，结束快，非常适合模拟小球弹起（减速）。
-
再次按
Ctrl + Enter测试,你会发现小球的下落过程变得自然多了！
第四部分：制作一个简单的按钮
动画不只是动的画面，还可以有交互,我们来做一个简单的按钮。
步骤 1：新建图层
- 在时间轴的左下角，点击 “新建图层” 按钮，你会得到一个名为 “图层 2” 的新图层。
- 为什么新建图层？ 为了把按钮和动画分开,方便管理。
步骤 2：绘制按钮
- 确保你选中了 “图层 2”。
- 使用 “矩形工具” 和 “文本工具”，在舞台上画一个矩形，并写上文字“点击我”。
步骤 3：将按钮转换为“按钮”元件
- 选中你画好的整个按钮（矩形+文字）。
- 按下
F8，在弹出的窗口中选择 “按钮” 类型，命名为 "myButton"，然后点击“确定”。
步骤 4：制作按钮的交互效果
- 在 库 面板（如果没看到，按
Ctrl+L打开）中，找到 "myButton" 元件，双击它进入 “按钮元件的编辑模式”。 - 你会看到时间轴有 “弹起”、“指针经过”、“按下”、“点击” 四个帧。
- 弹起： 按钮的默认状态,我们画好的矩形和文字就在这里。
- 指针经过： 当鼠标移到按钮上时的状态。
- 按下： 当鼠标在按钮上按下时的状态。
- 点击： 这是按钮的响应区域,可以设置一个看不见的热区。
- 点击 “指针经过” 帧，按下
F6插入一个关键帧。 - 在舞台上，将按钮的颜色或文字改变一下（比如把文字改成“别走！”）,这样当鼠标移上去时就会有视觉反馈。
- 同样，点击 “按下” 帧，按下
F6，再做一个改变（比如把按钮放大一点）。 - 点击时间轴左上角的 “场景 1”,回到主场景。
步骤 5：测试按钮
- 按
Ctrl + Enter测试。 - 将鼠标移动到舞台上你制作的按钮上，你会发现它会根据你设置的状态改变外观，恭喜,你做出了一个交互式按钮！
第五部分：总结与下一步
你已经掌握了 Animate 的最核心知识：
- 时间轴、帧、图层
- 舞台与工作区
- 元件（图形、按钮）
- 补间动画
- 缓动
接下来可以学习什么？
- 制作更复杂的补间： 尝试让小球不仅下落，还能水平移动、旋转或改变大小。
- 使用影片剪辑： 尝试把弹跳的小球做成一个影片剪辑元件，然后把它放到主场景里,让它在舞台上飘来飘去。
- 使用骨骼工具： 制作简单的角色骨骼动画,比如让一个火柴人走路。
- 学习 ActionScript (AS3)： 这是 Animate 的编程语言，可以让你制作更复杂的交互，比如点击按钮后播放一段动画,或者制作一个小游戏。
学习资源推荐：
- 官方教程： Adobe 官网有大量高质量的视频教程。
- Bilibili / YouTube： 搜索 “Adobe Animate 教程” 或 “Flash 教程”，有海量的免费视频资源,从入门到精通应有尽有。
- 练习！练习！再练习！ 动画是实践性很强的技能，多模仿，多创作,你的进步会非常快。
祝你学习愉快,早日成为动画大师！
