A retro television

Finding a Home on Pluto TV

Company
Pluto TV | ViacomCBS
Role
Product Designer
Year
2020
Time to read
5 mins
Different devices showing Pluto TV's interface.

Overview

I worked as a Product Designer at Pluto TV from 2018–2020, helping in their mission to “Entertain the Planet.”

I worked specifically as an embedded Android designer for Fire TV and Android devices, as well as specializing in accessibility design.

My contributions include:

• Creating one of the first site maps for the products, and pioneered information architecture into the design practice

• Introduced usability tests into the design process during the redesign

A screen showing live tv.
One of my design contributions, an onboarding message for new users.

While I have been on several projects, the largest and main focus of my tenure at Pluto TV has been the redesign of the product.

The project is called “5.0”, as it is considered as the fifth redesign of the product. It was later renamed “Project Venetia,” to honor Venetia Burney who named the former planet Pluto at the age of 11 in 1930.

A phone and a TV showing the channel guide, with Gordon Ramsey in the background. Title reads: "5.0" Project Venetia.

Challenges Faced

1/ Redefining the process to include more feedback from the users.

2/ Retain the brand’s integrity throughout the application.

3/ Maintain consistency across the different platforms and releases.

4/ Consider typography treatment carefully.

Different remotes for different consoles.A person reads on his device at different distances. The bigger the screen, the further away.

Different devices call for different experiences.

Different devices call for different text treatment.

Reverse Navigation Brief

The released application has a very complicated reverse navigation back flow. This is due to:

1/ App development on a very limited partner platform first

2/ App architecture in tvOS

3/ Business wanted to load fullscreen views first

4/ Product wanted to loop users in through the app for one more round before exiting

Appstore Reviews

This pain-point was brought up during usability testing, and now during the Venetia release in app reviews:

“No way to exit app ,I can’t find one ?? Any one find out ?? And when you go to live on air channel ,when you want another channel it kicks you out”

“April Fool’s is a month away. Why did you put the garbage iOS app prank out now? No one could think it’s good design to have to swipe two different directions to see what’s playing next, let alone showing episode titles over show names? Are you on crack? Revert pls.”“How about GOING BACK TO THE BETTER VERSION YOU JUST REPLACED? This new UI is complete trash and you should fire anyone who thought it was good. More button presses and swipes makes things WORSE not better.”

“New format is horrible! Who thought of it?! No channel numbers. No colors. VERY time consuming to search for stuff! And forced landscape view, locked. AND smaller screen! WTF!Change it back!”

“It worked fine, but they changed it to make it harder to use. Now it’s a mess and one of the worst apps on Roku. Not intuitive at all.”

Documentation

The confusion in navigating back also arose through hand-off to other teammates.

One of them was a white-frames prototype I put together and was a sharable link:

A screenshot of the prototype in white frames, with a remote next to it.

Additionally, we used Lucidchart and Confluence to chart user flows. However, this also caused confusion in the format and the user flow itself.

Different documentation
Different documentation, it now says on top "Confusion amongst the team."

Benchmarking

To solve this problem, I started with benchmarking.

I looked at Youtube TV, Hulu TV, AT&T TV Now, and Fubo TV to study their reverse navigation flows.

The big takeaway here was, they all had a home screen where the user entered and exited from.

User flows mapped on the wonderful whiteboard wall.

I was able to chart this against our current flow. This revealed high high traffic in the first area.

White board user flows, heavy flow on one side.
Close up of the user flow site map.

Conclusion drawn: Pluto needs a home.

A clay cartoon of Pluto the planet googling if it's still a planet.

I worked on revising the user flows by conceptualizing a home.

Revised user flows with clear arrows going back and forth.

Wireframing

I created two ways of experiencing the interface: one with a "down" or vertical trajectory to into the app, the other was a side-to-side, or horizontal navigation flow.

A vertical user flow.
A horizontal user flow.
White frames of the vertical user flow.
White frames of the horizontal flow.

Feedback from Teammates

There is no way for the user to enter the player from home. They have to drill down to access full screen, which is traditional for a Subscription Video On Demand (SVOD) product. However, this does not necessarily suit an Advertisement Video On Demand (AVOD) product where the user needs to see the player, and therefore ads, as soon as possible.

Revision

I wanted to use the great redesign of Pluto TV’s brand. One of their mottos was “drop in.” I tied in this idea into the design.

A screenshot that says "revision" and shows the horizontal user flow. The entry point is above the main menu. The user would navigate left or right to pick a live channel.The user lands on the screen before going into full screen, to navigate the menu.

Afterward

The concept excited the team and resolved a problem. Through this process, we got to explore more solutions. This proposal was completed right around the time before I left, so I didn't get to see this solution beyond that. The team learned that because building the software required a great level of effort from engineering, always explore several iterations before committing to one. Additionally, navigation continues to plague modern-day software in confusion. We sometimes just all need a place to return to, like home.

Connect with me

Email me: courttan@gmail.com