Warby Parker

Eyewear product details page (PDP) redesign

A high-impact page designed around the intricacies of eyewear shopping, considering both its fashion and essential medical role in daily life.

Brief

1/3

Optimize eyewear shopping & adapt to business demands to boost sales

The details page, designed 9 yrs ago, falls short of growing business needs and inefficiently presents essential eyewear details. I redesigned the page to empower customers to make well-informed decisions around style and medical function to increase sales conversion.

Role

Lead Product Designer

What I did

UI/UX

System design

Motion

Platforms

Web

iOS

Function, UI & brand presence

Function, UI & brand presence

Function, UI & brand presence

Components that lead with utility while preserving the visual and brand integrity of our existing design system.

Components that lead with utility while preserving the visual and brand integrity of our existing design system.

Components that lead with utility while preserving the visual and brand integrity of our existing design system.

Solution

2/3

Design for the shopper’s initial goal: To validate style

Building on past UXR insights, a shopper’s initial focus is style and self-appearance. I improved image discoverability (model and user-generated) and try-on options to boost validation.

Highlight a broader range of imagery

Highlight a broader range of imagery

Highlight a broader range of imagery

Utilizing model/product photography thumbnails and introducing user-generated content fosters engagement, authenticity and trust to boost product validity.

Utilizing model/product photography thumbnails and introducing user-generated content fosters engagement, authenticity and trust to boost product validity.

Utilizing model/product photography thumbnails and introducing user-generated content fosters engagement, authenticity and trust to boost product validity.

Access try-on avenues with ease

Free home trials, virtual try-on, and store expansion offers business advantages and provides shoppers with versatile options at home or in-store.

Access try-on avenues with ease

Free home trials, virtual try-on, and store expansion offers business advantages and provides shoppers with versatile options at home or in-store.

Design for the shopper’s next goal: To validate fit

Once style preference is confirmed, a shopper validates if the frame fits their face width and shape. I improved browsing efficiency of width details by utilizing a dynamic and guided experience.

Promote real-time width availability

Displaying width on the hero enables real-time availability of width and Home Try-On based on selected style, ensuring customers understand all options upfront.

Guide shoppers to easily identify width

Web shoppers are guided through measurement details and “find your width” options, while iOS uses TruDepth to auto-scan face width and provide recommendations.

Promote real-time width availability

Displaying width on the hero enables real-time availability of width and Home Try-On based on selected style, ensuring customers understand all options upfront.

Guide shoppers to easily identify width

Web shoppers are guided through measurement details and “find your width” options, while iOS uses TruDepth to auto-scan face width and provide recommendations.

Design for the shopper’s last goal: To validate budget & prescription

With style and fit confirmed, a shopper shifts to price based on their prescription and lens preference. I elevated transparency around Warby Parker’s competitive prices along with all prescription and lens offered.

Highlight key offers included in base price

Highlight offers, like single-vision, insurance and free shipping/returns, in the base price to attract budget-conscious shoppers with common prescriptions.

Easily access all offerings & prices

Provide clear details on all prescription options, lens offered, and associated costs for easy validation for shoppers with complex prescriptions and higher budgets.

Highlight key offers included in base price

Highlight offers, like single-vision, insurance and free shipping/returns, in the base price to attract budget-conscious shoppers with common prescriptions.

Easily access all offerings & prices

Provide clear details on all prescription options, lens offered, and associated costs for easy validation for shoppers with complex prescriptions and higher budgets.

Design for a shopper’s common issue: Using an expired prescription

Glasses shopping with an expired prescription is common but legally not allowed with lens creation. I utilized the growing vision services to push shoppers to get a new prescription in-person or virtually.

Services tailored by device and locale

Providing a personalized and convenient experience by tailoring in-person and virtual self service eye exams (Virtual Vision Test app) based on device and locale.

Services tailored by device and locale

Providing a personalized and convenient experience by tailoring in-person and virtual self service eye exams (Virtual Vision Test app) based on device and locale.

Results

3/3

16%

lift in sales conversion

7%

lift in Home Try-On conversion

9%

lift in add to cart completion rate

Next: Warby Parker - Checkout

View project