Introduction to After Effects and Lottie in Webflow

An overview of the After Effects and Lottie in Webflow course.

The UI in this lesson may seem different if you've enables the Style Panel Beta! This content will be updated soon!
This video features an old UI. Updated version coming soon!
This video features an old UI. Updated version coming soon!
Introduction to After Effects and Lottie in Webflow

Many consider Adobe After Effects the industry standard for motion graphics. And you can use Webflow to bring After Effects to the web.

In our course, After Effects and Lottie in Webflow, we’ll teach you how to set up an After Effects animation to animate when a page loads, when it scrolls into view, while scrolling, and on click. We’ll show you how to render an image sequence in Cinema 4D or Blender, and control that sequence based on mouse position. 

All visually — without writing a single line of code.

These animation are built on Airbnb’s Lottie and can be created in 4 steps:

  1. Create an animation in After Effects
  2. Export the animation using an extension called Bodymovin
  3. Add your animation
  4. Set up your trigger and configure the animation

So check out After Effects and Lottie in Webflow and learn how you can use both After Effects and Webflow to their full potential.

Browser support

Can I Use ? Data on support for the feature across the major browsers from caniuse.com.

Was this helpful?
OR

Thanks for the feedback! If you can, please add additional feedback below.

Oops! Something went wrong while submitting the form

Thank you! Your feedback has been received!

Oops! Something went wrong while submitting the form