ImageToSVG

After Effects vs Lottie

Understand the relationship and tradeoffs between designing in After Effects and exporting animations as Lottie files for the web.

After Effects as the Design Tool, Lottie as the Delivery Format

After Effects and Lottie aren't really competing alternatives — After Effects is the design and animation tool, while Lottie (via the Bodymovin plugin) is the export format that translates After Effects animations into lightweight, scalable JSON for web and app playback.

  • After Effects: where the animation is actually designed and keyframed
  • Lottie: the export format/runtime that plays the animation elsewhere
  • Bodymovin plugin bridges the two, exporting AE projects to Lottie JSON

Export Limitations to Be Aware Of

Not every After Effects feature exports cleanly to Lottie — certain effects, expressions, and plugins aren't supported by the Bodymovin exporter, so complex animations sometimes need simplification or rework specifically to ensure clean Lottie compatibility before final export.

  • Some AE effects and expressions don't translate to Lottie at all
  • Test exports early in the design process, not just at the final step
  • Simpler shape-layer-based animations export most reliably to Lottie

Frequently Asked Questions

Do I need both After Effects and Lottie, or can I skip one?

You generally need both in this workflow — After Effects to design the animation and the Bodymovin plugin to export it as a Lottie file other platforms can play back efficiently.

Will my After Effects animation look identical after exporting to Lottie?

Often closely, but not always perfectly — certain effects and plugins aren't supported by the Lottie export process, so always preview and test the exported Lottie file against the original design.

Related guides

Ready to Convert Your Image to SVG?

Free online converter — no sign-up, no watermarks, results in under 3 seconds.

Convert Image to SVG — Free