Adding a New Feature on YouTube
YouTube has more than 2 billion users visiting their platform, spending an average of 19 minutes a day. It’s become the most popular video sharing platform in the world. However, it currently lacks a user friendly way to shop for products.
*Note: This is a fictional project.
Project Overview
PROBLEM
For an app that has millions of users, it lacks a shopping feature. It currently only allows content creators to add shopping links in the description box, that users then have to view outside the YouTube app. The only shopping experience is the “Shop the Store” section below the description box, which provides only eligible creators to easily promote a store or business. There is no direct shopping feature to access specific products shown in videos.
SOLUTION
I designed a shopping feature for users to shop products through YouTube. Users are able to shop from various points of the app, allowing them to add products to their cart and check out without ever having to leave the app.
ROLE
User Research, UX/UI Design, Prototyping, Usability Testing, Iterations
TIME
80 hours
TOOLS
Figma
Design Process
EMPATHIZE
Research
I first began my competitive research by auditing the YouTube app—looking at what features are currently available, and reading through YouTube reviews. I also looked into other entertainment/social media platforms like Instagram and Facebook, to see the competitive edge they have.
Hypothesis: “YouTube users need a shopping feature just like other social media apps.”
To further explore this hypothesis, I conducted user research through a survey (18 participants on Maze) and interviews (4 participants in person and on Zoom).
User Survey and Interviews
Click here to read detailed survey and interview data.
I found there was a lot of overlap in user responses. I condensed the survey and interview findings with this affinity map.
Survey and Interview Main Insights:
Users’ motivations: entertainment, learn a new skill, look up product reviews
Users’ needs: an easier way to shop for products shared in a video, better video filtering system
Users’ pain points: cluttered interface, inconvenient way to shop for products, ads
DEFINE
Defining the Problem
The insightful research helped me to further define the problem: YouTube is lacking a shopping feature for users to shop for products seamlessly.
User Persona
With all the interview findings and analysis, I created 1 user persona. In this design solution, we focused on creating an intuitive user experience for Ryan, who watches videos to then shop for products.
Understanding my users’ needs and goals, I created this feature roadmap to help narrow down the key features needed in my solution.
IDEATE
Ideating Solutions
In order to create a design that meets users’ needs in the added shopping feature, I created a task flow with 4 main tasks.
Task 1: Search for “best camping gear 2022” and click on the video by Alex Rosling
Task 2: After “watching” the video, shop for these 3 products: tent, hammock, and jetboil. Add these products to your cart.
Task 3: Go through the checkout process.
Task 4: From the homepage, shop for camping gear products.
Sketches & Wireframes
Prioritizing these 4 main task flows, I began sketching the key screens needed to complete the tasks.
I then digitized low to mid-fidelity wireframes. Shown below are some examples of these mobile wireframes.
Utilizing these low to mid-fidelity wireframes, I designed my high fidelity wireframes. Here are a few of those screens.
UI Design
One of the constraints for this project was keeping the brand and style intact.
With this constraint in mind, I utilized Material UI to create my YouTube UI Kit to keep to the existing brand style. I included the design components for the added shopping feature.
PROTOTYPE
Mobile Prototype
I built an interactive prototype with limited functionality to be used for usability testing in the next step. The prototype is to complete the 4 main tasks from the task flow.
Task 1: Search for “best camping gear 2022” and click on the video by Alex Rosling
Task 2: After “watching” the video, shop for these 3 products: tent, hammock, and jetboil. Add these products to your cart.
Task 3: Go through the checkout process.
Task 4: From the homepage, shop for camping gear products.
TEST & ITERATE
Usability Testing
4 participants in person and over Zoom
Communicated the strengths of my design, and ways to further improve the design.
Click here to view the usability testing data and finding details.
Priority Iterations
To better meet users’ needs, I made the following priority iterations.
Click image for closer view and in more detail.
Final Prototype
Reflection & Conclusion
REFLECTION
With YouTube’s direct competitors already having shopping features on their platforms, I confirmed through my empathy research the need to create and test a shopping feature for YouTube. I was able to accomplish my goal in creating a user friendly shopping feature for YouTube users. I am pleased with the design and the feedback I received through user testing that confirmed the strengths of my design.
NEXT STEPS
I would test my revisions.
In another round of testing, I would gather more insight on which path users prefer most when shopping for products on YouTube (shopping directly from a video versus going directly to the shopping page).
I would then work on designing the screens for how the content creators would post products on their YouTube channel.