Take your shot of Vitamin!
summary
Vitamin is a cross-platform design system with Figma, web, Android and iOS implementations and a Jetpack Compose focus; it maps vitamin semantics to Material where needed and ships custom palettes and typography chosen because Material 2/3 felt limiting. Components live as object namespaces so code completion shows e.g. vitamin.Bars.primary, navigation icons use a scoped composable and actions are passed as a list, and icons are converted from SVG into Kotlin. Tokens live in JSON and generate component→semantic→core mappings enabling theme and dark-mode swaps and automated code generation; a demo product page is assembled in about 13 minutes. Vitamin is a cross-platform design system (Figma, web, Android, iOS) Components live inside object classes like vitamin.Bars.primary Tokens are JSON-based and generate component→semantic→core mappings
AI-written summary · about
chapters (9)
- 0:00Introduction and speaker intro
- 0:48What is Vitamin design system
- 3:44Compose architecture overview
- 5:11Foundation elements in Vitamin
- 8:45Implementing top bar with Vitamin
- 13:27Building product information
- 15:37Assembling the full screen
- 16:46Atomic design and tokens
- 20:05Closing and resources
related talks
21mTake your shot of Vitamin!
46mTake your shot of Vitamin!
49mImplement your own design system with Jetpack Compose
42mUsing Jetpack Compose to Create Apps From Figma UI Sketches
26mCompose Beyond Material Design
01h 12mJetpack Compose — live coding declarative UI
39mA Design System, it Composes!
35mCompose beyond Material