About Us
Blog
Contact Us
FAQs
Webflow
Master Webflow interactions & animations to bring your designs to life.
18 Lessons
0 Quiz
1.83 Hours
About Course
Course Curriculum
Course Requirement
Basic knowledge of Webflow and web design fundamentals
Familiarity with Webflow Designer interface
No prior experience with animation or code needed
Curiosity and a desire to enhance visual storytelling through motion
What We Learn
Understand the fundamentals of Webflow’s interactions and animation tools
Master concepts like interpolation, easing, and smoothing for polished effects
Use a wide variety of triggers to create engaging, interactive experiences
Create scroll-based animations including horizontal movement, parallax, and progress indicators
Build interactive navigation bars that respond to user actions
Animate elements on hover and as they scroll into view
Integrate After Effects animations using Lottie and Bodymovin in Webflow
Bring 3D renders and complex motion into your designs using scroll-controlled playback
Skills you Gain
Advanced Webflow interactions & animation techniques
Visual storytelling through motion design
Scroll and hover-triggered animations
Lottie and After Effects integration in Webflow
Creating responsive and dynamic UI experiences
Building immersive, interactive web layouts
Course Includes
Real-world animation use cases and examples
Step-by-step walkthroughs for integrating Lottie animations
Bonus intro to After Effects and Bodymovin for web use
Lifetime access and certificate of completion
1. Welcome To The Course!
9 Mins
1.1.
Webflow Animation: Introduction to Interactions and animations
2 Minutes
1.2.
Webflow Animation: Interpolation, easing, and smoothing
3 Minutes
1.3.
Webflow Animation: Triggers and animations
4 Minutes
2. Interactions Sections
35 Mins
2.1.
Webflow Animation: Horizontal movement on scroll
3 Minutes
2.2.
Webflow Animation: Parallax movement on scroll
3 Minutes
2.3.
Webflow Animation: Rotate on mouseover
7 Minutes
2.4.
Webflow Animation: Scroll progress indicator
3 Minutes
2.5.
Webflow Animation: Navbar show & hide on scroll
3 Minutes
2.6.
Webflow Animation: Reveal elements on scroll
4 Minutes
2.7.
Webflow Animation: How to add a page loading animation
4 Minutes
2.8.
Webflow Animation: Show and hide on click
4 Minutes
2.9.
Webflow Animation: Reveal on hover
4 Minutes
3. Animations Sections
1 Hour 6 Mins
3.1.
Webflow Animation: After Effects and Lottie course introduction
2 Minutes
3.2.
Webflow Animation: How to install Bodymovin
4 Minutes
3.3.
Webflow Animation: Animating an element when it scrolls into view
3 Minutes
3.4.
Webflow Animation: Animate a 3D render video on scroll
22 Minutes
3.5.
Webflow Animation: Control a Cinema 4D animation with your mouse
20 Minutes
3.6.
Webflow Animation: Lottie overview
15 Minutes
Course Includes
Video Total Duration
1.83 Hours
Lesson
18
Quiz
0
Skill Level
Intermediate
Certificate Of Completion
No
Passing Grade
70%
Enrol Now
Similar Courses
Build and design your Webflow Ecommerce store
e-commerce, Webflow
Swift your business online – e-commerce
e-commerce, Webflow
Webflow CMS & Dynamic Content
Webflow
WebFlow: Web Design Bootcamp – Freelance
Webflow
WebFlow: CSS Layout
Webflow
WebFlow: Landing page generator for Ryan Reynolds
Webflow
WebFlow: Web Accessibility
Webflow
The user guide to the Webflow Editor
Frontend Developer, Webflow
Web Design: From Figma to Webflow
Figma, Webflow