AE怎么制作圆形波纹加载动画-AE制作圆形波纹加载动画教程

在UI动效设计、短视频运营和新媒体物料制作中，圆形波纹加载动画一直是一个高频需求。许多新手认为在After Effects中制作复杂动效门槛较高，实际上仅使用内置功能，无需第三方插件，十几分钟即可完成一个流畅的商用级效果。下面将拆解具体的制作步骤。

任务目标

使用After Effects制作一个简约自然的圆形波纹循环加载动画，最终输出为带透明背景的视频文件，可用于UI加载、短视频转场、活动海报弹窗等场景。

最终成果

一个4秒循环播放的圆形波纹扩散动画，包含4个依次扩散并消失的正圆，带有缓动效果，导出为QuickTime格式并保留透明通道。

适用软件和版本

After Effects（版本不限，基于内置功能操作）

准备材料

• After Effects软件
• 无需外部素材，全程使用形状工具绘制

新建项目

1. 打开After Effects，新建一个合成。
2. 在合成设置中，将宽度和高度均设置为1080像素，即1080×1080的正方形尺寸，该尺寸适配大多数加载场景的显示需求。
3. 将帧速率设置为30fps。
4. 将时长设置为4秒，以满足循环动画的时长需求。

导入素材

本任务无需外部素材，所有图形元素均在After Effects中直接创建。

核心操作

绘制基础图形

1. 选择形状工具中的椭圆工具。
2. 在工具栏中将形状填充设置为关闭状态。
3. 将描边设置为纯色，粗细为10像素。
4. 按住Shift键，在合成中心绘制一个正圆。绘制完成后，使用对齐工具将正圆对齐到合成中心。
5. 复制该形状图层3次，得到4个大小、样式完全一致的正圆图层。这些图层将作为动画的基础框架。

添加关键帧制作扩散效果

1. 选择最上方第一个正圆图层，展开其变换属性。
2. 在时间轴0秒位置，为缩放属性添加关键帧，数值设置为100%；为不透明度属性添加关键帧，数值设置为100%。
3. 将时间轴移动到1秒位置，将缩放数值调整为220%，不透明度数值调整为0%。此时，软件自动生成第二个关键帧，第一个正圆的扩散消失效果即完成。
4. 为其余三个正圆图层重复相同操作，但需要将每个图层的关键帧组整体依次向后错开0.25秒：
   • 第二个正圆：从0.25秒开始扩散，1.25秒结束。
   • 第三个正圆：从0.5秒开始扩散，1.5秒结束。
   • 第四个正圆：从0.75秒开始扩散，1.75秒结束。
5. 完成关键帧错开后，全选所有图层，右键选择预合成，将预合成命名为圆形波纹。
6. 在时间轴中选中圆形波纹预合成图层，按住Alt键点击时间属性旁边的秒表图标，在表达式编辑器中输入loopout()，即可实现无限循环播放，无需手动复制关键帧。

参数调整

添加缓动效果

1. 全选所有关键帧。
2. 按下键盘上的F9键，为关键帧添加缓动效果，使波纹扩散从匀速运动变为先快后慢的节奏，更符合真实的视觉体验。

增加设计层次感（可选）

• 可以调整四个正圆的描边透明度，从浅到深依次设置，形成渐变层次。
• 可以为每个正圆更换不同的渐变色描边。
• 可以在合成中心添加一个实心小圆作为锚点，并为其添加缩放动画，幅度约为10%，形成呼吸感，使整体质感更灵动。

保存项目

在After Effects中，选择文件 > 保存，将项目文件保存为.aep格式，以便后续修改。

导出设置

1. 选择合成 > 添加到渲染队列。
2. 在渲染队列中，将输出模块设置为QuickTime格式。
3. 在通道选项中，选择RGB+Alpha，确保导出文件包含透明背景，便于开发或设计人员直接使用。
4. 设置输出路径和文件名，点击渲染开始导出。

结果检查

1. 播放导出的视频文件，确认动画以4秒为周期循环播放，且波纹扩散效果流畅无卡顿。
2. 将视频导入到支持透明背景的软件中，确认背景区域为透明，正圆波纹正常显示。

可复用方法

这种制作方法逻辑简单，通过修改正圆的大小、描边颜色、扩散速度，即可适配UI加载、短视频转场、活动海报弹窗等多种场景。核心思路是：使用形状工具绘制基础图形，通过错开关键帧时间形成节奏，利用预合成加循环表达式实现无限循环。这是动效设计师制作简约加载动画的常用方法，新手可以快速上手并灵活调整。