Framer Tutorial: Making The AirPods Pro Scroll Animation
🎓 Framer University: https://framer.university
👉 Create a free Framer account: https://framer.university/free-account
In this Framer tutorial, you'll learn how to create an image sequence scroll animation on your Framer website. I'll show you how to set up your components and variants to create this effect in Framer, and I'm gonna also hand you a code override that you can use to play an image sequence on scroll on your website. After watching this video, you'll be able create any image sequence animation on your Framer website.
Starter file + project remixes:
(Frame.io) https://framer.university/resources/f...
(AirPods Pro) https://framer.university/resources/i...
0:00 - Introduction
0:28 - Original effects
1:18 - Why use image sequence instead of a video?
2:08 - Converting a video into an image sequence
2:24 - Remix link and starter file
3:04 - Inserting the image sequence
5:05 - Creating a component and variants
7:20 - Adding the component to the website
8:23 - Creating the code override
10:11 - Final image sequence animation
10:41 - Optimizing it for different breakpoints
10:57 - Free Framer Course
11:40 - Inserting the image sequence (2)
12:38 - Creating a component and variants (2)
14:22 - Adding the component to the website (2)
14:48 - Creating the code override (2)
16:01 - Final image sequence animation (2)
Follow me on:
X: https://x.com/learnframer
Instagram: / framer.university
Смотрите видео Framer Tutorial: Making The AirPods Pro Scroll Animation онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Framer University 26 Январь 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 15,723 раз и оно понравилось 570 людям.