ReloPortal Redesign
Phase 1: Scope and Research
ReloPortal Redesign
Phase 1: Scope and Research
ReloPortal Redesign
Phase 1: Scope and Research
WebMD | Clearblue Take Action Program UI
A Guided engagement interface designed to translate complex health information into clear patient journeys
and confident next step decisions.
WebMD | UX Designer | Healthcare Platforms: Web, Tablet, Mobile
Project Overview
Led the design of the Clearblue Take Action experience to translate health information into guided engagement pathways.
The interface supported patients in understanding their next steps with greater clarity across digital touchpoints.
Kickoff
Clearblue sought to extend its trusted health brand into a digital experience. The goal was to create a platform that transformed
raw fertility data into personalized guidance. Existing concepts lacked emotional connection and clear instructions,
so our task was to deliver a solution that balanced scientific accuracy with approachable, supportive design.
Midfidelity Wireframes
Wireframes focused on restructuring the experience into digestible action cards, clear progress indicators,
and supportive educational content.
Early wireframes explored pathways for structured patient engagement.
Wireframes organized content into digestible action cards, clear progress indicators, and supportive educational content.
Layouts were planned for desktop-first deployment with consideration for tablet and mobile adaptation.
UI Elements
We developed a design system that conveyed warmth and empathy, ensuring visual consistency across the Take Action experience and future Clearblue digital offerings. Components, typography, and color palettes
were carefully designed to feel approachable while maintaining credibility and clarity.
Interface elements supported consistent engagement across platforms.
Components, typography, and color palettes were carefully crafted to feel approachable while maintaining credibility.
The system ensures a consistent experience across the Take Action platform and supports future digital offerings.
Final UI Mockups
Final designs translated sensitive health data into actionable, reassuring steps, balancing scientific accuracy with supportive guidance. While the program was desktop-first, we adapted layouts and interactive elements for tablet and mobile users, ensuring readability, touch-friendly navigation, and consistent visual hierarchy across devices. AI-informed notifications
were incorporated to help users stay engaged and follow daily fertility guidance on the go.
Final designs translated engagement pathways into usable patient experiences.
Final layouts balance scientific accuracy with supportive guidance. Desktop-first designs were adapted for tablet and mobile,
ensuring readability, touch-friendly navigation, and consistent visual hierarchy.
AI-informed notifications help users stay engaged and follow daily fertility guidance on the go.
Outcome/Reflection
The experience enabled patients to interpret their next steps with greater clarity and confidence.