YouTube App: A Design Review

As an app I use heavily, I wanted to share a few thoughts on how the design could be further improved.

Sarvistha
Pen | Bold Kiln Press
5 min readSep 22, 2017

--

Recently Youtube changed its app design, making the overall look & feel more seamless and convenient. With an app like YouTube, akin to a vast ocean of infinite content, it can be a great challenge to provide the user with a seamless experience while navigating through the whole app, viewing a specific video, and more, without overwhelming them at any stage.

As an app I use heavily, I wanted to share a few thoughts on how the design could be further improved.

Below is a quick overview of the app, to help connect with what I go on to talk about and share my perspective on.

Overview of the YouTube App

Horizontal Scroll

Let’s pick the home screen. Lots of videos coming one after another; and a page you necessarily see frequently.

Scrolling endlessly to the bottom, searching for the videos can be annoying, make discovery and search harder, and is in some form a time sink.

Another (personal) irritant is when the home screen shows mix videos.

I think this experience could be phenomenally better with a horizontal scroll.

Why?

  • Better organisation by creating clusters / groups / categories of videos and allowing easy scroll between and within categories
  • Segregation helps in deciding what to see
  • UX would be in line with the experience on Web (multiple categories, horizontal scroll on them)
  • Larger range of content to consume. This view will definitely increase the number of videos a use can view in one go.
  • Allows creating some default categories for trending and upcoming videos, to enable discovery of engaging content

Unnecessary repetition

Repeating functionality

On the video watching page, the Share and Add to icons are presented in two ways on the screen. To me, doesn’t make sense putting the icons on video; I did a dipstick and anyone clicking on the buttons used them from the panel below the video, no on the video.

This would also be a good place to take a data based call — evaluating which of those two icons are clicked more often and if there is a major skew there.

Repeating icons

If you see clearly, the same icon is used for Add To and for Create, when about playlists.

Two different functionalities with the same icon isn’t ideal. Could create a misunderstanding in the mind of a user, and once this gets deeply set — will be hard to restore the proper usage & perception of that icon.

Another example of this is the filter icon.
On the one hand, it is used for filter functionality when searching for videos; and on the other as a way to sort through comments. Though the use cases are overlapping in a manner — they’re also distinct and unique enough to warrant different icons.

Different function of the same icon

While we’re on icons, I also want to highlight I found consistency deeply missing. In some places — you find icons and text together; in others only text.

The same form language should be maintained across the platform which will build consistency, a seamless aesthetic and strong UX.

Icons vs Text

Usage of icons should increase and be the primary way to communicate. People nowadays recollect that which icon is for what purpose. Having the same option written in text, makes the space crowded and repetitive; icons work better. A quick mock up below:

One option to get users habituated to the icons is by introducing icons with small text in a horizontal row. This will take less space and looks clean.

Form Consistency

Form language is consistent but the icons need refinement.

While visiting the trending section, the icons for topics / categories are very different than the rest of the app.

A white icon on a solid red circle is entirely different form language from the icons on the navbar just above.

To maintain one form language, one can use red fill icons. The current icons are also too complicated and heavy on the eyes, than the rest of the iconography.

Introducing the shadow on these icons again isn’t in line with the rest of the app.

Colour Balancing

Let’s go step by step. If you look to the screen(a), its transition from the home screen makes it very dull suddenly. It would be better to have the title bar in red colour with white text. This will make it look more lively and balanced.

Another option can also be the title bar in white colour with red text written over it. The three dots for each video can be red. So less red colour but distributed equally.

In screen(b), the categories of the filter are not segregated properly. Its seems like floating on the page. Just a thin grey line at every category makes a lot of difference. The black font is overtly highlighted; and the page is losing its overall hierarchy.

Blue is not used anywhere else on the platform, but is used here — which immediately looks out of place. This page needs a major revamp as it doesn’t seem to belong here.

There is a lot to question and answer, but most important point is how to improve experience through iterations and improvements in the right direction.

Small steps, big impact.

As a designer, this is just my point of view, I’d love to know your take on this. and here’s hoping someone from the YouTube Design team checks out what I have to say.

If you liked this — clap it up! 😀

--

--