Client: MIRROR
Role: UX Research, UI Design & Prototyping
Duration: 2 Months
BACKGROUND
Back in 1994, Mirror was a clothing store targeting all ages looking for cheap clothing for everyone for any occasion.
Today, they own over 400 stores around the world in 32 countries. Successful with in-store, Mirror is deciding to move part of its inventory in an online store.
PROPOSAL
Design a logo for the company that is modern and neutral enough to attract all types of people and styles.
Design a responsive e-commerce website that is easy to use and allows customers to browse through all products and filter by size, color, style and others.
RESEARCH
Competitive Analysis
Market Research
Research Interview Plan
Research Results
Creating a Persona
Competitive Analysis
For my competitive analysis, I compared the strengths and weaknesses of each competitor’s UI Design on how one is better than the other. It was surprising on how the competitors differ from each other despite having the same kind of product.
Market Research
Online shopping is growing so fast that the global online shopping market size is predicted to hit 4 trillion in 2020.
The U.S. alone, we’re expecting to have 300 million online shoppers in 2023.
77% of digital window shoppers make impulse purchases. And 70% of them will come back and make a purchase from their device within the first hour of seeing the products.
Research Interview Plan
Interview 4-5 people
Find out what customers expect when shopping online.
Find out what pain points for customers when shopping
Identify how users use the navigation filter function
Research Results
Goals
Finding the right size
Find deals without being distracted by other items
Easy navigation on website
Pain Points
Bombarded by ads
Inaccurate size charts
Lack of customer service
Needs
Fast customer service response
Sizing comparison on models
Easy filter navigation
Creating a Persona
Creating this persona, I wanted to understand some of the goals and frustrations an average person would have while having to undergo the online shopping process. I wanted this persona to not look for brand name clothes but comfortable and affordable.
INFORMATION ARCHITECTURE
Card Sorting
Page Sketches
Site Map
Card Sorting
I chose to go with the card sorting method to quickly organize products and put them in their properly named category. While looking through the card sorting results, I found the similarity matrix to be useful on grouping items on how often they were common by the interviewee.
Page Sketches
Sketching up my homepage, I wanted all the important information to be the first thing the user sees before clicking anywhere else. I wanted the links to be accessible and save the customer time rather than scrambling all over the site.
Site Map
INTERACTION DESIGN
Task Flows
User Flows
Responsive Wireframes
Wireframe for Desktop Prototype
Task Flows
User Flow
Responsive Wireframes
Grabbing trends from other competitor’s websites, I created my own responsive design to help cater to my stakeholder’s needs. With these wireframes the users can go from end to end with minimal to no problems.
UI DESIGN
Hi-Fidelity Tablet Prototype
Responsive Design
UI Kit
Next Steps & Final Thoughts
Hi-Fidelity Tablet Prototype
Responsive Design
FINAL THOUGHTS
During my course of this project all I wanted was to make a well designed product. While conducting numerous interviews and testing out my prototype, I learned that it will takes time to produce a product. Instead of always trying to reach perfection in the design, I wanted to also attain functionality to better the user experience even more. Understanding the users’ wants and needs, helps mold and continuously build a user-friendly product.
“Perfection is not attainable, but if we chase perfection we can catch excellence.”
-Vince Lombardi
Next Steps for Mirror
Creating more accurate sizing charts to cater to different body masses.
Create a 360 degree turn around on products for faster viewing.