为什么会想用视频代替 Lottie？

常见有三个原因。第一是渲染保真度：视频原样记录你设计的画面，包括模糊、玻璃与金属材质、着色器效果和 3D，这些都不是矢量运行时能复现的。第二是接入成本：MP4 或 WebM 可以直接放进页面、落地页、信息流或提案，不需要运行时库，也不需要开个工程需求。第三是分发：绝大多数社交平台接受视频，没有一个接受 Lottie。

从 Lottie 换成视频会失去什么？

会失去分辨率无关性、运行时控制，以及简单内容上的体积优势。一个双色加载动画的 Lottie 文件会比它的任何视频版本小得多，能无损缩放到任意尺寸，还能被代码暂停、改色或按应用状态驱动。如果你的动画简单、矢量、在产品内部且需要交互，Lottie 仍然是更优的工程选择，换视频反而是降级。

dotLottie 算另一种格式吗？

它是同一家族的演进而不是替代品。dotLottie 是开放的 .lottie 格式，把一个或多个 Lottie 动画连同素材、主题和状态机打包进单个 ZIP 压缩文件。LottieFiles 称它可比原始 Lottie JSON 小最多 10 倍，Web 端基于 WebAssembly 的运行时约 150KB。如果你对 Lottie 的不满在于体积和素材散乱而非渲染保真度，dotLottie 正对症。

现在哪些工具能导出 Lottie？

浏览器工具里，截至 2026 年 9 月，Jitter 在包括免费档在内的全部档位提供 Lottie 导出，SVGator 从 Starter 档起提供 Lottie JSON 导出。KinoViz 不导出 Lottie，它导出 MP4、WebM、PNG 单帧和自有的 .kino 工程文件。Rive 用的是自己的 .riv 运行时格式，不是 Lottie。

不用 Lottie 也能做透明背景吗？

就 KinoViz 而言，目前只能做到静帧透明。它的视频导出（MP4 和 WebM 一样）都会把画布背景烘进每一帧，透明视频导出暂未提供。所以透明叠加素材要么导出一张 PNG 单帧，静态角标或水印正好够用；要么把最终背景直接放进 KinoViz 项目里，让视频本身就已经合成在背景上。如果一定要会动的透明叠加层，Lottie 或 Rive 这类运行时格式仍然是现实路径。

KinoViz

登录打开工作台

Lottie 替代方案：什么时候该改用视频导出

Q: Lottie 到底是什么？

Lottie 是一种基于 JSON 的轻量矢量动画格式，用于在网页、桌面和移动端交付动效，由 Airbnb 开源，在 Web、iOS、Android、Flutter 和 React Native 上由运行时库播放。文件描述的是形状、变换和时间，由运行时实时绘制，所以 Lottie 动画在任意尺寸下都保持锐利，还能被代码改色或控制。

Lottie 替代方案实用指南。什么情况下导出 MP4 或 WebM 比 JSON 运行时动画更合适、会失去什么，以及 2026 年可选的四款制作工具。

2026/09/10

Lottie 是一种基于 JSON 的矢量动画格式，由 Airbnb 开源，在 Web、iOS、Android、Flutter 和 React Native 上由运行时库播放。文件描述形状与时间，运行时实时绘制。所以它在任意尺寸下都锐利，简单内容体积极小，还能被代码暂停、改色或按应用状态驱动。

这是一个很好的格式，对产品内部的矢量动画来说通常仍然是正确答案。大家去找 Lottie 替代方案，理由其实很集中，值得先说清楚再挑替代品。

为什么会想换掉它

渲染保真度。 矢量运行时只画一组预定义的图元。超出这组之外的东西——重模糊、玻璃与金属材质、着色器处理、半调或 ASCII 效果、真正的 3D 几何——只能被简化、栅格化或直接舍弃。如果「这个视觉」本身就是动画存在的理由，这是一条硬约束。

接入成本。 交付 Lottie 意味着同时交付一个运行时、接一个播放器组件、跨平台测一遍。在有工程团队的产品里这笔账划算；在一个落地页主视觉、一支发布视频或一页提案上，这笔账不划算。

分发。 社交平台、广告网络、邮件营销、演示文稿和视频托管都接受 MP4，没有一个接受 Lottie。只要动画需要出现在你能控制的代码库之外，它迟早都要变成视频。

制作天花板。 经典的 Lottie 流程要经过 After Effects 加插件，也就是说即便产物只是一个小 JSON，桌面软件的成本和学习曲线仍然留在工作流里。

什么时候该继续用 Lottie

不要为了换而换。以下情况请留在 Lottie：

简单且矢量——图标、加载动画、开关、空状态、微交互。
在产品内部——运行时已经存在的 App 或网站里。
需要交互或状态驱动——要暂停、倒放、改色，或响应点击。
小尺寸下对体积敏感——一个 20KB 的 JSON 会赢过同内容的任何视频。
需要分辨率无关——同一个文件从 24px 图标一直用到全屏主视觉。

如果上面命中三条以上，实话建议是继续用 Lottie；若具体痛点是体积或素材管理，则去看 dotLottie。它是开放的 .lottie 格式，把动画、素材、主题和状态机打包进单个 ZIP 压缩文件，LottieFiles 称其可比原始 Lottie JSON 小最多 10 倍，Web 运行时约 150KB。

四种现实的替代路线

路线	产物	保真度上限	接入方式	可交互	最适合
视频导出	MP4、WebM、PNG 单帧	只要能渲染出来就行，含 3D 与着色器	直接放入，无需运行时	否	市场物料、社媒、落地页、发布片
dotLottie	`.lottie` 包	与 Lottie 同为矢量图元	需要运行时	是	规模化的生产级 Lottie
可交互运行时	Rive `.riv`	矢量 + 状态机	需要运行时	是	需要响应的产品与游戏 UI
动画 SVG / CSS	带 CSS 或 JS 的 SVG	矢量图元	直接贴进标记	有限	网页上的图标与插画

可选的制作工具

KinoViz —— 视频优先，保真度上限最高

KinoViz 是浏览器动画工作室，核心是带 40 条缓动曲线、逐属性控制的关键帧时间轴。它是本文里唯一不假装自己是 Lottie 工具的选项：全档导出 MP4（H.264）、WebM（VP9） 和 PNG 单帧，Creator 及以上另有 .kino 工程文件。没有 Lottie，也没有 GIF。

这样换来的是矢量运行时画不出来的一切：3D 模型导入（GLB、GLTF、FBX，DRACO 压缩，上限 50MB，全档可用含免费档）、Rapier 物理、液态玻璃、长虹玻璃与磨砂玻璃、液态金属、辉光与泛光、ASCII 与半调、22 种程序化渐变背景和 42 个文字特效预设。见材质与效果与 3D 系统。

唯独替代不了透明的 Lottie 叠加层：视频导出会把画布背景烘进去，目前唯一的透明输出是 PNG 单帧。叠加层需要动起来时，把目标背景放进项目里，让 KinoViz 在导出前先合成好。分辨率随档位提升——免费档 540p / 24fps 带水印，Creator 1080p / 30fps，Pro 最高短边 1920px / 60fps——渲染在浏览器本地完成，无需上传。完整矩阵见导出格式，实际取舍见导出格式怎么选。

价格： Free $0、Creator $8/月、Pro $19/月（含 7 天免费试用）、Studio $79/月（Coming Soon）。见定价页。

Jitter —— 换掉制作端，但保留 Lottie 输出

如果你想离开「AE 加插件」这条流水线，但仍要以 Lottie 为输出格式，Jitter 是最直接的一步。截至 2026 年 9 月，其定价页显示免费档即支持视频、GIF 和 Lottie 导出，同时列出 3 个工作区文件、720p / 30fps 和水印。付费档加 ProRes 和 WebM，较高档位提供透明导出和逐帧控制，按每编辑者每月计费。

最适合： 想在一个工具里同时拿到浏览器制作、实时协作和 Lottie 交接的团队。完整对比见 KinoViz 与 Jitter。

SVGator —— Lottie 加可直接上代码的 SVG

SVGator 在浏览器里做 SVG 动画，提供本文最全的一套 Web 原生输出：全档支持带 CSS 或 JS 的动画 SVG（免费档带水印），Starter 及以上支持 Lottie JSON，Pro 及以上支持 GIF、WebP、PNG 序列和 MP4，视频最高 3840 × 2160、60fps（2026 年 9 月口径）。年付价格为 Free $0、Starter $20/月、Pro $24/月、Team 每席位 $27/月（最少 3 席）。

最适合： 想在动画 SVG 和 Lottie 之间对同一份资产两头下注的网页设计师与前端开发。

Rive —— 换的不是格式，是整套运行时

Rive 不导出 Lottie，它替换的是整个思路：做矢量动画、接状态机、导出 .riv 文件，由面向 JavaScript、iOS、Android、Flutter、React、React Native、C++、Unity 和 Unreal 的运行时播放。如果你离开 Lottie 的理由是「动画需要反应而不只是播放」，那就该看它。截至 2026 年 9 月，其定价为 Free 每席位 $0/月、Cadet $9、Voyager $32、Enterprise $120，付费档另有 MP4、WebM、GIF 和 PNG 序列视频导出。

最适合： 产品与游戏团队。完整对比见 KinoViz 与 Rive。

五行决策

动画简单、矢量、在产品内部 → 继续用 Lottie，考虑 dotLottie。
动画必须响应输入或状态 → Rive。
动画是网页上的图标或插画 → SVGator、SVG 或 Lottie。
想要浏览器制作但仍输出 Lottie → Jitter。
动画本身就是那份市场物料，视觉效果比文件体积更重要 → 视频导出，而 KinoViz 正是为这种场景做的。

想看更全面的工具生态见2026 年浏览器端动画工具盘点；如果你的起点是桌面流水线，见 AE 网页版替代方案。

免费试试 KinoViz

免费开始——3 个项目，无需信用卡，3D 编辑器、物理和关键帧时间轴全部包含，MP4、WebM 和 PNG 导出全档可用。需要无水印的 1080p / 1920px 输出加高级材质时，Pro 提供 7 天免费试用。

文中竞品信息基于 2026 年 9 月的公开资料，可能发生变化，请以对方官网为准。