Mirror

EatWell case study banner

Overview

Although Mirror has had success in their brick-and-mortar stores, they do not have any online presence. As a result, they are missing out on a large customer base. Customers are tired of going to stores and not finding their right size. They want the convenience of online shopping. Without an e-commerce website, Mirror will fall behind their competitors.

Role

UX Design - discovery, user research, prototype and testing

Duration

4 weeks

Jump to Solution

Research

Competitive Analysis

H&M

Strengths

  • Large selection of items
  • Affordable
  • Simple website UI

Weakness

  • Fast fashion
  • Questionable quality due to cost

Zara

Strengths

  • Large selection of items
  • "Higher end" fashion
  • Good use of whitespace

Weakness

  • Unnecessarily complex navbar
  • Limited to certain body types

Uniqlo

Strengths

  • Large selection of items
  • Affordable
  • Unique collaborations

Weakness

  • Fast fashion
  • Website feels very cluttered

User Interviews

Key Findings

  • More likely to shop online if the return policy is lenient for the customers.
  • Sustainability is an important consideration when looking at a new company/store.
  • Users get frustrated when they go to a physical store, and they are out of stock of items.

How might we help create a thoughtful and enjoyable online shopping experience?

Persona

Based on my research the target user group would be 23 - 36 years old conscious about where they shop. They value sustainability, affordability and convenience when it comes to purchasing clothes.

Ideate

Scenario: Customer purchases a men's windbreaker through Mirror's website

Lo-Fi Wireframes

In my research I found that users like their clothing brand websites to have good use of imagery displaying their products. Having a large hero section with a clear CTA keeps users informed of any special sales/promotions happening at the time.

Nowadays a large portion of browsing and shopping are all happening on mobile or tablet devices. Therefore, having a responsive website is critical to make sure that those users get the equal modern and intuitive experience.

Style Guide

Hi-Fi Wireframes for Testing

Using neutral colors and good product images Mirror's women's page displays the content in an organized grid. Users can then filter the results using the respective options displayed on the left tab of the page. A black circle indicates the current section of the page being displayed (in this case, "New Arrivals").

Product page uses large model photo to display the item. During the user interviews a pain point that frequently came up was when clothing stores don't have enough information for the users. From this page users can get store availability, details on how to take care of the item, shipping & return policy and reviews. All of these are critical information users consider when making online purchases.

Testing

Usability Testing

With Maze and Zoom I observed 6 users navigating my prototype to complete different tasks. This allowed me to gather what worked and any pain points or opinions they had on the prototype. The participants all had prior experience with online shopping.

Users were able to navigate the website and find a product with a 100% success rate.
The overall feedback on the design of the website was favorable with no outstanding flaws.

Priority Revisions

Based on the usability testing and general feedback there were a few iterations made to the design

During the observation I found that 100% of the participants prioritized the search feature when they were asked to complete a task of finding and purchasing a product. With this in mind, I added an autocomplete & suggestions feature that streamlines this process.

Users requested for a more detailed order confirmation page that shows the order details and summary. I also added an option for users to sign up for an account incentivizing registration with special discounts and rewards program.

View Prototype

Next Steps

Based on user feedback, if given more time for the project there are some features, I'd like to implement.

  • Different plan views. Being able to change the calendar view to monthly/week/daily.
  • User profiles & group. If the user is prepping meals for more than just themselves there will be a way to switch profiles that displays that user's specific portion sizes based on their caloric & macro needs.
  • The recipe section displays the necessary cookware for the meal.
  • Creating/adding your own recipes from scratch.