HABITHERO · KING'S COLLEGE LONDON CAPSTONE
My full design system, end to end.
A wellness rewards app for health insurance members. Research, flows, UI and a token system, all in Figma.
- SUS score
- 82.5
- SUS score
- task completion
- 100%
- task completion
- NPS
- +60
- NPS
- Research
- UI design
- Design system
- Usability testing
- Figma
THE INSIGHT
Design for the bad week.
12 of 15 people had quit habit apps because one missed day broke the streak. So I designed a streak freeze plus a lighter goal, with copy that says “your streak is protected.”
It feels like the app actually understands that I have a life outside of my habits.
THE SYSTEM
Four token layers, one rebrand away.
Components only reference use-case tokens, so dark mode needed no redesign and a rebrand changes the whole system at once.
- variables
- 454
- variables
- colour families
- 11
- colour families
- modes
- 2
- modes
- contrast
- AA
- contrast
WHY IT STILL MATTERS
This is where I learned that a design system is infrastructure. Today I feed the same kind of tokens to AI code generation through MCP, so the output stays on brand.