Work: Healthcare · Retail and pharmacy

Shopping and prescriptions, on every screen.

Organization
CVS Health
Platforms
Desktop · Mobile web · iOS · Android
Products
CVS Shop, Prescription Delivery, CarePass
Role
Product design, UX strategy, UX, UI, research
Timeline
5 years

Explore cvs.com/shop (opens in a new tab)

The work

Product design and UX leadership for CVS Shop and prescription home delivery, across the web and native apps.

15–20%

More customer purchases in the CarePass pilot, the membership program the pricing work was designed for.

50+

Releases shipped across desktop, mobile web, iOS and Android.

5

Designers mentored.

1

Design system managed for CVS Shop.

Research

Six retailers, one honest comparison.

A 49-page deep dive into the mobile-web product listing and product detail pages of Amazon, Walmart, Walgreens, Target, Wayfair and CVS: how each is structured, which components come first, how far the key actions sit and how fast each page loads. CVS did well on design and sat mid-to-low on speed; the findings became a set of recommendations.

Product listing page: initial load to finish, in seconds

Lower is better

Product listing page: initial load to finish, in seconds
RetailerInitial load to finish
Amazon1.24–5.03s
Walmart2.80–11.99s
Walgreens1.11–8.70s
Target3.73–3.94s
Wayfair2.33–5.52s
CVS5.52–6.94s

CVS was the slowest of the six to start loading, at 5.52 seconds. It finished at 6.94 seconds, in the range Google’s research ties to bounced sessions.

What it recommended

Product listing (PLP)

  1. Keep filtering and sorting to a single row.
  2. Redesign the listing tile for a clearer hierarchy.
  3. Make star ratings bigger and bolder: they build trust.
  4. Make the whole tile tappable, as Amazon and Walmart do.
  5. Give filters only the space they need.

Product detail (PDP)

  1. Establish trust at the top: room for ratings and reviews.
  2. A larger product image, to confirm the choice.
  3. One or two ways to use the image carousel, no more.
  4. Clear color and count selectors with an obvious “on” state.
  5. A large price.
  6. Quantity separate from the primary “Add to basket” button.

Usability research

Same ingredients, better value. Would they choose it?

A “Compare & save” module on the product page put CVS Health’s own vitamins beside the national brand. Ten shoppers, five on desktop and five on phones, took the whole path in unmoderated tests: search, product page, add to basket, cart. The aim was to see what moves someone to the store brand: the price message, the image, the CarePass price and the module’s size and placement.

  • 90%chose the CVS Health store brand over One A Day once the two sat side by side.
  • 9 of 10called out the $5.30 they saved, the moment the basket confirmation opened.
  • 80%rated a zoom on the product image 5 out of 5: they wanted to read and compare the ingredients.
  • 6 of 10asked for the ingredient list inside the module.

“I saved $5.30, which is awesome!”

Tester
The basket confirmation. Nine of ten testers said the saving out loud as it opened.
  1. Takeaway I

    Let people read the label.

    A sharp image did real work: shoppers zoomed in to judge the store brand’s ingredients against the name brand’s, one of them before anyone asked.

    “You need to be able to compare ingredients, and those products are very tiny print.”

    Desktop tester
  2. Takeaway II

    Name the saving.

    Same ingredients, lower price: the direct callout of the discount decided it, and CarePass pricing gave one more reason. Repeating the saving in the basket landed too.

    “I would choose CVS because I like to save money.”

    Mobile tester
  3. Takeaway III

    Price, then ingredients, then reviews.

    What mattered, in order. The testimonial in the module mattered least; two testers found it no help next to the rest.

    “I need to make sure I save a significant amount compared to the brand name.”

    Mobile tester
  4. Takeaway IV

    Make it stand out.

    Two of five desktop testers missed the module at first: it blended into the brand’s own content. It needed to interrupt the page.

    “The ‘Compare & save’ text is too small. The section needs to pop out more.”

    Desktop tester

From feedback to direction

Choose CVS because the deal is right there.

A concept for CVS Shop: choose a shade and a quantity right in the results, see each deal and the CarePass shipping perk on the tile, and watch the savings add up on the way to checkout.

Try it — change a color or quantity, tap an image to zoom, add to the basket, check out.

Shop

  • Maybelline Color Sensational The Creams, Cream Finish Lipstick Makeup

    by Maybelline

    $9.99

    $5 ExtraBucks Rewards for purchasing 2 Maybelline cosmetics

    Ships Free With CarePass
    or on $35+ orders

    Color
    Qty

  • Maybelline Superstay24 Color Lip Color

    by Maybelline

    $12.49

    Ships Free With CarePass
    or on $35+ orders

    Color
    Qty

  • Maybelline Baby Lips Moisturizing Lip Balm

    by Maybelline

    $5.79

    $4 ExtraBucks Rewards for purchasing 2 Maybelline cosmetics

    Ships Free With CarePass
    or on $35+ orders

    Color
    Qty

$12.00 in savings + free shipping with CarePass

I

Prescriptions, from store to door

Before the screens, the system: how a delivery order moves through a store — prescription only, or with front-store items, filled in full or in part — and where the patient needs to hear about it.

13

Decision points, from choosing delivery in the cart to the order reaching the door.

24

Customer touchpoints: SMS, push and email across nine order moments, from Rx ready to delivered.

9

Swimlanes: five channels, the shared screens, the store, the courier and the customer.

30

Minutes on the store’s clock once an order is received.

Scope

Next case study Open Learning, at MIT scale

Start a conversation