An overview of the After Effects and Lottie in Webflow course.
This is Adobe After Effects. Many consider it the industry standard for motion graphics. What if, without any code, we can bring After Effects to the web? What if we can do this visually, based not only on when someone loads up a web page, or clicks, but what about an animation that can progress as someone scrolls? Or, what if, using that same technology, we could render an image sequence in Cinema 4D, or Blender, and control that sequence based on the position of our mouse? This is what’s possible with After Effects in Webflow. It’s built on Airbnb’s Lottie and it works like this. Step one: Create an animation in After Effects. Step two: export it using an extension called body moving.
[Voice coach] Body movin
[McGuire] Body moving
[Voice coach] Body movin
[McGuire] Body moving
[Voice coach] Body movIN
Step three: Webflow. Just, add your animation, drag it in. If you preview it now, it animates exactly as it does in After Effects. But, here’s the biggest part: step four. These triggers we’re listing on the screen, you can use any of them to control the animation. We’re going to teach how to animate each of these triggers, because we’re going to show you how you can use both After Effects and Webflow to their full potential, together.
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:
So check out After Effects and Lottie in Webflow and learn how you can use both After Effects and Webflow to their full potential.
Something went wrong while submitting the form. Please contact support@webflow.com
Got a lesson suggestion? Let us know
Need more help? Want to report a bug? Contact support
Have feedback on the feature? Submit feature feedback