"The Step After Styleguides"
summary
Styleguides evolve into a reusable component library called Armin that serves three apps (programs, radio, styleguide) and is distributed via composer/twig in a PHP stack. Components follow atomic design (atoms→molecules→organisms→templates), each with a presenter interface to formalize data, move logic out of templates, and enable unit tests that assert rendered HTML. A pragmatic choice avoids a central template web service; using presenters and the single conditional rule keeps templates simple and lets two teams share a visual system successfully.
AI-written summary · about
chapters (16)
- 0:00Introduction
- 1:10Jargon as a communication tool
- 2:13Design systems explained
- 5:20Enforcing consistency with systems
- 7:06From mockups to wireframes
- 8:54Design systems across platforms
- 11:25Building component libraries
- 13:37CSS foundations and domain objects
- 15:43Documenting components
- 16:29Abstracting the style guide
- 17:55Choosing the right tech stack
- 21:26Atomic design principles
- 25:43Presenters and interfaces
- 29:36Single conditional rule
- 31:45Testing presenters and templates
- 33:11Conclusion and key takeaways
related talks
45mYour Styleguide is an API
45mMaintainable Style Guides
49mLiving Styleguide in your Drupal projects: Benefit from component driven design.
01h 05mStyleguide-Driven Development
48mA practical guide to style guide driven development
37mThe ABC of Coded Style Guides
42mDesigning Inspired Style Guides
34mCreating Living Style Guides