YouTube, a leading video-sharing platform since 2005, lacks user control over the recommended section, prompting the need for improvements. Users, like myself, desire greater agility to remove unwanted topic videos from the recommendations, enhancing the overall user experience on the platform.
What Problem Are We Trying To Solve?
YouTube lacks a feature to remove entire video categories, hindering users from efficiently finding desired content. While users can switch between categories, the inability to display multiple categories simultaneously, except in the featured section, causes frustration and time wastage. There is a need for YouTube to provide users with more control over their recommended videos, allowing for a personalized and efficient viewing experience.
How Do We Solve This Problem?
I devised a feature enabling users to filter videos by categories, enhancing content customization. My design focused on a standard iPhone screen for optimal organization. Key goals included:
● Understanding content presentation.
● Maximizing filtering potential.
● Prioritizing user needs.
● Understanding the impact on both media consumers and creators.
Research: Where To Start
Assumptions In General Research:
While I did believe there were certain complexities to focus on when it came to first conceptualizing the design, there were also certain ideas that I needed to further evaluate upon in terms of YouTube’s format that I needed to consider.
These included:
You can view the affinity map in more detail down below:
Competitive Analysis: How Would This Feature Stack Up To Other Similar Features Like It?
To create a new feature for YouTube, I explored ideas beyond its current parameters by examining how other video-sharing platforms handle user recommendations. I compared YouTube with Vimeo, Rumble, and Twitch, analyzing their pros and cons in recommending videos to users.
To develop further direction and comprehension for how I would want to design my project, I held 5 interviews with men and woman who were between the ages of 22 and 40 and asked them questions that were themed around how they utilize YouTube, if a filter feature would aid them in finding more of their types of videos, and how such a feature could impact their overall search for engaging content.
Here are some of the questions I asked with the interviewee’s respected rely:
We Need More Info! Lets Do One On One User Interviews!
Comments were categorized into six groups: Technology & General Interests in Media, User Needs, Experiences with YouTube, Functionalities with YouTube, Presentation of Featured Information, and Impact on User's Platform Use.
Key Takeaways
From the interviews, key takeaways revealed shared frustrations among participants:
“If the experience was better, I would probably use YouTube more. YouTube is a bit of a time waster for me. This feature would allow me to search through content faster. With the heavy use of content, there must be something that filters the content, which would allow for less time and more convenience.”
“Sometimes I get overwhelmed at the number of different videos for me to watch. There are also times I try to remove some of them, but they keep popping up. Sometimes it's relevant, but other times it’s completely pointless.”
User Persona: Who Would Be Using This Feature?
Its from this revelation that I developed a set of user personas to help me further define the problem and aid me in understanding the typical users who would be utilizing YouTube itself. I figured that these general perspectives would significantly aid in my production of the project and help me find a good starting point to product the general backbone of my YouTube feature.
How Might We: What Should The Design Look Like Practically To Users?
Once the user personas were defined, I formulated HMW (How Might We) statements. These queries guided my ideation process and gave me further insight into exploring the overall design flow. The purpose of these questions was to unravel solutions to users' challenges, understand how they may utilize the feature, and integrate them seamlessly into the project's design.
Feature Roadmap: What Features Should We Have Here?
I next addressed a key challenge of determining the essential features for the design. Considering the tool's purpose of assisting users in discovering and managing preferred videos, I identified four features aimed at simplifying the user experience. These features enhance user interaction and provide a genuine sense of choice, addressing gaps in YouTube's functionality.
Bringing The Design To Life
Task Flow And Sitemap: It’s Time To Develop The Backbone Of My Design!
Once I defined the features, I aimed to optimize the design's navigation efficiency. This involved creating a straightforward sitemap with a streamlined flow since the feature was limited to one platform section. Prioritizing simplicity, I ensured each task within the feature looped back to the main section, minimizing user travel within the design.
Sitemap
Task Flows
Creating Low-Fidelity Wireframes
I developed the rough design of the YouTube feature, aiming for screens that resemble the platform's website while focusing on user-friendly details. The goal was to create a seamless flow between sections, keeping buttons together with clear functions. In this section, users can select and filter multiple categories to tailor their featured section based on their interests and personal tastes. The presented screens are customized to demonstrate how the feature would cater to an individual user's preferences.
High-Fidelity Designs, Testing, And Iterations
High-Fidelity Wireframes
After completing the low-fidelity wireframes, I proceeded to develop high-fidelity wireframes with adjustments to improve the overall look. Notable changes include a more obvious indicator for selected category themes, replacing the ambiguous minus symbol with a clearer trash icon for removing categories, and general spacing adjustments for a clean and simplistic design. These modifications aim to enhance user experience in solving the challenge of finding desired content.
Here are the initial high-fidelity screens for users to select what categories they wish to see on their recommended screen, which allows users to easily select preferred categories. These screens feature a user-friendly, pop-up-like design for swift interaction and quick adjustments. This design emphasizes simplicity for users of all ages, and aims for easy comprehension and efficient utilization within a short timeframe.
This set of high-fidelity screens display the ability for users to select further specified types of videos or content they want to see by selecting the drop-down arrows within each category. These screens are meant to follow a pattern of design flow that helps further establish the user’s needs and allows for a more open style of engagement.
Here is a showcase of several high-fidelity screens that display the results of changes made using the feature, visible on the home screen. These screens were designed to be similar to the mobile version of YouTube, but also include the filter icon in the button selections. They provide a preview of what users can expect when utilizing the feature on the platform.
These high-fidelity screens demonstrate the user's capability to delete unwanted categories in the main feature section, removing them entirely. Upon selecting the trash icon, the screen transforms to provide users with a choice and confirmation to remove the selected category. A popup box was chosen for a confirmation (in the center), and its purpose was aiming to avoid intruding on the overall user experience.
Here are the high-fidelity wireframes for the search/add category section, which warrants users the ability to discover and add resources to their main category section. The addition of a top-screen search bar ensures a simple and accessible way for users to find new content or explore existing categories efficiently, minimizing steps for an optimal user experience. I added an extra screen to confirm the user’s choice since I wanted to make sure users could make their selection can authorize it without accidently selecting another topic in the process.
This section of high-fidelity wireframes assist users in restoring a previously deleted or removed category, reintegrating it into their main topic section as a selectable option. I wanted to include this as a general feature of the design since I figured users would find favor in reexploring topics they were interested in previously and recovering them without having to go and look for said categories once again. I included a pop-up icon (in the center screen) to keep the flow of design solid and non-obtrusive to users as I was interested in a unique but simplistic user flow.
Time To Test My Designs!
When it came to testing my initial design, the general features were simplistic enough that I was confident there would be little issues overall, though of course I had to hold by breath and see what the testing would bring. Once again, I had a group of five testing my feature, and as I did before, I asked them questions about the design and how it felt for them to transverse each screen and explain to me how the design impacted their experience with YouTube.
For this mobile test, users were given the following tasks to accomplish:
● Select/deselect a filter category from the main section.
● Add a new filter category.
● Delete a new filter category.
● Select a filter category from one of their drop-down menus.
● Recover a filter category from the filter history section.
With each of these tasks, my plan was to see how each of the users react to the given problem and how they would solve it with the options provided to them.
My success metric would follow these tasks accordingly:
● They can understand the overall design flow and can successfully navigate the feature with ease.
● Errors are minimal and generally avoided.
● The users can complete the tasks within under 20 sections or less.
After the testing concluded, I received helpful criticism from each of the interviewees, and was able to learn more about how my project functioned in a general setting:
Usability Testing Results:
Feedback from participants highlighted positive experiences with various feature sections: selecting/deselecting a filter category, adding/deleting a new filter category, and choosing a category from a drop-down menu. Users found these features intuitive, with minor suggestions such as adding titles for clarity, enhancing organization in drop-down sections, and making minor UI tweaks for polish. The recovery section received positive reviews, but one user suggested clearer indications for newcomers. Overall, the feedback provided valuable insights for refining the feature.
Iterations and Revisions
Having massive amounts of reference material to go off of for my revisions, I made a plan to make the general changes. One of the most common requests and suggestions I got from my peers was to alter how the category buttons were portrayed and simplify them in some way. In addition, the interviewees requested that there should be more space created for each of the sections given, and that I should also apply more space to the drop-down extension screens for convenience.
And with that, I went to work!
This is the redesign for the main section of the feature, in which users can pick and choose what they want to watch with the custom categories.
Original design highlighted the selected category button with circular spaces and checkmarks. The design appeared slightly dated.
The restyled version has cleaner appearance with increased space at the top and bottom of the screen. The "update changes" button now sports a stylish black color with white text.
Here is the redesign of the detailed category section where users can select specific topics in the category that they want to see.
This screen featured a larger selection of choices with less space, but had checkmark indicators for what items could be selected for each category.
The update removes buttons for better scrolling and adds lines for space division, and the buttons now feature open circles. Selected options are denoted by a black circle and white checkmark.
Here is the redesigned search screen where users can find and add a new category to their main feature section.
Original version had a white search bar with a grey outline around it, as well as lines above and below the search topics.
The revamped design has a search bar with no outline and greyed out space, along with most of the lines being removed.
This screen showcases the revised pop-up question that would be asked when users would want to recover a category that they deleted or removed from their main category screen.
The original design has the box question being outlined, with a line between the question and response. The "yes" and "no" options also have a grey outline.
The revised design features fewer lines and the question box has been streamlined with the removal of general outlines.
Bringing Everything Together
Final High Fidelity Wireframe Prototype
After these edits, made some slight minor alterations and applied the wireframes together fully. With the design completed, I complied the screens together to finish the feature completely. To showcase how the feature works, I created a high fidelity prototype that would allow users to explore the feature itself, and learn how it would be applied to YouTube as a whole.
Here is the completed product will all features, screens, designs, and iterations completed.
Conclusion & Reflection
Overall, I believe I created a feature that would help people find the kind of videos they wish to watch at an easier and faster rate, while also providing an experience that would guide them to use the feature often in order to also not be bombarded with unnecessary content on YouTube. Through this process, I learned that understanding the platform you are developing for is a necessity to plan out how you would go about creating a new or updated feature for people to use, and communication in what works and what doesn’t is an integral component of a UI/UX design.
Next Steps
My next steps would be to study people’s use and actions taken with the feature and attempt to iron out any pain points or other changes that may need to be applied in order to improve the overall usability of the design. I’m looking to:
● Add any additional sections or portions to the feature to give users more freedom and interaction with said feature.
● Continue to run given tests and explore whether the feature would fit with YouTube’s functionality and explore whether it meets and or exceeds user expectations and interests.
● Develop a handoff that would give YouTube or other groups access to the work and explore their own possibilities with the feature.