Install Bodymovin for After Effects
How to install and use the Bodymovin extension for After Effects, which lets you export After Effects compositions as JSON files.
About Lottie: https://airbnb.io/lottie/#/supported-features
Bodymovin extension: https://exchange.adobe.com/creativecloud.details.12557.bodymovin.html
Full course, plus downloadable assets: https://wfl.io/after-effects-lottie
Video transcript
Install Bodymovin for After Effects is a prerequisite step for working with Lottie animations in Webflow. Bodymovin is an After Effects plugin that exports animations as JSON files in the Lottie format, which can then be embedded and played back on the web without needing a video file.
To install Bodymovin, you download it from the Adobe Exchange or directly from the Bodymovin GitHub repository, then install it as an After Effects extension. Once installed, you'll find it under Window > Extensions > Bodymovin in After Effects.
To export a Lottie animation, build your animation in After Effects, open Bodymovin, select the composition you want to export, choose a destination folder, and click Render. This produces a JSON file. You can then upload that JSON to a hosting location and embed it in Webflow using the Lottie element or a Code Embed.
Not all After Effects features are supported by Bodymovin — some effects and expressions won't export correctly. Stick to basic animation properties (position, scale, rotation, opacity) and vector shapes for the most reliable results.
