Alana Leshno

Digital Experience Design

YouTube

Making it easier to find and watch video content

Overview

I challenged myself to improve a popular product I use daily.

This case study examines my process to help users find, gather and organize videos to watch on YouTube.

Role

Product Designer (Personal Project)

Tools Used

Omnigraffle | Sketch | Photoshop | After Effects | Flinto

Research

User interviews

Understanding behavior and needs

I interviewed YouTube users to understand why and how they use YouTube. Below are some key user insights:

  • Users want an easier way to gather and organize videos they want to watch. Although Watch Later is an existing feature, most users do not know about it or use it.
  • They have short attention spans and like to read comments while watching videos, as well as, watch videos while looking for others.
  • They love to find new content and usually discover it in their recommendations. But, when they want to browse what's most popular, users find that the current trending page doesn't have interesting content for them.

Design Process

Feature Ideation

How might we help users find, gather and organize videos to watch?

Mobile:

  • Develop two separate apps for viewers and creators, to simplify the navigation for the viewer's app into three main areas — Browse, Search and Queue.
  • Make navigation easier to access from the bottom of the screen.

Both:

  • Turn the subscriptions feed into a to-do list by providing the ability to hide videos you aren't interested in and filter content by channel.
  • Add the ability to filter top videos by category.

Desktop:

  • Move the queue and other personalized content (like subscriptions, playlists and notifications) to a prominent location.
  • Create a closeable side panel gives users quick access to their personalized content, so they can browse while watching videos.
  • Place comments next to each video in a closeable tab to help users read and watch at the same time.

Early Sketches

Click to zoom wireframes

The Solution

The Mobile Experience

gif

gif

gif

gif

gif

The Desktop Experience

Closeable side panel

Creating a closeable side panel gives users quick access to their personalized content, so they can browse while watching videos.

Side comments

Placing side comments next to each video in a closeable tab allows users to choose if and when they want to read and watch at the same time.

Subscriptions to-do list

Turning the subscriptions feed into a to-do list provides the ability to hide videos you aren't interested in and filter content by channel.

Visual Design Choices

  • Larger imagery reduces content on screen and makes the page more scannable.
  • A darker color scheme draws users’ eyes to the brightest content – the videos.
  • Accents of red draw attention to important navigational elements — like CTAs.
  • Page transitions help the user remember what they clicked on and where they are headed.

Homepage

Channel

Video

Top Charts