Big Bad Toy Store
Redesign of the biggest and baddest toy store
Task:
UX researcher, low to high-fidelity wireframes, protoyping, testing
Goal:
Website redesign
UX role:
UX/UI Designer
Duration:
2 weeks | solo project
Overview
My objective for this project was to identify an e-commerce platform that required a website overhaul. As the sole contributor, I assumed responsibility for conducting user research, creating low-fidelity and high-fidelity designs, and developing prototypes. After careful consideration, I chose to revamp The Big Bad Toy Store due to my personal interest in collecting collectibles.
Design process
In my case study, I used the Double Diamond design process, a framework that allowed me to explore divergent ideas and converge them into viable solutions.
.png)
Problem
Despite being in operation for several years, The Big Bad Toy Store (BBTS) is in need of a contemporary and well-designed website as its current layout is cluttered, challenging to navigate, and uninviting. These factors can potentially discourage prospective users from making purchases, highlighting the urgency for a website redesign.
​
"Good design is good business."
Thomas Watson Jr., Former IBM President
Market research
Despite the COVID-19 pandemic keeping millions of customers indoors, the collectibles market has remained robust. Recent articles have even shown an increase in demand for collectibles during this time. As the industry continues to expand and evolve, businesses must adapt to stay competitive. With The Big Bad Toy Store (BBTS) not having updated its e-commerce platform for over five years, I have taken the initiative to redesign it to keep up with the changing market.
Primary objective
The primary objective is to offer users a seamless way to input and store data about their approach shots for in-depth analysis, providing valuable insights into their game. With features like club yardage and GPS shot tracking, users can understand their performance and enhance their skills. The app goes beyond data storage, actively tracking users' progress and fostering a deeper understanding of their game.
Current experience
Pain points:
Home
-
Header is overwhelming and can throw users off.
-
BBTS background is not responsive. The grey portion is part of their website.
-
No labels makes it hard for users to navigate around website.
Product listing page (PLP)
-
Overwhelming filter makes it harder for users to utilize filters.
-
Horizontal layout limits the amount of product a user can see in one screen. This leads to users having to scrool a lot to see a couple products
Product Description Page (PDP)
-
Information next to the product makes the page overwhelming.
-
Lack of product images can be a factor to losing users.
Research Analysis
For this project, I focused on the millennial, young adult, and Gen Z demographics, who are tech-savvy and familiar with e-commerce. To improve BBTS existing customer base and attract new ones, I conducted six user interviews to identify common needs and pain points in the e-commerce platform.
Interview key takeaways:
-
"Most of the e-commerce websites I use have a clean design".
-
Product details and customer reviews impact purchasing decision.
-
Wishlists are useful when eye-shopping or saving items.
-
Product image and dimensions are very important when purchasing.
User Personal
Lucas Morant
Occupation: Mechanical engineer
Age: 28
Location: San Francisco
Biography
Lucas has been a collector of figures ever since he was a child. He began with purchasing small figures and now collects high-quality figures. Lucas enjoys seeing the figures in-person but due to COVID-19, he’s been shopping online.
Wants & needs
-
Would like to read user reviews before he purchases.
-
Needs a better filters to find products.
“I’m so picky when it comes to choosing my figures”
Frustrations
-
Product page doesn’t have enough pictures or information about the product.
-
Too many unnecessary filter options.
Jennifer Chung
Occupation: Influencer
Age: 20
Location: New York City
Biography
Jennifer’s interest in figures grew as her friends back in Korea started collecting. Jennifer enjoy’s eye shopping but tends to forget what she liked. Due to the vast amount of figures, Jennifer needs a better way to store her favorite figures she sees online.
Wants & needs
-
I’d like to see similar products in product page.
-
I want to put my favorites into a wishlist.
"It's hard to keep track of all the figures you want"
Frustrations
-
Goes straight to cart after adding product to cart.
-
Not having a wish list option.
Competitive Analysis
Although the research findings helped me to refine the problem statement, I needed additional inspiration before wireframing. ​ To gain insights on what makes an e-commerce platform user-friendly, I examined The Big Bad Toy Store's competitors such as SideShow and ToyWiz. Additionally, I explored other e-commerce platforms mentioned by users during the interviews, including NIKE and Mr. Porter. Through this analysis, I found that most successful e-commerce platforms utilize whitespace and feature a clean and intuitive interface.
Opportunities
Users
-
Updated website to provide quick navigation and checkout process.
-
Improve user journey with more functions and information on the product.
-
Mitigate users from leaving the current website due to design and complexity.
Business
-
Attract new users with an updated and modern website.
-
Opportunity to compete against other collectible websites that have updated websites.
-
Ability to rebrand and market the new Big Bad Toy Store.
Sketches
Sketches
Before designing my wireframes, I started by sketching my ideas and brainstorming some features I can add and changes I can make to the UI for a better user experience.
1. Home
Before the redesign, The Big Bad Toy Store's (BBTS) homepage was cluttered and lacked an effective organizational structure. In response, I incorporated more whitespace and increased the spacing between content and icons to create a cleaner and more streamlined layout.
2. Product listing page (PLP)
The original product listing page on The Big Bad Toy Store (BBTS) displayed items in a row with all-layered filter options. To enhance user experience, I incorporated a feature that allowed users to view available filters and have more control over their search. Additionally, I redesigned the layout of the product cards, making it easier for users to view key product information and find what they're looking for quickly.
3. Product description page (PDP)
Throughout my user interviews, several participants highlighted the importance of wishlists while shopping, the significance of customer reviews in their purchasing decisions, and the value of being able to view related products.
4. Cart
While The Big Bad Toy Store (BBTS) had a serviceable cart page, I believed that it was important for it to align with the platform's overall layout and have a contemporary feel. As a result, I redesigned the cart page to be consistent with the modern aesthetic of the platform.
MVP designs
While the high-fidelity mockups were heavily based on the low-fidelity designs, I made changes based on my usability testing. In addition to the feedback, I kept these points in mind while designing:
-
Icon and font size.
-
Spacing between content.
-
Whitespace.
-
Simple navigation.
-
Overall layout organization.
1. Home
Using my inspirations and research, I've incorporated a brand carousel, sectioned quick searches, and designed an easy to use header.
2. Product listing page
For the product listing page, a dropdown menu for the filter was added for users to experience an easier navigation while portraying larger product images in the PLP.
3. Product description page
A larger product image with multiple angles will enhance the customer experience and improve purchasing decision for our users. Also, a wishlist button and a dropdown for customer reviews have been added. To improve the user experience, I've also included related products to showcase more products.
4. Cart
Although the original cart for BBTS had the least amount of issues, I wanted to change the layout for users to experience a more intuitive design. Previously, the cart page was very overwhelming with too much text.
Conclusion
I take great pride in the work I have accomplished on this project. Through the redesign, users of The Big Bad Toy Store (BBTS) will be able to navigate the platform with ease, minimize confusion, and attract new users who may not have been familiar with the brand previously.
​
If I had more time to dedicate to this project, I would prioritize connecting with BBTS's customers to better understand any frustrations they may be experiencing and solicit feedback on the new design. Additionally, I would aim to incorporate a VR or AR feature within the mobile design, allowing users to view products digitally in their environment and better understand their specifications.
