ConnectedCare App Redesign & Design System Creation
Building a human-centered healthcare experience from the ground up.
- Role
- Lead Designer
- Company
- BEWATEC
- Platform
- iOS & Android
A fragmented experience with no product identity
The MVP app had no unified visual identity. The experience felt sterile and confusing — especially for patients navigating hospital stays who needed clarity and warmth, not friction.
Accessibility was a critical gap. WCAG violations, weak contrast ratios, and inconsistent typography made the app harder to use for patients who were already in vulnerable situations.
Defining the tone before touching the UI
Before any design decisions, we ran a brand survey with key stakeholders to align on values, tone, and personality. Healthcare design requires emotional intentionality — every word and visual choice carries weight.
- Tone: Clear, caring, simple.
- Values: Empathy, support, structure, dignity.
- Personality: Human-first, respectful, emotionally intelligent.
- Voice: Clear, inclusive, human-centered — never clinical or cold.
A clear framework before a single pixel
- Establish a unified visual identity grounded in the brand values
- Achieve WCAG-compliant contrast across all UI surfaces
- Build a scalable design system with full dev handoff documentation
- Bring warmth and clarity to the patient onboarding experience
- Replace inconsistency with a coherent typographic and color system
- Create an illustration language that educates and reassures
An atomic system built to scale
Grid & Spacing
4px grid agreed with engineering — a shared foundation that made design-to-dev handoff predictable and frictionless.
Color Palette
46-tone color system with WCAG-compliant contrast ratios. Every token was tested for accessibility before use in production.
Typography
Clear font hierarchy with reusable typographic styles. Consistent scale across mobile breakpoints for all patient-facing content.
Iconography & Illustrations
Consistent stroke icon system with semantic meaning, plus a full illustration library for onboarding, education, and emotional support moments.
Measurable impact for patients and hospitals
Design systems are living organisms, not static assets. Visual clarity is healthcare clarity — every UI decision has emotional impact. Scalability requires humility, not just craft. Building from zero within a regulated, legacy-heavy space taught me to balance vision, reality, and advocacy — while staying user-centered above all.