Role
UI/UX Designer
HEROIC DIABETES
Diabetes Community Gaming App UI/UX Case Study
Support families living with Type 1 diabetes through streaks, community learning, doctor connections, and rewarding daily tasks.
Figma
Adobe Illustrator
Project Overview
Category
Health · Community · Gaming
Platform
iOS & Android
Style
Light + Dark UI
Brief / Challenge
The challenge was a warm, motivating interface for parents and kids — serious health workflows balanced with streaks, gifts, and learning that feel encouraging.
We designed a dual-tone system: deep blue auth and overlays paired with bright white home flows in blue, orange, green, and red.
Key Features
Family Streaks
Track family and kids streaks with daily progress.
Learning Hub
Urgent and product learning paths for T1D care.
Community
Join T1D community chat and peer support.
Doctor Connect
Book appointments and manage referrals.
Gifts & Tokens
Send gifts and earn Heroic tokens for tasks.
Family Profiles
Add family members and track kids progress.
Screen Showcase
Sign In · Dark
Visual Identity
Color Palette
- #0A1628
- #10587C
- #FFFFFF
- #F5F9FC
- #198BC4
- #F28918
- #19C482
- #E05050
Typography
Outfit
- Regular · Aa Bb Cc
- Medium · Aa Bb Cc
- Semibold · Aa Bb Cc
- Bold · Aa Bb Cc
Final Presentation
Care designed for everyday courage.
Heroic Diabetes turns daily T1D routines into visible progress — learning, community, and rewards in one encouraging experience.