Figma Developer Handoff Masterclass | Best Practices & More!

A guide to the best practices for handing off @Figma designs to developers is finally here! Today we're exploring the correct way to annotate your design files, organize your design tokens and Figma variables, and build mobile optimized components for your design system!

GENERAL LINKS
NEW - Purchase our official design system: https://collectivekit.co/
Ask the community and build a profile: https://uicollective.co/
We build design systems! Work with me: https://designsystemlabs.co/
Connect with me on LinkedIn: https://www.linkedin.com/in/kirk-mcneill-km/

All Resources: https://uicollective.co/designer-tools-and-resources

OTHER LINKS
Build a Design System Episode 1: https://youtu.be/HNJmWKndUA4
Web Accessibility Annotation Kit: https://www.figma.com/community/file/1311421011482282592/web-accessibility-annotation-kit
Design System Tracker: https://www.figma.com/community/plugin/1301974711562028600/design-system-tracker
Contrast Checker: https://www.figma.com/community/plugin/748533339900865323/contrast

0:00 An Introduction
0:18 Design Annotations
28:05 Mobile Optimized Components
31:59 Design Token & Figma Variable Organization
49:05 Developer Handoff Checklist

#uxdesign #uidesign #figma