过去在AE中制作动效，再通过Bodymovin导出Lottie文件交付给开发，这条工作流程大家早已驾轻就熟。然而，每次微调细节都意味着重新打开AE、重新导出、重新交付——流程冗长，效率低下。如今，一款名为Text-to-Lottie的工具正在改变这一局面，它让AI（如Codex、Claude）能够直接根据自然语言描述生成Lottie动效，并配备实时预览窗口。

换句话说，你完全不需要编写任何代码，只需像跟同事交代需求一样说句话，AI就能自动生成动效。不满意？继续用语言调整，它再重新生成。整个过程在浏览器里即可完成，甚至无需打开AE。下面直接进入实操环节。

一、字体动效

首先从一个字体的手写动画开始。将Text-to-Lottie项目链接发给Codex，让它帮忙下载环境后，输入以下提示词：

用 Text to Lottie 制作一个 hello 手写字动画：画面中心是一笔连写的 hello，使用粗圆角 stroke，文字从左到右像手写一样逐步绘制出来，绘制过程中带蓝绿到米白的柔和渐变，末尾 o 的收笔有一点轻微弹性 settle。时长 170 帧，60fps，透明背景。暴露 controls：stroke width、opacity、gradient start、gradient end。用 Skottie 验证。

AI接收到指令后开始生成动效文件，并在预览窗口中展示效果。从实际表现来看，文字的描边粗细、透明度、渐变颜色均能实时调整，效果相当细腻。

确认无误后，点击右上角的【Export】，或者直接使用AI生成的交付文件，交给开发嵌入App或网页，也可以再导入AE做进一步精修。

二、LOGO动效

再看一个LOGO动画的示例。将同样的提示词发给Codex，只把文字内容换成品牌名称或标志性字母即可。AI会基于相同的绘制逻辑生成对应的LOGO手写动效。后续如果换成自己的品牌LOGO，只需修改提示词中的文字内容，流程完全复用。

三、上传SVG图标做动效

如果手头有SVG图标——无论是从图标库下载还是设计师自己绘制的——都可以直接上传给AI制作动效。以四个常用图标为例，输入以下提示词：

"用 text-to-lottie 把下面几个 SVG 图标分别做成独立场景，公共设定：透明背景、60fps、每个单独导出 lottie.json。各图标动效如下：

搜索图标（线性）：放大镜手柄沿路径描绘出来，画完后轻微弹一下，ease-out，90帧；
对勾图标（线性）：描边沿笔画方向一笔画出（trim path reveal），保持原描边粗细和圆角，ease-in-out，75帧；
爱心图标（面性）：从中心缩放弹入 + 透明度淡入，带弹性 settle，ease-out，60帧，暴露 fill color 控制项；
铃铛图标（面性）：整体淡入后左右摇摆两下（像响铃），ease-in-out，120帧；

每个图标一个 scene，风格各自独立，但都用统一的透明背景和 60fps。"

等待片刻，AI就会一次性生成四个独立的图标动效。从预览效果看，每个图标的运动曲线与节奏把控都相当到位。

怎么让AI做得更像样？

要想获得更理想的效果，有几个实用技巧：

给它参考素材。把SVG图形、截图直接丢给AI，它理解得更准确。用你熟悉的动效术语。缓入缓出、弹性、拖尾这些专业词汇，AI完全听得懂。像分镜一样描述。推、拉、摇、移、变焦这些镜头语言说出来，AI能模拟出相应的运动感。明确时长和帧率。比如“60帧每秒，总共3秒”，参数越清晰，结果越可控。暴露可调参数。如果希望开发后期能调整颜色、大小、透明度，就在提示词里明确说清楚。

需要注意的是，这套方法在处理常规动效——图标动画、加载动画、揭示动画——时表现非常好，但遇到粒子系统、复杂形变、拟真物理这类效果时，AI更多是打下基础，最终的精细收尾还是需要手动调整。不过话说回来，这类复杂动效本来也不是Lottie的强项，问题不完全在AI这边。