Costumes 4 less
E-commerce Research
Timeline: 2 weeks
challenge
Conduct user-centered research to redesign the current e-commerce website to be more clean, smart and user friendly.
solution
Create a more functional and aesthetically pleasing website by reducing the clutter, organizing the layout, simplifying the navigation and streamlining the checkout process to improve the shopping experience.
Project details
About
Costumes 4 Less is is an online retailer that offers a wide selection of products at low prices. Their products include Halloween costumes & accessories, themed party costumes, lingerie, shoes and party & wedding supplies.
Objectives
Conduct research, usability tests, and design wireframes.
Tools
Sketch app, InVision, Whimsical, pen and paper, post its, notecards, whiteboard, & Excel
Research
Heuristic evaluation
To identify usability problems in the user interface design I conducted a heuristic evaluation by evaluating the interface for compliance with usability principles.
C & C Analysis
I compared features from Amazon, Spirit Halloween and Buy Costumes to understand the current landscape of online costume shopping.
What I liked:
Order status
Similar items/recently viewed
Reviews
Buy now option
I wanted to include these on the website
What I wanted to avoid:
Immediate pop-ups
No guest checkout
Confusing navigation
No shipping/return info
These problems presented opportunities for Costumes 4 Less
Interviews
I conducted interviews to understand users current pain points with the site and gained insights on how users liked to shop for costumes online.
User quotes from their experience:
“Normally I wouldn’t have bought anything, but I was in a rush.”
“It was just ugly.”
“I think of Clutter and Chaos.”
information architecture
I looked at the existing site map to understand the design structure of the site in order to plan a new navigation system.
Existing site map:
Card sorting
To simplify and organize the navigation, I conducted card sorts on the primary, secondary and global navigation to find possible solutions.
Redesigned site map
I simplified and reorganized the new site map to have a better design structure.
Synthesis
affinity map
The people I interviewed had several issues with the current system. To organize insights from hours of interviews, I created an affinity map. These were some of the core insights:
The site is too busy, want less clutter
Would like to see shipping & return information upfront
Want an easy to use navigation
Want quality products at reasonable price
persona
To help me define who costumes 4 Less is for, I created a persona. I referenced him throughout the UX phase to understand how my design decisions would best help a casual user.
Journey Map
Brian’s journey map allowed me to visually represent the users experience with the Costumes 4 Less. His frustrations came from too much clutter and confusing navigation.
problem statement
Brian is overwhelmed with the clutter on online costume sites. How might we reduce his frustration while keeping a large selection of products and features?
Ideate
Sketches
Keeping the problem statement in mind I sketched out ideas of the home page, product listing page, product detail page and the checkout process.
testing
Usability tests
I performed usability tests starting with paper prototypes to save time. Then moved to medium fidelity wireframes for additional testing.
Iterations
More streamlined checkout process
Upfront shipping and return information
Conclusion
Next Steps
Rebrand the company
Test shopping cart use, placement and size
Streamline checkout process by creating an easier way to create an account during the process
What i learned
I learned how to utilize user research and data in guiding design decisions.
I learned a lot about e-commerce and that it’s best to prioritize features because it’s easy to get carried away.