Mirror
Background:
​
Mirror is a large clothing store chain providing clothing in different styles for both kids and adults. Mirror has acknowledged the fact that they have plenty of remaining inventory in their warehouses that are very difficult to move for which online selling would be great. Mirror is all about having clothing accessible for everyone with good prices and a variety of styles.
Roles:
I assumed the following roles designing this app:
-
User Experience (UX) Designer
-
Interaction (IxD) Designer
-
User Interface (UI) Designer
-
Visual Designer
Objective:
Design a responsive e-commerce website for Mirror.
Rebrand Mirror to attract people who re attempting find trendy clothes which are causal and laid back, but not limited to the wealthy. The goal was to create a strong rebrand with a clean, modern and timeless aesthetic targeted towards a younger audience.
Deliverables:
Interaction Design:
High-fidelity interactive prototypes for key tasks on iOS
UX/UI Design:
-
Competitive analysis
-
User surveys and one-on-one interviews
-
Personas
-
User journeys and task flows
-
Site map
-
Low-fidelity wireframes
-
High-fidelity mockups and prototypes
-
Design system and UI kit
-
Usability tests and findings
Competitor Analysis:
​
My research first centered around the competition space in order to understand how other brands are addressing similar issues. I analyzed the design and flow of the most popular online clothing stores, as well as patterns and consistent features present on these platforms.
Key Research Findings
​
5 participants were interviewed in order to learn user preferences, to understand the process of shopping online and to understand the desires and frustrations of online shoppers. Some of these questions included:
When do you usually shop online?
What types of clothing do you feel the most comfortable buying online?
How long do you usually spend looking for clothes online?
What information do you need before you feel comfortable making a purchase?
Can you describe a negative experience you had shopping online?
Have you ever returned clothing that was purchased online and why?
What would make you feel more comfortable buying clothes online?
User Persona
​
After I compiled the outtakes from the research into the affinity map, I was able to create a persona that represents the main user group.
Creating Structure​
A survey was done to find user preferences for online shopping.
Then, a UX site map was created to identify the main pages and flow for the site.
Low-Fidelity Wireframes
Low-fidelity prototypes were created following the user interviews and site map exercise to develop the structure of the site.
Prototypes
High-fidelity prototypes were created to allow users to complete a purchase and check out.
Sampling of UI Kit
Lastly, a User Interface Kit was created with the components and styles of the new Mirror site.
Lessons Learned
An ecommerce website needs to make the shopping experience as effortless and simple as possible for users to come back. I had to understand how to guide the customer from wherever they land, to the product page in order to add something to the basket.
To this end I realized that Call To Action elements need to have the most visual weight on the page, be uniform and lead the user down the path from browsing the product catalog, adding individual products to the cart, and successfully finishing the checkout. Similarly, the check out process needs to be simple, clear and provide various methods of payment.