Take your shot of Vitamin!
summary
An open-source design system called Vitamine provides platform-respecting UI components with a generated token pipeline and concrete Android artifacts (Kotlin + Jetpack Compose and legacy XML), plus Figma specs and web/iOS packages. The architecture organizes Gradle modules into foundation, components, organisms and a final vitamine artifact, exports tokens as JSON for cross‑platform code generation, and has been used to rebuild a flagship Decathlon app in about six months with the component library in production.
AI-written summary · about
chapters (15)
- 0:00Introduction
- 1:25What is Vitamin?
- 3:31Atomic Design and components
- 7:45Organization and contributors
- 8:29Android architecture of Vitamin
- 11:58Foundation: colors and typographies
- 14:44Themes and semantics in Jetpack Compose
- 17:32Example: Top Bar in Vitamin
- 28:55Example: Full product page
- 33:28Why create a design system?
- 34:13Tokens: new approach
- 40:18Technical benefits of tokens
- 42:27Current status and next steps
- 43:51Multiplatform implementations
- 44:57Conclusion and Q&A
related talks
21mTake your shot of Vitamin!
21mTake your shot of Vitamin!
18mOne design system to rule them all 1
34mDesign System Driven Android Development: A Guide to Automation Tools
49mImplement your own design system with Jetpack Compose
37mLet your design evolve, adopt a Design System!
26mHow we engineered our design system
39mA Design System, it Composes!