/course/design-tokens-app-ux
Design Tokens for App UX
JSON tokens, codegen hooks, and designer-developer handoff that survives dark mode.
Overview
Build a token pipeline from Figma variables to mobile resource files, including contrast validation and motion tokens where appropriate.
Included focus areas
- Style Dictionary config walkthrough
- Semantic vs primitive token layering
- Dark mode parity checks
- Motion duration tokens without over-animating
- Icon sizing grids aligned to touch targets
- Localization padding considerations
- Documentation site stub in Astro (optional branch)
Outcomes
- Export a token JSON consumed by a sample app
- Produce contrast report for two themes
- Agree on naming convention RFC for your team
Lead mentor
Isla Romero
Design technologist; bridged brand teams to mobile squads.
FAQ
We use native variables; third-party plugins are learner choice.
Optional track; mobile resource focus is default.
Generic sample brand only.
Experience notes
“Design Tokens for App UX stopped our hex fork between Android and iOS—took discipline the course bluntly names.”