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:
Смотрите видео Sticky Features Section in Framer (Full Tutorial) онлайн без регистрации, длительностью 37 минут 25 секунд в хорошем hd качестве. Это видео добавил пользователь Framer University 26 Июль 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 6 тысяч раз и оно понравилось 263 людям.