AE 的 Animation Composer 描边动效玩法 + 极简 MG 制作流程(含示例)

Composer 本身没有"描边动效"这个功能模块------所有描边动画都是靠路径关键帧 + 透明度/缩放/位移组合模拟出来的视觉效果,不是调用 stroke-dasharray 或 SVG 动画。

为什么不能直接做描边进度动画

Composer 不解析 SVG 路径的 stroke-dasharraystroke-dashoffset,也不支持 CSS 或 AE 风格的描边绘制控制。你导入的任何矢量线条(比如从 Illustrator 导入的 .ai 路径),在 Composer 里都降级为静态几何体或光栅图层,无法绑定描边长度参数。

常见错误现象:描边突然整条闪现线条末端跳变拉伸时粗细不均。根本原因是试图对标注或自由形状直接加缩放关键帧,而没拆解端点运动逻辑。

  • 标注(Annotation)对象只记录起点/终点坐标,不记录路径段数或曲率,插值是线性的,无法模拟手绘节奏
  • 导入的 SVG 路径会被转成贝塞尔样条,但 Composer 不暴露控制点动画接口,只能整体移动或隐藏
  • 所谓"描边动效",实际是用路径(Path)+ 关键帧拖动终点,再配合 Opacity 从 0→100% 模拟"浮现感"

用 Path 节点实现可控描边延伸

这是目前最稳定、可微调的方案:用 Path 替代标注,手动控制顶点位置与可见性。

  • 插入 Path → 用三点画一条带箭头的折线(起点锚定特征点,终点悬空)
  • 在 0s 帧,选中终点 → 右键 设置位置关键帧;此时终点和起点重合,线条不可见
  • 拖到 1.5s,把终点拖到目标位置(如从电机中心拉到接线端子),再打一次关键帧
  • 给整个 PathOpacity 关键帧:0s=0%,0.3s=0%,0.8s=100%,避免"瞬显"
  • 若需强调起笔/收笔,删掉中间控制点,只留起点+终点;再在 0.2s 处给起点加轻微 Scale 缩放(110%→100%)模拟按压感

极简 MG 风格怎么落地

MG(Motion Graphics)强调节奏、留白、信息密度。Composer 做不出 After Effects 那种粒子描边,但能靠克制的节点组合达成近似观感:

  • 颜色必须极简:主色 ≤ 3 种,描边统一用 #2563EB(蓝)或 #DC2626(红),禁用渐变描边
  • 路径宽度固定为 2px,导出前统一检查所有 Path 的线宽属性,别混用 1.5 / 2.5 / 3
  • 所有动效持续时间卡在 0.8--1.4s 区间,超 1.6s 就显拖沓;用贝塞尔插值,禁用线性
  • 文字标签不随描边同步出现------等线条完全拉出后,再延时 0.2sText 节点 Opacity 从 0→100%
  • 避免多层描边叠加:一个部件只配一条指引线,多余线条用 Composite 调低不透明度(70%)作辅助参考线

常用预设清单(直接套用)

描边类

  • Grow / Write On:生长 / 手写
  • Pulse / Flicker:呼吸 / 闪烁
  • Offset Flow:流动偏移
  • Dash Move:虚线跑动

极简 MG 常用

  • Scale → Bounce In:弹跳入场
  • Position → Slide In(Left/Right/Up/Down) :滑动入场
  • Opacity → Fade In/Out:淡入淡出
  • Rotate → Spin:旋转
相关推荐
北京盛世宏博10 小时前
物联网传感器通信协议:帧字段规划、CRC 校验、异常包过滤方案
网络·物联网·php
三84410 小时前
PHP Session 反序列化:防御加固、审计套路与总结
web安全·php·安全加固·session反序列化
中科三方11 小时前
DNS拨测到底在拨测什么?
开发语言·github·php·dns·云拨测
企业通信技术笔记11 小时前
企业IM内外网隔离部署:DNS、证书、WebSocket与跨网接口设计
websocket·网络协议·架构·php·信息与通信
szarron12 小时前
RF Demo Kit|NanoVNA 射频演示测试板完整上手教程,滤波器、衰减器、SOLT 校准学习板
开发语言·人工智能·学习·php·射频工程·频谱仪
sbjdhjd15 小时前
从 assert 动态调用报错到临时文件链路:PHP 5.6 与 7.3 授权靶场中的短 payload 复盘 | (17字符绕过)
安全·网络安全·数据挖掘·开源·云计算·php·字符绕过
sbjdhjd15 小时前
从 7 字符文件名拼接到二维数组取值:PHP 无参函数限制下的受控靶场复盘 | (7字符绕过)
网络·nginx·安全·网络安全·云计算·php·apache
fengkai454516 小时前
七、华为云网络综合实验 & 运维类及其他服务总结
服务器·开发语言·php
PHP实战开发录16 小时前
PHP日志写满磁盘后接口为什么异常
开发语言·系统架构·php·开发