Tutorial: Animated Navbar in Framer (New Trend)
✔︎ Framer University: https://frameruni.link/yt
✔︎ Create a free Framer account: https://framer.university/free-account
In this Framer tutorial, I'm going to walk you through my step-by-step process of creating an animated responsive navigation bar without any code. We're going to learn about components, interactions, and scroll variant effects, so make sure to stick around until the end.
→ Remix the tutorial project: https://framer.university/resources/a...
→ Mod site: https://madebymod.co/
0:00 - Introduction
0:45 - The inspiration
1:19 - Remix link
2:03 - Base of the navigation bar
3:28 - Grabbing our logo
4:38 - Inserting our logo
7:43 - Preparing for mobile responsiveness
10:19 - Last tweaks & positioning the navbar
13:55 - Adding links
14:07 - Advantages of components in Framer
15:07 - Creating a component
17:53 - Adding the scroll effect
21:37 - Adjusting the animation
22:25 - Optimizing for mobile breakpoint
31:45 - Final design & additional resources
Follow me on:
X: / learnframer
Instagram: / framer.university
Смотрите видео Tutorial: Animated Navbar in Framer (New Trend) онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Framer University 25 Октябрь 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 6,519 раз и оно понравилось 296 людям.