Background
Levelling Up in a Rising Market
Due to the pandemic's influence on gaming and technology, Best Buy has become a popular retailer for gaming PCs. With users increasingly building custom gaming setups, Best Buy has an opportunity to offer a custom build feature on their website, similar to Micro Center's "Build My PC" feature.
The Problem
Design a custom gaming PC building experience tailored for beginner builders as an added feature to the Best Buy website.
The Solution
Introducing the AI Messenger feature designed to support and enhance the customer shopping experience through:
-
Conversational AI Format: Users can input complex search prompts, even in question form, to find exactly what they are looking for or expand their search through AI-generated recommendations.
-
"Key Considerations" or Tips: Provides users with crucial information on what to look for when searching for specific products, helping those unsure about specifications.
-
Recommended Products by Affordability: Allows users to choose the best products according to their budget, ensuring cost-effective decisions.
-
Expandable Search Through Conversation: Users can continue to input additional prompts or questions to refine their search and pinpoint their ideal product.
Impact
-
Enhanced Shopping Clarity: Users appreciated the "Key Considerations" feature for its informative content, which provided greater clarity and confidence in their shopping experience.
-
Increased User Engagement: The conversational AI format encouraged users to interact more with the platform, exploring various options and recommendations.
-
Better Decision-Making: By offering tailored recommendations based on affordability, users were able to make more informed and satisfactory purchases.
Design Process
Discover
Research Objectives
1
Identify the needs of website visitors who are shopping for gaming PCs and parts
2
Identify needs of users who who want to customize their PC
3
Determine Best Buy business goals in offering a customize feature on their website for PC gaming
Stretch Goals
-
Study eCommerce patterns that help business drive additional revenue
-
Understand how to create a guided experience that drives business goals without being overbearing
Hearing from the users
My goal here when conducting user interviews was to identify user needs when shopping online for gaming PCs and parts. I also aimed to gain an understanding of their needs for customizing a PC
5 Participants were recruited between the ages of 24 and 34 years old
-
All have some experience playing video games on PC
-
Those with little experience have interest in purchasing or building a gaming PC in the future
-
Want info on low-high performance specs
-
They consider the games they play plus their school/work needs
User goals when shopping for a PC or parts
-
Affordability, Compatibility, Performance are all major deciding factors
Expectations
-
Users typically go to social media, like Youtube and Reddit, and then PC specific sites, like Newegg to compare parts
Frustrations
-
It's overwhelming and hard to narrow down their search
-
Availability, biased reviews, and affordability
-
Users struggle to determine if they are getting the best deal
-
Users Suggested:
AI chat box
PC builder
Virtual appointments
Users say to consider:
Store availability
Longevity of product
Performance estimation
Work station needs
Beginner friendly verbiage
Pricing next to parts on prebuilds
More filter options
Investigating the competition
I wanted to see what similar businesses are doing to drive revenue in the PC department. So, I conducted a competitive audit on PC Part Picker, Micro Center, and NewEgg
.png)
Filters galore
All sites have wide selection of PC products and a rather extensive and complex set of filters. On Micro Center, I counted over 30 filter options when searching for a graphics card.
"Build my PC"
PC Part Picker and Micro Center have a customization feature formatted as a list where users add parts to each section
"Find my Gaming PC"
NewEgg has a beginner friendly shopping experience. Users can start with a game title and view budget friendly recommendations
_PNG.png)
The PC gaming industry
The overall increase in consumer interest and market growth shows that Best Buy has an opportunity here.
-
The global PC gaming software market is projected to reach $45.2 billion by 2024
-
First-person shooter games leading the way
-
Women represent 46% of all PC gamers, providing possibilities for targeted marketing strategies.
-
China's PC gaming market is expanding, with over 500 million gamers expected by 2024
-
Despite the increase in mobile gaming, PC gaming platforms remain significant.
Non-PC related businesses
I looked into other non-PC related experiences that are being used by other business to drive revenue.
Nike ID
Nike an online service that allows customers to create their own gear by customizing color, design, and performance features. This feature aims to provide personalized products to customers.
Google AI Snapshot
A generative AI feature that uses conversation to drive the search. AI snapshot offers a short list of noteworthy factors to consider and products that fit that criteria.
Microsoft's Clippy
A virtual assistant intended to help users in Microsoft suite. Was found to be intrusive
Forming takeaways from everything learned
I gained a better insight on user goals
My first assumption was that users wanted a beginner friendly customization experience
What I learned from users:
-
They want to narrow down their search easily
-
They want unbiased information
-
They want transparency on affordability
Best Buy could benefit from taking a unique approach
We know that users are looking for an easily digestible experience that helps find exactly what PC or part they are looking for.
Potentially offering approachable and easy to understand information on specs, compatibility, performance, affordability, and the like plus unbiased recommendations could drive revenue.
Define
Defining the problem
Creating a realistic representation of user needs
Based on the takeaways found in research, I created two user personas and outlined their goals
As a user, Nick should...
Feel confident about his search for a PC without needing to learn any complicated jargon or technical information
As a user, Sam should...
Be able to find specifically what PC part she is looking for without having to sift through products that are irrelevant to her search.
Deciding on the solution
How might we create an experience that helps users not only find what they want quickly, but also understand why they want it?
After reviewing the research, I narrowed down to two potential solutions that could work hand in hand:
-
An AI powered search that educates users on their product search
-
A customization experience where users can choose the exact item for their needs
Throughout the experience, users would be given the option to start a Customization. Otherwise, they would follow the AI Search flow where users can either choose an AI recommended product or start a Customization. I also included the potential to navigate to other resources.
Due to the time constraint of this project, I focused only on the AI Search feature. Here is that user flow on its own.
Develop
Creating the solution prototype
Exploring potential designs
I started with sketches of the Best Buy home page featuring a PC Customization hero section as it will be a future addition and the worked on multiple AI Search results pages. All will include the following:
-
The search prompt repeated
-
A few sentences informing the user about the product they are searching for
-
"Key considerations" or tips on what to look for when searching for that specific product
-
The recommended product listings
-
The ability to input a follow up prompt or question
Narrowing it down
Using a similar color palette to the Best Buy branding, I narrowed down to two results page lout options and created high fidelity wireframes
Option 1
Key considerations are positioned first followed by top 3 recommended products.
Check boxes show that these products meet the criteria set out by the key considerations
Option 2
Key considerations are separated by section and recommended products sit within each section.
The prototype
I prototyped for Option 1. Users would start at the home page and type into the search bar. The AI Search results page would appear and users can ask a follow up prompt or question to yield more specific results. They can then add their chosen product to their cart.
I opted to feature Option 2 as a screenshot during usability tests to ask users' thoughts and opinions on the layout.
Deliver
Validating the design and making revisions
Because there were still various questions and potential solutions, I made sure to get an MVP in front of users to gain feedback as soon as possible
Usability testing
I conducted a moderated usability test via Google Meet using screen share.
I recruited 5 participants ages 26-38 of varying PC experience
Beginner
2 participants considered themselves to be beginners at PC gaming and building
Intermediate
2 participants stated they were fairly experienced in PC gaming and building
Expert
1 participant identified as very experienced and has many years of PC gaming and building under their belt
Participants were tasked with finding and adding a white gaming PC to their cart
2/5
participants expected to go to the PC section of the site first
3/5
participants noticed the "Customize PC" ad and expected to start there
Thoughts and impressions on the results page
3/5
participants found it to be very informational and liked the key considerations
2/5
participants were concerned that there was no focus on price and budget
After task completion
All participants stated that the feature did not meet their expectations
Specifically, they did not expect to land on an AI feature
1/5 participants found AI to be intrusive
1/5 participants had concerns about not seeing any compatibility information
Additional feedback from the users
-
Majority found the experience to be helpful and useful, particularly enjoying the key considerations
-
Visual design was simple
-
Potentially text heavy
-
-
All agreed that this experience meets a need
-
Participants had trouble using the “follow up” feature
-
They either did not realize it’s function or were not “paying attention”
-
What did they think of the alternative page?
Layout Option 2
1 participant prefers this page
-
It is not a wall of text and products are in view
4 participants found the information confusing
-
Products in 1 key consideration meant they did not meet the criteria of other key considerations
I formed five priority revisions from these insights
Make the AI feature feel less intrusive
-
Write an AI disclaimer, design an exit point, or incorporate elements from the original search results page
Organize text content to be less text heavy
-
reorganize, condense, and/or resize text
"Follow up" input field needs to be reworked
-
update writing, redesign input field, and/or reposition input field
Include budget comparisons
Include compatibility information
Reviewing my options
I needed to go back to the drawing board and make decisions on the best actions to take.
New sketches
I opted to have the AI feature pop up over the original results page in a messenger format. This accomplishes two things:
-
Users can see they are able to exit if they choose to
-
The messenger format is familiar where users can better recognize that they can ask a follow up question or prompt
Additionally, I organized product recommendations by budget
Exploring more layouts
I continued to look at and explore several designs for the product recommendation cards
Encouraging exploration and discovery through branding
I went back to make a decision on the this added feature's name and brand identity
I decided that Best Buy Spark hit home. I wanted to send a message that users can find what they are looking for and learn something knew with the help of this feature. The journey that they take with Best Buy Spark will be enlightening. They may end up choosing a product that they would not previously choose but is exactly what they need. Maybe that new product is the catalyst to a new hobby or career.
I pulled references of star, spark, and lighting motifs, and began brainstorming
The friendly face of Best Buy Spark
I landed on this circular star design with a pastel gradient similar to the Best Buy brand colors
I went with a circle design to keep it soft and approachable, as AI can be seen as invasive.
I chose a pastel gradient to keep the friendly feel and add a feeling for freshness
Finally, I chose soft pastel blues and greens to be used for the recommendation cards to evoke calm, trustworthiness, and non-aggressive.
Bringing the design to life with prototyping
In order to really bring the design to life, I implemented several animations to enhance the user experience
A loading animation to act as a marker that users are landing on a new feature
_gif.gif)
Hover states were used to showcase compatibility information without taking too much space
_gif.gif)
The ability to scroll so that users can refer back to past search results
_gif.gif)
Project takeaways
I learned to be persistent in pushing the boundary
My biggest takeaway was challenging myself to create as many iterations as possible. Continuing to iterate on my design concepts made for one of the better choices in the end and will continue to improve as I continue to iterate
User-centered design is paramount
I had many unanswered design questions throughout this process. The best way for me to push this project forward as to start usability testing.
Effective research was crucial to putting my project in the right direction
I conducted a variety of research and continued the exploration throughout the project. This exposed me to many design solutions and ideas
Future Roadmap
Expanding on the solution
Incorporate the customization feature
-
The 2nd part of this project includes a customization feature.
-
Add points in user flow where users can move to customization if the AI search isn’t meeting their exact needs.
-
Potential to add other features and/or revisions
-
Review other revision options and determine best ways to implement
-
Continue to research other options/features that could be added to make this experience better
Iterate, iterate, iterate
-
Continue to improve the design through testing, research, and feedback