Zara

Enabling users discover outfits that pair well with their favorite item

When I upload a photo of white jeans into Zara's IMAGE SEARCH function, it brings me more white jeans. But I already have white jeans. What if Zara tried to sell me other items that pair well with it?

In this project, I designed a new function to the Zara app, that shows the user possible outfit combinations that pair well with an item of their choice.

No more mismatching clothes and wasting time contemplating what to wear.

Click to interact with the prototype

Client

Zara (self-initiated)

Project type

New feature for mobile app

Methods

UX research, UX design

Tools

Figma, Whimsical, Zoom

Introduction

Whenever I’m getting ready to go out, I always find myself wasting time trying to create a visually appealing outfit. Sometimes the only pair of pants that go well with my favorite shirt are dirty, and I find myself thinking “why didn’t I purchase another bottom that go well with this shirt, just in case?”

My main goal in this project was to add a feature to the Zara app that would help people to create their outfits quicker, and to purchase clothes that go well with the items in their wardrobe.

Problem statement

As the number of items in a wardrobe increases, the amount of possible combinations increases as well. This may cause overthinking and indecision when a person is choosing what to wear, or when they go out shopping for clothes that go well with the items in their wardrobes.

It is possible that a feature added to the Zara app can address this problem and help users purchase matching outfits quicker and easier.

Research goal

"To discover the thought process and influencing factors while (1) people shop around for clothing, and (2) decide on what to wear before specific occasions, to define a feature to add to the Zara app which will assist people in their decision making process, which in return will increase customer satisfaction and sales."

Process

Research

I focused my research mainly on interviews to figure out the problems people face when shopping for clothes.

The objectives of the interviews were to:

  1. Determine the target demographic that shop at fast fashion retail and are conscious about how their outfits look in public. 
  2. Lay out the thought process of a person when they think about what to wear while getting ready on a regular day vs a special occasion.
  3. Lay out the thought process of a person when they have to purchase an item of clothing that has to match with an item in their wardrobe. 
  4. Discover the factors that inspire people to purchase an item of clothing.

I grouped my findings into two personas. While one persona prefers planning her outfits the night before, the other prioritizes owning lots of clothings to avoid being caught short-handed when getting ready in the morning. They are both binge shoppers.

Assumptions

I assume that most people are conscious about how they look in public, and spend a measurable amount of time trying to match their outfits while getting ready, which creates grounds for a problem to address.

Interaction design

To identify the most suitable location to place the feature, I mapped out the entire Zara app. I’ve identified two locations the feature could be located:
1- under the main menu,
2- next to the search function.
The final location was determined by the results of the usability testing.

I planned the primary task flow of this app feature around a user who taps on the new feature in the Zara app, enters their body measurements, uploads their favorite item to view related outfits available in their size, and purchases the ones they like.


Usability testing and fixes

I conducted 4 remote monitored usability tests through Zoom. Here are some of the findings from the usability testing:

3 out of 4 users expected the feature to be located under the MENU button.

European users were not familiar with US bra sizes. Different geographical bra size options should be added.

3 out of 4 users found re-selecting the size after completing the wizard redundant, but would like to see a subtle option to change it when desired. Product pages need to show current/recommended sizes before adding the item to cart.

Also, one user pointed out that even though the entire process is aimed at women, some women may be wearing from the men’s section and may not be able to use this feature right now. The feature needed to be more inclusive.

I then created an affinity map to lay out the recommended fixes and a priority matrix to evaluate their cost vs. effect.

Learnings from the project

Adhering to a company’s design language is essential for product harmony. Even if a better UI system seems possible, today is not the time to implement.

Dividing an unconventional and complex form input into smaller steps prevents the user from getting overwhelmed.

Food for thought: Gender stereotyping in retail

To my ignorance, a female usability test participant pointed out that sometimes they shop from the men’s section too, but my prototype did not let her view men’s outfits. That’s why I added a gender selection area to the body measurement input flow so now the feature can address everyone.

Have questions?
Want to work together?
Let's get in touch.

armankirim@gmail.com

Works