Archive

An in-house digital destination that customers can search through to find active in-production styles similar in fit to their favorite Levi Jean

My role

UX Designer, Visual Designer, Interaction Designer

Team

Joanna K. -UX Designer

Joana C. -UX Designer

Luisa R. -UX Designer

Alex A. -Front End Developer

David D. -Front End Developer

Mindy M. - Marketing

Tools

Figma, Photoshop, Illustrator, Asana, Figjam

Overview

The Levi Strauss & Co. Denim Decoded Hackathon was a competition open to the public for the first time that gathered 12 startups and visioners to generate innovative and scalable business solutions that enhanced the online shopping experience.

Our team was the only one created from scratch in the first few days of the hackathon, and it competed against teams that have dedicated years to the size and fit problem faced by the clothing industry.

Problem

42% of online returns are attributed to fit and size, which continue to be one of the primary reasons for returns

People are disappointed when they buy a product that doesn't fit.

1 in 3 Levi customers return items they purchased the online store

Solutions

Help comsumers indentify their right size

Increase consumers's satisfaction

Decrease the % of online returns

Market research

The first step was to understand the needs of customers shopping online and learn about their problems related to shopping and returns. My goal was to determine how we could help Levi's customers of all shapes and sizes to find products that match their style and fit preferences confidently.

Although there is a demand for AR tools, 88% of shoppers still depend on photos, reviews, descriptions, and sizing guides.

Source: Narvar Customer Returns Study, 2021.

Understanding the users

After reviewing market research and conversations with Levi's team, I conducted user interviews to gather qualitative and quantitative information on people's online shopping.

I conducted three in-person and one virtual user interview to gain perspective from current and prospective Levi Strauss & Co. customers located in the US.

I compiled all the data received into an affinity map. This gave us insights and common trends for users. As a team, this was key to prioritizing our design.

Levi's customers

User interviews

24-38

Age range

Interview insights

It’s tricky because it also goes hand in hand with the body type, not everything looks good on every body type.

Still finds it difficult to shop online because dimensions vary so much.

I would like to have easier and faster options to buy jeans than finding measurement charts.

I wouldn't feel comfortable taking pictures of myself to use an AI/AR tool because I don't know where else this data will be used for.

Key findings

Who are we designing for?

Based on my research conclusions, I created a user persona to help establish the problem that needs to be solved, focus and inform our design decisions, and further empathize with our users. Persona Returning Customers emerged from our affinity map.

Customers shop for items on the online store with a general fit and style in mind, usually the exact fit and style as their current Levi jeans. There is a general confusion about different styles, and most customers shop for themselves.

Levi's customers struggle with picking the right size and fit without the physical experience of the product.

Ideation/ Reality

Our focus had been primarily on finding solutions to find the best fit for all clothing products, including shirts, jeans, and jackets. However, we focused only on jeans due to time constraints and limited access to Levi's design guide.

We devised an in-house solution called "Archive," where Levi's customers can scan or plug in their best-fitting jeans' product code (PC9) and find similar jeans by fit, color, material, etc.

First-time customers can input their measurements on the archive page and receive recommendations based on their desired fit, color, etc.

Flow diagram

To outline all the necessary functionality, I created a simple diagram of the main task that Levi's customers can do. One of the flows below is dedicated to returning Levi's users who want to find the best-fitting jeans on the website as quickly as possible.

Low-fi wireframes

Once the flow diagrams were established, I started creating the low-fidelity wireframes for all of the flows. The screens below have been created for returning Levi's customers.

Usability test result for Lo-Fi wireframes

I facilitated 3 rounds of usability testing, each with 5 tests, to discover any issues that might arise for the users in the proposed prototypes. This was tested on the Maze platform, where I introduced the user to the app and asked questions regarding the tasks.

77%

Set up preferences to receive personalized recommendation

70%

Finalized purchase of a recommended product based on tag

58%

Found a product that they like and is close to their size.

Style Guides & Assets

In preparation for the high-fidelity prototype, I studied Levi’s website and native mobile app to create a style guide. I discovered that the site is product-image-heavy, has very few illustrated graphics, and primarily only uses red and shades of black throughout the site.

With this in mind, I created a logo and icons for Archive that match the style and colors of the existing UI kit.

The Algorithm

I collaborated with developers to create an algorithm solution using data provided by Levi's team. Because of the proprietary data we received, I presented only a part of the outcome.