Prescription Card

Before

After

Company

Truepill

Timeline

3 sprints - 6 weeks

Roles

Project Lead
UX Designer
Software Engineer

Project Overview

I led the redesign of the Prescription Card—the core UI component patients use to review their medication and place an order—within an online virtual pharmacy. The card needed to present essential details such as prescription name, status, RX number, refills, pricing options, savings information, and messages in a compact, mobile-friendly format. I owned the initial redesign, iterating with a senior UX designer to refine information hierarchy, labeling, and mobile behavior. Once aligned, I translated the Figma designs into implementation-ready work by breaking the UI into React components, creating detailed engineering tickets with states and acceptance criteria, and leading a four-person team to build and document the components in Storybook.

Why the redesign was needed

The redesign was driven by recurring pain points uncovered through customer support feedback. Users often struggled to understand their pricing options, weren’t always clear on how payment methods were applied, and frequently missed out on potential savings. These gaps created frustration, unnecessary support calls, and a lack of confidence in the ordering process.

User Personas

Age and Occupation

Background

Tech Proficiency

Goals

Pain Points

50, Freelance consultant

Lives paycheck to paycheck, uninsured, and very price sensitive.

Moderate

Clearly see the lowest-cost option for his prescriptions.
Understand exactly what each price represents and how it’s calculated.
Avoid “sticker shock” when unexpected prices appear.

Confused about why prices change between refills.
Doesn’t always realize when a savings card is available.
Skeptical that the displayed price is the final cost.

35, Software engineer

Very comfortable with technology, expects efficiency and clarity.

High

Quickly scan prescription details without extra clicks.
Compare insurance vs. retail pricing at a glance.
Refill from her phone during a busy workday.

Annoyed when critical information is hidden behind scrolling or unclear labels.
Doesn’t want to call customer support for clarification.
Wants transparency about how pricing is generated.

73, Retired

Takes multiple daily medications and prefers phone calls or in-person interactions, but is trying to use the online pharmacy at the encouragement of his daughter. Limited exprience with smartphones and online tools.

Low

Refill prescriptions without needing to call customer service.
Trust that the information shown (pricing, refills, discounts) is correct.
Keep the process simple and straightforward.

Low confidence navigating websites and mobile apps.
Gets overwhelmed by too much information on the screen.
Unsure which buttons to press or which price applies to him.
Frustrated by scrolling and small text on mobile.

Where We Started