124: Leslie Cohn-Wein & Rafael Conde - Designing the User Interface at Netlify

What It Covers

Leslie Cohn-Wein and Rafael Conde explain Netlify's UI design process, covering collaboration between designers and engineers, design system constraints, tool choices including Sketch and Abstract, and shipping the analytics dashboard feature using systematic workflows.

Key Questions Answered

• •Design handoff elimination: Netlify maintains constant conversation between designers and front-end engineers throughout feature development rather than traditional handoff processes, with daily design meetings where both teams provide feedback and solve problems collaboratively before implementation begins.
• •Conservative component philosophy: The team deliberately avoids introducing new UI patterns, rejecting common elements like toggle switches and tabs to maintain consistency. They reuse existing patterns like cards and striped lists, forcing creative solutions within constraints to reduce maintenance burden and visual complexity.
• •Library evaluation framework: When selecting Highcharts for analytics, the team created comparison matrices ranking libraries against prioritized features including chart types, responsive behavior, accessibility modules with ARIA labels, and customization ease, then prototyped top three candidates before final selection.
• •Design tools as middle ground: Sketch mockups serve as conceptual guides rather than pixel-perfect specifications. Engineers catch inconsistencies like random padding values and normalize them to system variables, with designers welcoming pushback since code represents the actual source of truth for the product.