JD UK - Size Guide
Introduction
Shopping for garments should be a pleasant experience and the last thing a consumer wants, is for their garment to arrive and be in the wrong size and have to return them. This is where size guides are a key tool in the purchasing journey.
Project brief: I was tasked to look at the existing size guide on the JDUK product details page and identify pain points for users as well as potential risks for the business. Using these insights and those validated by insights gained with the UserTesting platform, to determine ways of making the experience more intuitive.
My role: Sole UX designer
Team: UX designer, User researcher
Time frame: 2 weeks
What I did/ deliverables : User Journey maps for web, iOS and Android, Workshop, Low and Mid fidelity wireframes
Tools: Microsoft Excel, Miro, Adobe XD
User journey maps
I user journey mapped the scenario of a returning user adding an item of their size to their basket.
I looked at scenarios in which users may look for items of well known brands as well as more niche brands to try and cover as many scenarios as possible.
JD apps and devices shared different processes and where a pain point may occur on one device, it may not affect customers using other devices. For this reason I mapped the respective journeys for the following.
Desktop
Mobile
App (both iOS vs android journeys)
Using insights from the User journey maps and usability tests conducted by the user researcher via the UserTesting platform we were able to deduce the following.
Defining the problem
The problems
Users having to sift through an accordion pattern to find the right size guide,
Some brands not being listed, and inconsistent information and units on the size guide tables. These issues can lead to uncertainty and a negative experience for the user, who may need to use guesswork or purchase multiple sizes.
Additionally, the current behavior of the add-to-basket button pushes users to the checkout, making it difficult to add a second option.
Risks for the business
The business faces risks related to the use of 3rd party True fit, which can cause confusion for users and take them away from the purchasing journey.
Users ordering multiple sizes with the intent of returning items poses a threat to the business in terms of money and effort.
Workshop
In order to begin ideation and come to a solution that would solve the user problems identified, I facilitated a workshop to define user needs which we then used to create how might we statements to aid ideation.
User needs
-
User need 1
As a shopper, I need to know what size would fit me in the item I want so that I can feel confident that the item will fit me and I won’t have to send it back/ exchange later
-
User need 2
As a returning shopper, I want to save my sizing information so that I can save time and feel reassured that the item will fit me based on the measurements I have provided prior
-
User need 3
As a returning shopper I want to have my size recommended to me based on the information I have provided previously
How might we…
-
reduce friction for users when searching for their brand-specific size guide
-
help users pick the right size for them
-
assist users in selecting the right size when we do not have the brand-specific size guide in our database
-
reduce friction when users use Truefit and opt to save their details
Ideation
User flow Diagram
Using the input from the "How might We" discussion, I used these to create 3 ideas for how user journeys could be made simpler and cut out unnecessary steps.
The main takeaway from this was that when users click on "size guide", we should be displaying the brand specific size guide where we have it on our database.
Where this is not possible and we do not have the specific brand's guidelines, users should be able to make sense of the data displayed at a glance. This would mean displaying measurements in units they understand.
Sketches
I produced some sketches around the following concepts:
a short form that a customer can use to input their measurements and having our system suggest a suitable size which would allow the user to avoid scouring through data tables.
providing a way to control measuring units displayed on a size guide table - allowing a toggle component to switch between cm and inches would allow users to choose the unit they are comfortable with and know.
rethinking the accordion pattern to skip users directly to the table specific to the item they are considering ( NIKE > MENS> TOPS)
Mid fidelity wireframes
After deciding on a solution that solved the user needs and problems identified, I presented some mid fidelity wireframes in Adobe XD to senior stakeholders. The feedback received was positive but considerations around resource and technical feasibility meant that further consideration was required to push this forward.