Figma Prototyping Essentials | Build Tab Navigation & Scroll Effects
This video is a Figma prototyping tutorial for beginners in 2025, simplifying complex concepts like navigation, page transitions, and component variant states. As a design professor and product designer with 11 years of experience, I'll guide you through making a figma prototype. Learn how to use Figma for beginners to create interactive designs and master figma components tutorial.
Learn Figma prototyping in 2025! This beginner’s step‑by‑step guide shows how to build interactive prototypes, connect screens, animate transitions, and more. In part 3 of my Figma tutorial series we dive deep into Figma Prototyping. I show you how to prototype Primary Navigation in the tab bar of the iOS app. We learn how to link Pages in Figma, how to prototype Vertical Scrolling and Horizontal Scrolling (Carousel).
https://help.figma.com/hc/en-us/articles/360040314193-Guide-to-prototyping-in-Figma
#figma #figmaprototyping #figmaprototype #figmaforbeginners #figmatutorial #figma2025
-------------------------------------------------------------------------------
Resources:
-------------------------------------------------------------------------------
🌈 Figma Template I Created for you ⬇️
https://www.figma.com/community/file/1476677824644780396
------------------------------------------------------
🌸Learn more with Playlists🌸:
🌈 Complete Series Figma for Beginners 2025: https://www.youtube.com/playlist?list=PLXdRMPwB8CHkdA9Sch2ArrgmViCbHyaRN
🔥 Create a project for your Portfolio Playlist: https://www.youtube.com/playlist?list=PLXdRMPwB8CHmVsO8AGFwslE9_Fa4zNtI8
🧘🏻♀️ UX/UI Design Career Playlist: https://www.youtube.com/playlist?list=PLXdRMPwB8CHmky4DDULgzeU-u4XyHNU7y
-------------------------------------------------------------------------------
Connect with me!
➡️ LinkedIn: https://www.linkedin.com/in/nehmatgereige/
👩🏻💻 Portfolio: https://nehmatgereige.com/
🎓Book Free Mentorship time with me: https://adplist.org/mentors/nehmat-gereige
🌈 Figma Creations: https://www.figma.com/@nehmatgereige
-------------------------------------------------------------------------------
🧘🏻♀️ My Gear:
-------------------------------------------------------------------------------
LED Recording Light: https://amzn.to/4b3Ey6p
Microphone: https://amzn.to/3EUoFmC
MacBook Pro: https://amzn.to/40XXjUc
🌸 Disclaimer 🌸 The links from my gear above are amazon affiliate links which allow me to receive a small commission if you click on one of the product links at absolutely NO ADDITIONAL COST TO YOU.
-------------------------------------------------------------------------------
-------------------------------------------------------------------------------
Music Credit
-------------------------------------------------------------------------------
Music I use: Bensound.com
Artist: Benjamin Tissot
License code: 0QQAXSBNZWT3LNH6
---------------------------------------------
---------------------------------------------
⏰ CHAPTERS ⏰
00:00 #1. Intro
00:30 #2. Previous steps needed
01:43 #3. Prototypes in UX Design
04:57 #4. Prototype Navigation tab bar
21:36 #5. Secondary Navigation: detailed view & Back
27:19 #6. Change component states with variants
39:43 #7. Prototype Vertical Scrolling
42:35 #8. Prototype Carousel Horizontal Scrolling
Learn Figma prototyping in 2025! This beginner’s step‑by‑step guide shows how to build interactive prototypes, connect screens, animate transitions, and more. In part 3 of my Figma tutorial series we dive deep into Figma Prototyping. I show you how to prototype Primary Navigation in the tab bar of the iOS app. We learn how to link Pages in Figma, how to prototype Vertical Scrolling and Horizontal Scrolling (Carousel).
https://help.figma.com/hc/en-us/articles/360040314193-Guide-to-prototyping-in-Figma
#figma #figmaprototyping #figmaprototype #figmaforbeginners #figmatutorial #figma2025
-------------------------------------------------------------------------------
Resources:
-------------------------------------------------------------------------------
🌈 Figma Template I Created for you ⬇️
https://www.figma.com/community/file/1476677824644780396
------------------------------------------------------
🌸Learn more with Playlists🌸:
🌈 Complete Series Figma for Beginners 2025: https://www.youtube.com/playlist?list=PLXdRMPwB8CHkdA9Sch2ArrgmViCbHyaRN
🔥 Create a project for your Portfolio Playlist: https://www.youtube.com/playlist?list=PLXdRMPwB8CHmVsO8AGFwslE9_Fa4zNtI8
🧘🏻♀️ UX/UI Design Career Playlist: https://www.youtube.com/playlist?list=PLXdRMPwB8CHmky4DDULgzeU-u4XyHNU7y
-------------------------------------------------------------------------------
Connect with me!
➡️ LinkedIn: https://www.linkedin.com/in/nehmatgereige/
👩🏻💻 Portfolio: https://nehmatgereige.com/
🎓Book Free Mentorship time with me: https://adplist.org/mentors/nehmat-gereige
🌈 Figma Creations: https://www.figma.com/@nehmatgereige
-------------------------------------------------------------------------------
🧘🏻♀️ My Gear:
-------------------------------------------------------------------------------
LED Recording Light: https://amzn.to/4b3Ey6p
Microphone: https://amzn.to/3EUoFmC
MacBook Pro: https://amzn.to/40XXjUc
🌸 Disclaimer 🌸 The links from my gear above are amazon affiliate links which allow me to receive a small commission if you click on one of the product links at absolutely NO ADDITIONAL COST TO YOU.
-------------------------------------------------------------------------------
-------------------------------------------------------------------------------
Music Credit
-------------------------------------------------------------------------------
Music I use: Bensound.com
Artist: Benjamin Tissot
License code: 0QQAXSBNZWT3LNH6
---------------------------------------------
---------------------------------------------
⏰ CHAPTERS ⏰
00:00 #1. Intro
00:30 #2. Previous steps needed
01:43 #3. Prototypes in UX Design
04:57 #4. Prototype Navigation tab bar
21:36 #5. Secondary Navigation: detailed view & Back
27:19 #6. Change component states with variants
39:43 #7. Prototype Vertical Scrolling
42:35 #8. Prototype Carousel Horizontal Scrolling