Sticky Features Section in Framer (Full Tutorial)
Framer University:
Create a free Framer account:
In this Framer tutorial, you'll learn how to create an impressive feature section with sticky images and scrolling text. I'll guide you through setting up the layout, creating reusable components, and implementing scroll-based animations. You'll discover how to use stacks, component variants, and scroll effects to achieve a professional, responsive design without writing any code. By the end of this video, you'll be able to build engaging, Apple-style feature sections that smoothly transition between content as users scroll.
Remix the tutorial project:
Apple Watch Series 9 in Framer (remix):
TinyPod website (made in Framer):
Recreated from the old Amie website:
0:00 - Introduction
1:28 - Remix the project
2:31 - Basic setup
4:30 - Creating the text component
11:13 - Creating the images component
16:10 - Sticky positioning
20:50 - Fine-tuning the layout
27:10 - Adding the scroll effects
31:08 - Optimizing for mobile
35:20 - Pro tip for you
36:09 - Final result and variation
36:44 - Additional resources
Follow me on:
X:
Instagram:
Watch video Sticky Features Section in Framer (Full Tutorial) online without registration, duration 37 minute 25 second in high hd quality. This video was added by user Framer University 26 July 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 6 thousand once and liked it 26 people.