Figma to Webflow: After Effects & Bodymovin — Figma to Webflow (Part 4 of 7)

Take the full course at Webflow University: Figma to Webflow | Webflow University with access to all assets or to clone the completed Webflow project.

After generating our 3D product renders in Cinema 4D and Octane, we then convert them to JSON Lottie files — animated designs we can use on our website — using After Effects and the Bodymovin’ plugin.

Share your progress #figmatowebflow on social media and here on this topic in the forum.

In this lesson:
00:00 — Introduction
00:41 — Install the Bodymovin plugin
01:56 — Create a composition in After Effects for your image sequence
03:50 — Render the JSON file
05:17 — Set your preferences to “Allow Scripts to Write Files and Access Networks”
06:56 — Share your progress #figmatowebflow

Course discussion

Lesson discussions