Materialising a Design System with Material Design Components
summary
Trade Me builds a shared mobile design system called Tangram on Material Design Components (MDC 1.1), implementing a single Tangram shared theme module used by three Android apps to provide automatic colors, elevation semantics, and a custom Story Sans typeface. Engineering adds dark mode and day-night theming with a screen-by-screen kill switch, a catalog app for visual testing, KTlint and custom lint rules, and Espresso checks. Migration from an eight year old codebase takes six months and ships the redesigned app to users while leaving Compose and bridge cleanup as next steps.
AI-written summary · about
chapters (9)
- 0:00Introduction and background
- 5:04What is a design system
- 10:59Design vision for mobile project
- 18:24Choosing Material Components
- 22:39Theming and styling with MDC
- 25:48Library structure and practices
- 28:17Migration and dark mode
- 31:27Future work and conclusion
- 31:48Q&A session
related talks
45mHow We Built a Design System in Jetpack Compose
06mLightning talk: Design System - Modular component model
30mDesigner–Engineer Workflows in Android App Development
25mPanel discussion about design systems
39mA Design System, it Composes!
46mBuilding & Managing Design Systems
34mDesigners, Developers, Let’s Create the Difference!
38mDesign Systems Mastery: From Patterns & Principles to Product Excellence