Zara: A Usability Case Study – uxdesign.cc

Zara is one of my favorite clothing brands, but I run into problems every time I use the app. Although I am not affiliated with Zara, I wanted to figure out if other users were having similar problems. I decided to conduct usability tests, which led me to discover multiple pain points and redesign part of the experience.

Empathize

User Personas

The first step I took was perform online research around Zara’s customer-base. I then created a couple of provisional personas to cover the hypothesized, largest group of customers: professionals in their 20s and 30s and in the middle-upper income bracket.

Job Stories

In addition to personas, I also spent some time understanding the context surrounding the users when they use the app in order to further understand their motivation and desired outcome.

Usability Testing

With a better understanding of the user, I went to a mall with a Zara store and selected mall-goers to perform guerilla usability testing. I sampled people to test and verified that they were at least frequent online shoppers prior to beginning the testing. I ended up testing seven users.

Each user was asked to imagine he or she was in a scenario and to perform a series of tasks such as:

  • It’s been cold lately and you’re looking for a winter coat. What do you do?
  • You see a coat you might like. Can you walk me through how you would decide whether this is a coat for you?
  • You added the coat to your cart, but you realize the size is wrong. How do you fix that?

Define & Analyze

Affinity Map

I reviewed recordings of the testing-sessions carefully and laid out the problems and complaints that each users had. I then used affinity mapping to organize and group these pain-points into categories.

2×2 Analysis

To help prioritize the issues, I used a 2×2 map to help rank the category of issues by how important they are to the business (x-axis) and to the users (y-axis). Assuming that the main business goal for the app is to drive up mobile revenue, I decided that the pain-points around editing cart-items were the most important to the business and users. Thus, those were the issues I scoped into my redesign.

Define Problem

I closely analyzed users’ behavior and patterns related to the shopping cart in order to come up with solutions.

When trying to edit an item in the cart:

  • Only 1 out of 7 did so without problem
  • 6 out of 7 users tapped the item, which only brings up a picture
  • 4 out of 7 users tried swiping left on the item, which doesn’t bring up the edit option
  • 2 out of 7 users accidentally deleted their items

Other issues:

  • There is no way to edit the size or color of an item in the cart, which means users would have to browse for the item again
  • Users cannot see more than one picture for items in the cart

Ideate & Create

Lo-Fi UI Sketch

After reviewing the issues surrounding the shopping cart edit flow, I mapped potential solutions to each of the pain-points and created rough UI sketches to encapsulate the solutions.

Hi-Fi Mockups

Before diving directly into prototyping my design, I performed preliminary validation by walking through the Lo-Fi UI sketches with a few more online-shoppers. I received some good insight and incorporated them into the final design.

Please see my proposed solutions below:

* — The new ‘edit’ button replaces the old ‘buy later’ button; however, this was an intentional choice. Previously, when users wanted to save an item for later, they could only do so when an item is in the shopping-cart. I would add the ‘save-for-later’ function to the product-browsing flow so that users wouldn’t have to move an item into the cart before bookmarking.

Author: William Ng

Collect by: uxfree.com

Comment

Top