top of page

Size and Fit PDP Redesign

Matches
Screenshot 2023-10-07 at 10.43.29.png

Overview

Matches wants to completely overhaul all the size and fit information on our product display pages. This includes the size selector, size and measurement guide, and the Size and Fit accordion information that you can see in the banner image above. 

Role

Product Designer

Platforms

Desktop
Mobile

Skills

User research
Customer interviews 
UX/UI (using Figma)
Presenting

The Problem

Matches wants to significantly reduce returns caused by size and fit issues, decrease customer care queries regarding size and fit, and increase add-to-bag rate from PDPs. 

The Outcome

Pending...

How we're getting there

The process
Screenshot 2023-11-01 at 15.17.28.png

Analysis of current S+F information on PDPs

Screenshot 2023-10-07 at 11.55.57.png
Screenshot 2023-10-07 at 12.07.34.png

Analytics

We spoke to a Data Analyst and found out, for users who visit a PDP:
 

  • 25% expand the size selector dropdown​

  • 5% expand the Size & Fit accordion​

  • Size and Fit is the most opened accordion (50% of opens, vs 40% Details)​

  • 5% open the size guide (3% on iOS app)​

  • Add to Bag rate from PDP is 18% overall; 35% for users who open the size guide​

  • Conversion rate from PDP is 2.14% overall; 6% from customers who open size guide​

Screenshot 2023-10-07 at 11.13.59.png

Return reason analysis:

​

The top return reasons that are selected on our returns portal are:

  • Too big

  • Too small

  • Other

  • Ordered more than one size​

Screenshot 2023-10-07 at 11.23.36.png

Customer Care analysis:

​

Matches has an average of 10 size and fit queries per day, of these 1/3 are about item measurements.

​

In the table we can see the most popular themes from Jan - Sep 2023.

​

In May 2023 Matches stopped including item measurements for all products apart from those sold by their in-house brand Raey. Since then the number of measurement queries has gone up.

​

Screenshot 2023-10-07 at 11.39.22.png
Screenshot 2023-10-07 at 11.36.10.png

Competitor analysis

First I produced a large deck of research on areas we wanted to improve upon by looking at what our competitors and other retailers do. I included good and bad examples (so we know what not to do). Here are some example slides.

I looked specifically at:
 

  • Size recommendation statements

  • Fit information

  • Model measurements 

  • Size selectors

  • Size guides

 

Customer interviews

Next I helped carry out 10 interviews with our female customers, to get their understanding on size and fit phrases asking questions such as, "what do you think this means?" and "what size would you buy based on this statement?". Here are a few examples of the statements we asked them to explain. 

 

We found out

  • There isn’t a single piece of information that’s useful to ALL customers

  • Customers with a body type similar to the model tend to use the model information

  • Sizing information can be misinterpreted and will mean different things to different customers. For example, ‘Choose your regular size’ can cause confusion as customers aren’t sure whether to choose their usual size for that brand or their usual body size. 

  • True to size is especially confusing as some customers think it means ‘regular fit’

  • Size up or size down tends to be more understood as there’s a clear action

  • Longer instructions that require thought could result in the customer exiting or buying 2 products

  • Fit information is generally understood and appreciated

  • Certain terms have the potential to alienate some customers. Slim fit was a sensitive term. 

Actions

  • Remove neutral statements. Only give actions of size up or down.

  • Add more fit statements, e.g. 'Designed to be worn for an oversized fit'

How might we?

Simplify and improve the sizing information in our PDP via UX improvements, consistent and clearer sizing information, and reactive feedback.

Initial design ideas

Here are a few sketches and initial ideas I made in figma that address each of the exploration areas:
 

  • Size recommendation statements

  • Fit information

  • Model measurements 

  • Size selectors

  • Size guides
     

One of the challenges was not being tempted to add too much information at the top because then nothing will standout. So, next we needed to decide what information will be near the size selector and what will stay in the size accordion below. 

Design ideas: Iteration 2

In this iteration I thought about designing the size selector as a bottom drawer and putting the size recommendation advice at the top as it gives more space and means the user should definitely see the message with it being in the same component. 

​

Another challenge was deciding where to put the size guide button, what information to put in the Size and Fit accordion and how much to show upon landing on the page. What we don't want, is to push the content below too far down. 

​

I also looked out how we could simplify the size and measurement guide even more. 

Previous

Next

bottom of page