Yeah, that’s right!

Source — The Verge

At the end of this article, I will be revealing if you are not aware of the product that I was working on for more than a year. And am glad to share that it is live. Stay tuned till the last to know it.

Firstly, what is Android TV?

It is usually a box or display, the streaming applications we usually watch on mobile or laptops. Displays are now in a much bigger ratio.

A platform that gives the following:

• fewer frictions
• only just important content to view
• cinematic experience
• Fluid with great interactions
• Fun and lots more

So, to design anything for a larger display is quite tricky. Yeah, I am not joking about it. If there is anyone out there who is/was working for Android/Apple TV would understand the fun to learn and also the pain behind it.

Btw, I happily meant pain!

Most important Design Principles for Android TV/ Apple TV

I mention both the platforms as it has the same principles, though the design language is different.

• Chilled consumption of content — As it has a bigger space, it needs to have fewer and most significant elements to watch and interact with. It also should have minimal choices to decide and execute.
• Cinematic experience — The gigantic displays can be benefitial to show higher resolution vibrant graphics and high definition audio. These would give the user mini-theater at home.
• Simple interaction — It requires the user to make frictionless navigation across any of the applications. Thus, the user finds it easy to navigate by providing less number of choices within the platform.

Color

It is preferred color does represent both the brand and boldness of the application.

It recommends by Google’s Material Design that it should have accent color with the combination darker background and lighter.

Color selection in such a way that it doesn’t hurt users eye in the dark or lighter environment.

The limit of content that needs to display per screen on TV

I have experienced the following things:

• Difficult to consume every piece of content from a distant place.
• While the nearer it was comfortable to read.

Technically, it is recommended that the viewing distance should be 5 times the distance of the screen. For instance, if your television is 40 inches wide, then the optimal viewing distance should be 200 inches or approx 17 feet.

Moreover, the content from the viewing distance should be minimal and to the point. It will be benefitting the user in the following ways:

• to consume effectively and
• find it accessible

Loaded with text would only bore the user to be on the platform and also it would affect the eyesight.

Different focus states of button for TV

As far as what I researched, there are following:

• Default — It is a button before interacting with it.
• Focused — When the cursor/button makes the short journey, as about to to get rest on the next element. It is also mainly show the current position of the cursor.
• Pressed — It is also short interaction in the element to feel the user it is selected.
• Selected — It highlights that it has been selected to the element.
• Disabled — It is the state when the system does not allow the user to make any interaction.

Position and hierarchy of elements

Source — Google TV Design

1. The elements in the TV interface should not overlapp with each other. Otherwise, it would be affecting tougher way for the user to get access.

Source — Google TV Design

2. Navigational elements should be as per the D-pad and also, sooner to navigate according to easy hierarchy.

Source — Google TV Design

3. In home view — Search should always be on top to get access soon to do Voice search or manual search.

Source — Google TV Design

Next comes the recommendation row

• A user would find the preferred shows, movies, etc. It gives convenience, and sooner the user takes the decisive steps.

Source — Google TV Design

• There are several alternative ways, the row can be useful.

i. It can be any continuation that you might be watching earlier and at the middle have stopped.

ii. New content showed to the user to let them know their favorite piece of show/movie arrived.

iii. Related content as if the user has already watched anything. The system analytics will recommend the user to watch as their last interest

Source — Google TV Design

• Background imagery. New thing that I found out and the user finds it is too useful. As any piece of the card gets focused then the user gets to watch a short trailer of the show/movie they have selected. Also, the background imagery should be different than the card image used.

Types of view

Source — Google TV Design

• Browse view — In this view user get the content nearest to home screen and access search easily.

Netflix Android TV

• Detail view — Here, it gives all the attributes to the user that has needed. Likely, a short description of the content, genres, rating, etc. Also, the artwork in the background should be immersive and sets the emotion to watch the content.
• Playing view — In this view, the user will be engaging in watching the content and have related elements to forward/backward content, volume up/down, resume/pause, etc. It is important to note how to make users exit from that piece of content easily.