Minimising Complexity
summary
Building Barnardo's design system as a two‑person greenfield project starting in January, the team codes components directly in an open GitHub repo and enforces three concrete rules: color variants by 10% tint/shade steps, spacing on 4px increments (quarter‑rem), and type sizes on a 1.125 scale from a 16px base. Custom linter plugins give instant feedback, remove design artifacts, reduce token bloat, and cut review cycles — the system ships, teams adopt it, and it measurably keeps CSS complexity down.
AI-written summary · about
chapters (7)
- 0:00Project background
- 2:12Bridging the gap
- 4:13Designing in the browser
- 6:19Defining system rules
- 11:14Enforcing consistency
- 13:06Principles and benefits
- 16:09Conclusion and takeaways
related talks
22mDesign Systems, when and how much? — Diana Mounter
33mGet the core right and the resilient code will follow
40m“Where We Can Go”
27mAdvanced Design System Considerations
29mBulletproof Design Systems
38mDesign for Developers
46mBuilding & Managing Design Systems
15mBridging the gap between developers and designers