Rethinking Designer-Developer Collaboration
summary
A small “info” icon request forces graphs into a text-only component, creating synchronous network calls and a refactor; the team responds by adding designers to kickoffs, using a shared design system in Figma with prototypes and branching, documenting live components in Storybook, enforcing name/token conventions and ESLint rules, and auto-exporting tokens/code with Figma MCP, plus visual testing with Chromatic, a VQA stage, and monthly bug-fix days. Outcome: fewer unexpected fixes, shorter development time, and much cleaner handoffs between design and code.
AI-written summary · about
chapters (6)
- 0:00Introduction to collaboration gap
- 2:55Bridging designer-developer expectations
- 5:27Design system and documentation
- 8:17Code alignment with design system
- 11:54Quality assurance in final stages
- 13:22Practical takeaways and closing
related talks
15mModern Approach to Designer ❤️ Developer Collaboration
40mHow to optimise the workflow between designers and developers using design..
45mBridge the Gap between Design and Development
15mHoly War between Designers & Developers
21mFrom handoffs to upstream
19mBringing Developers into the Design Process
34mDesigners, Developers, Let’s Create the Difference!
19mLevel up designer and developer collaboration with Noga Mann