Mirror Gold.png

Mirror

Mirror

Making a global brick-and-mortar store come to life
with responsive design

Mirror Banner.png

The Scope

Mirror is a fictitious global clothing chain, with over 400 stores around the world in 32 countries. 

The Challenge

While they are very successful offline, it lacks a much-needed online presence, as their current one has only outdated information and no useful content. Mirror also needs a new modern logo, that better represents the brand. Their brand message is neutral, modern, fresh, clean, and clear.  We wanted a responsive e-commerce site that would be easy to use and allow users to browse and filter by size, color, style, etc.

Type
Responsive Design

Role
Research
Information Architecture
Interaction Design
UI / UX Design
Usability Tests
Iteration

Timeline
5 weeks

 
 

Research

Research Goals

To empathize with users on:

·      What motivates online shoppers to shop online rather than in store? How can we meet these needs and desires?
·      What are some pain points when it comes to shopping online for clothes? What are some things we could do better?
·      What makes an online shopping experience delightful?

Research Methodologies

·      Market Research & Competitive Analysis -to see the existing standards, current trends, and opportunities for improvements; for inspiration
·      Contextual Inquiries -to be able to gather firsthand knowledge in user interaction with existing online clothing websites
·      Interviews to gather qualitative data in the users' own words/description

 

Market Research & Competitive Analysis 

 

Empathize

Contextual Inquiries & Interview Summary

Because the target users of Mirror were going to be college students to young professionals (age 18-25), I interviewed and observed a total of 5 participants at a college campus nearby. They were first asked questions about their shopping habits, needs, wants, and pain points, then browsed their favorite online clothing stores on their own laptops as they thought out loud for me to ask more questions.

20171206_145014.jpg
20171201_134106.jpg
20171206_142340.jpg

Needs

·       Users need good filters – 4 out of the 5 participants used filters and categories actively throughout the process. Some of them like certain websites solely because they have better filters than others. Users want to be able to narrow down their options.

·       Users need a better way to tell quality – 4 out of the 5 participants prioritize quality. Some of them had to return items with poor quality/defect. They want to be able to tell quality more accurately online.


Wants

·       Users want to see frequent sales and discounts – 4 out of the 5 participants go on websites whenever there are sales. 4 out of the 5 look out for email promotions and click on them to see what’s on sale.

·       Users want more reviews – 4 out of the 5 participants rely heavily on reviews. They would want reviews from other buyers to be able to tell the style, quality and sizing better.

·       Users want an organized website – 3 out of the 5 participants liked organized websites with good filters and neat appearance.


Pain Points

·       Shipping – 3 out of the 5 participants wanted either faster shipping time or clearer shipping options. Users want to get their items sooner, and if not soon, they want to know exactly when they will receive the items.

·       Shopping cart / Checkout – users want shopping cart and checkout process to be more intuitive and clear. 2 out of the 5 participants wanted a better way to keep items in cart without it clearing out right away.

·       Sizing – 2 out of the 5 participants had to return some items because the sizing was off. Measuring and sizing of items could be improved.

 

Define

Persona

Christine was created as a persona for the project - she represented the college students who frequently shopped for clothes online.

Christine was created as a persona for the project - she represented the college students who frequently shopped for clothes online.

Sitemap

Business & User Goals

Goals_JennKim_v2.png

Feature Roadmap

Screen Shot 2018-04-16 at 11.06.24 AM.png
 

Ideate

As expressed in the needs, wants, and pain points in the user research, I focused on designing:

·      Multiple filters that allow various combinations
·     
Shipping options with clear delivery dates and pricing
·      
Helpful sizing guides that relieve users of guessing

 

Design

Initial Sketches

User Task Flow

user-flows-by-jennifer-kim.jpg
MVIMG_20171220_194719.jpg

Wireframes

Brand Logo Exploration

brand-logo-by-jennifer-kim.jpg
brand-logo-by-jennifer-kim (1).jpg
brand-logo-by-jennifer-kim (1).png
 

Test

Affinity Map

Mirror Affinity Map.png
 

Final Designs

Checkout_Artboard.png
 

Reflection

As this was my first project as a UX designer, I learned to put into practice the principles of design and how to use tools such as Sketch, InVision, Photoshop, and Illustrator, more proficiently. I also talked to many different people in person while conducting interviews and contextual inquiries, and appreciated the experience of being able to understand users from their own words and actions. I also found my own design style and aspirations during this time.