跳到主要内容

AE 与 Lottie：制作、导出和运行的边界

依据：微信团队 lottie-miniprogram、Airbnb lottie-web 官方资料。本文讲交付链路；微信真机未验证。

能在 AE 播放，不代表能直接进入游戏​

After Effects 是动画创作和合成工具。Lottie 工作流通过导出工具把受支持的动画描述交给运行库播放；视频或序列帧导出则提前烘焙画面。它们有不同的交互、体积与运行成本，不能把 AE 工程里的所有效果视为 Lottie 格式都能保存的内容。

AE工程可分别输出动画描述、序列帧或视频，运行时要求不同

例如一个由路径、填充和关键帧组成的加载图标，可以先验证描述式导出；复杂模糊、插件效果或表达式驱动的合成，应按所选导出器和播放器的能力逐项试验。交付前选取最难的一秒制作样本，比整段制作完再发现不支持更便宜。

必须问清的四个环节​

环节要回答的问题产物
创作AE 中用到了哪些效果和表达式工程与素材清单
导出导出器支持哪些特性，是否外链图片动画描述及资源
播放采用哪种播放器与渲染后端运行库和加载代码
平台适配目标运行环境提供哪些接口适配代码与验证记录

创作效果、导出格式、播放器及目标平台形成逐层能力交集

微信团队的 lottie-miniprogram 针对小程序 Canvas 2D，需要传入 Canvas 及上下文，README 明确说明不支持 expressions。这一仓库本身不能证明微信小游戏直接具备相同支持。小游戏中要使用 Lottie，仍须确认选用的适配器、运行库、渲染接口及特性覆盖，并在目标环境验证。

交付时保留可检查的样本​

给程序的资料应包括：素材路径、动画尺寸、循环方式、是否自动播放、可控制的进度、停止后的画面、使用的字体与图片。运行时要有销毁路径，页面关闭后停止动画和释放引用。仅说明“这是一个 JSON”无法说明它是否还需要大量外部图片。

常见失败：网页正常，小程序缺了一层​

首先比对渲染器与特性支持，再检查资源路径、字体和表达式。将复杂效果临时替换为简单形状，逐层恢复，可以定位是内容不兼容还是加载失败。如果只是装饰性的固定演出，烘焙为少量序列帧可能更可靠；如果需要根据游戏状态改变构图或部件，考虑引擎动画或骨骼系统。

怎样选​

短小、可缩放、形状型 UI 动画值得验证 Lottie；包含大量摄影素材的长演出更接近视频需求；需要与游戏节点深度交互的 UI 则更适合引擎内制作。比较时同时记录设计修改成本、播放器依赖、素材体积和目标机表现。相关概念见 序列帧与骨骼、资源管理。

官方来源与适用范围​

资料核查日期：2026-10-30。文中的案例参数与图解用于教学；目标项目应按所用版本及平台重新验证。