用途：当设计好的矢量动画需要可靠地迁移到网页、移动端、应用或渲染视频播放器时使用本技能。核心问题是互操作性——在特性支持各异的播放器之间保留预期动效、排版、素材、时序、无障碍与控制能力。需注意 Lottie 不是通用的 After Effects 渲染器，应在动画定稿前先确定目标播放器矩阵，而非导出后才测试。
主要能力：判断是否适合用 Lottie；锁定交付矩阵（源合成、目标播放器与版本、JSON 与 .lottie 交付、文本策略、外部资源、遮罩与效果、响应式与降级、抓帧要求、体积与性能限制、权利归属）；理解交换模型（JSON 根 Animation 对象、关键帧、图层父子关系）；建立特性与播放器的兼容性台账。
必要用法：导入前设定精确尺寸、帧率、工作区与时长，清理无用图层与效果，给图层和标记起稳定语义名，保留参考影片与源稿。排版上可选择字形轮廓（文本固定时）或运行时文本（需本地化时），需打包或预加载字体并测试断行、字形覆盖与本地化。区分 JSON 与 dotLottie：dotLottie 是 Deflate 压缩的 ZIP 包（.lottie 扩展名），v2 中 manifest.json 与 a/ 目录必需，i/、f/、t/、s/ 可放图像、字体、主题与状态机；官方建议新项目用 v2，v1 支持更广。播放方面 lottie-web 支持 play、pause、stop、setSpeed、setDirection、goToAndStop、playSegments 等控制，isFrame 参数用于按帧定位，setSubframe(false) 按源合成帧率。含 repeater 的 animationData 多次加载时应深拷贝。确定性视频抓帧需禁用自动播放并显式定位：lottie.loadAnimation({ container, renderer: "svg", loop: false, autoplay: false, animationData })，待就绪后 animation.setSubframe(false)，再 goToAndStop(frame, true)。
适用场景与限制：适合紧凑可缩放矢量动效、运行时播放与跳转、多播放器复用、响应式缩放与确定性抓帧。实拍、含音频、AE 特性无法存活、离线精确渲染、3D 相机与粒子、简单 CSS/SVG 过渡更易维护时应改用其他格式。官方 lottie-web README 明确不支持视频、音频与图像序列。文本轮廓会丢失语义与可编辑性；表达式有可移植性与确定性风险；遮罩、模板、混合模式、效果的行为可能因渲染器而异。无障碍方面需尊重 prefers-reduced-motion，WCAG 2.2 SC 2.3.1 限制每秒闪烁超过三次，SC 2.3.3 要求非必要交互动效可关闭。lottie-web 为 MIT 许可，但不等于清理了素材、字体、图像与角色权利。资料中未提供具体价格与收费信息。