Patient Onboarding Portal

PRODUCT DESIGN

HEALTH CARE

RESPONSIVE WEBDESIGN

Role

UX Design, Workflow design,
UI Design, User testing

Impact

Faster Onboarding,

Manual errors dropped by 80%,

Nurse Workload decreased

Team

1 Designer, 2 PM, 1 ML Engineers,

3 Developers

Background and Problem ✨

What it is

A portal designed to help dialysis patients (FKC patients in MVP 1 ) transfer their prescriptions from their existing pharmacy to FRx.

The Problem

Dialysis patients often need to transfer prescriptions when moving to a new pharmacy, such as FRx. The existing process was slow and error-prone:

  • Patients often forget key details.

  • Mistakes in even one digit delayed prescription transfers.

  • Medical history forms are long and intimidating.

  • Nurses/pharmacists must double-check everything manually, slowing down the process.


This created frustration for patients and extra workload for staff.

Why These Details Matter

FRx cannot safely onboard patients without a complete picture of :

  • Insurance Details - For transfer and billing.

  • Medical History - To avoid drug interactions, ensure dialysis-safe medications, and understand comorbidities.

  • Allergies & Conditions - Critical for patient safety.

Case Example

Ravi, a 66-year-old dialysis patient, was asked to transfer his prescriptions to FRx. Faced with long IDs on his insurance card, multiple medications with complex names, and confusion about what medical history to include, he felt anxious and overwhelmed worried that a small mistake could delay his treatment.

Goal 🚀

  • Simplify onboarding for dialysis patients.

  • Accurately capture medical history, medications and insurancewithout burdening patients.

  • Reduce manual errors and staff workload.

  • Ensure HIPAA compliance and patient trust.

  • Improve overall patient experience.

Outcome

Onboarding

Time

Errors in
Information

Medical
Safety

Nurse
Workload

  • Onboarding time was reduced by 65%, cutting the process from 15–40 minutes to just 5–10 minutes.


  • Errors in insurance and medication entry dropped by 80%, as auto-filled fields from OCR and integrations meant fewer corrections by staff.


  • Medical safety compliance improved by 95% through clearer capture of allergies and comorbidities.


  • Nurses’ workload decreased, shifting their role from data entry to validation and patient care.

Before

After

Responsive Web Design

The portal was designed to work seamlessly across Desktop, Tablet, and Mobile Devices, since patients and nurses access it in different contexts from a home phone to a clinic workstation. by using Figma Variables, I built a flexible system to adapt automatically across breakpoints. this ensured consistency while keeping the experience clear and accessible on any device.

Designing the Solution

Guided Stepper for reduced cognitive load


To keep the onboarding flow simple and stress-free, i designed it as a Guided Stepper, where patients move through one task at a time instead of facing long forms all at once. this approach reduces cognitive load and makes the experience less intimidating, especially for elderly patients.

  • breaks the process into small, manageable steps, so patients aren’t overwhelmed by too many questions at once.

  • provides a clear sense of progress, showing which steps are completed and what still remains, helping patients feel in control.

  • keeps navigation straightforward by focusing attention on one action per screen, reducing the chances of errors or skipped details.

OCR Scanning to minimize manual entry


To minimize typing effort and reduce mistakes, the portal supports Scanning Insurance cards, Photo ids, and Prescriptions with OCR. this feature automatically extracts details such as policy numbers, patient identifiers, and medication names, and pre-fills the form.

  • saves patients from manually entering long ids and complex drug names.

  • reduces the chances of transcription errors that could delay onboarding.

  • makes the process faster and more accessible, especially for elderly users or those unfamiliar with medical terminology.

Auto Suggestions


To reduce typing effort and spelling errors, the portal uses auto-suggestions. As patients start typing a drug name, the system fetches matches from integrated databases and shows them instantly. Patients can quickly tap Add instead of entering the full name. For cases where the medication isn’t found, a manual add option is provided as a fallback, ensuring flexibility without breaking the flow.

The Experience

These are a few screens from the onboarding portal where patients can quickly verify their details and move to the next step. If any information is missing, they also have the option to add it seamlessly during the flow.

My Learnings 🏆

  • Patients trust guided flows. Breaking it into steps reduced overwhelm.

  • AI Improves speed, but fallback is essential.Manual entry/upload options ensured inclusivity.

  • Design for elderly users. Large inputs, plain language, and minimal steps increased adoption.

  • HIPAA Compliance guided every decision. Security and privacy were embedded into UX.

Create a free website with Framer, the website builder loved by startups, designers and agencies.