Design System Driven Android Development: A Guide to Automation Tools
summary
A production-ready design system replaces manual SVG churn with automated pipelines: Figma foundations export into Android resources via figma-export from redm ribbit, icons/colors/typography become an autogenerated module, and CI updates run on commit. Static analysis uses Twitter’s Jetpack Compose rules plus Detekt custom rules to block legacy imports. Snapshot testing runs on JVM with Paparazzi snapshot tests, catches visual regressions (millisecond runs, thousands of snapshots), uncovers localization and dark/dynamic color bugs, and a KSP-generated gallery provides a browsable, variant-rich QA app.
AI-written summary · about
chapters (10)
- 0:00Introduction and speakers
- 1:09Design system evolution at CH Public
- 4:43Foundation of the new design system
- 8:33Figma as single source of truth
- 12:51Figma export automation tool
- 16:28Jetpack Compose code standards
- 20:23Snapshot testing with Paparazzi
- 24:55Design system gallery app
- 28:08KSP for gallery annotations
- 30:40Summary and automation tools
related talks
26mHow we engineered our design system
39mAtomic Design in Android
37mLet your design evolve, adopt a Design System!
25mGetting started on Android UI design hub
45mDesign Tools and Handoffs*
40mBest practices for building a consistent design system from design to app implementation
38mDr. DeSign Systems: or, how I learned to stop worrying and remove the chaos?
49mDesign Tools - Closing the Gap Between Design and Development