Figma Sidebar Build: Power User Tips & Tricks!
17.5K views · 2025-01-22
UI Design
The Figma sidebar component is a powerful tool for streamlining your design portfolio or design system. Using Figma variables and basic UI design principles we're going to build a sidebar that looks and works great in a prototype! Ultimatley, this video will explore hidden tips and tricks for maximizing its functionality, making you more efficient, and a more impressive designer.
GENERAL LINKS
NEW - Our Official Design System: https://collectivekit.co/
Ask the community and build a profile: https://uicollective.co/
Work with me: https://designsystemlabs.co/
Need design system coaching? Email kirkland@uicollective.co
Connect with me on LinkedIn: https://www.linkedin.com/in/kirk-mcneill-km/
Support UI Collective & buy a laptop sticker: https://store.uicollective.co/
All Resources: https://uicollective.co/designer-tools-and-resources
OTHER LINKS
Build a Design System Episode 1: https://youtu.be/HNJmWKndUA4
0:00 Setting Up the Sidebar
9:47 Building the Sidebar
18:17 Troubleshooting the Sidebar
20:48 Prepping for the Prototype
30:23 Completed Figma Prototype
#uxdesign #uidesign #figma
GENERAL LINKS
NEW - Our Official Design System: https://collectivekit.co/
Ask the community and build a profile: https://uicollective.co/
Work with me: https://designsystemlabs.co/
Need design system coaching? Email kirkland@uicollective.co
Connect with me on LinkedIn: https://www.linkedin.com/in/kirk-mcneill-km/
Support UI Collective & buy a laptop sticker: https://store.uicollective.co/
All Resources: https://uicollective.co/designer-tools-and-resources
OTHER LINKS
Build a Design System Episode 1: https://youtu.be/HNJmWKndUA4
0:00 Setting Up the Sidebar
9:47 Building the Sidebar
18:17 Troubleshooting the Sidebar
20:48 Prepping for the Prototype
30:23 Completed Figma Prototype
#uxdesign #uidesign #figma