TED Apple TV app

Integrate personalized recommendations

1/1

Overview

Since the TED app made an appearance on Apple TV, people can watch TED Talks with others on a big screen at home and even in school. The communal and lean-back experience that Apple TV provides has made it an important platform to attract viewers. However, due to the competitive landscape of TV streaming platforms (Roku, Fire TV...) and streaming apps (Netflix. HBO...), the traffic to the TED Apple TV app has seen a slow decline. I was tasked to redesign the TV app to boost traffic and engagement.

Role

Lead product design,

Product management

Period

Jan 2019 - Jul 2019

Objectives and measurable goals

I kicked off the redesign project with the Devices team by aligning the objectives and measurable goals to hold ourselves accountable. The overarching goal was to increase user engagement and satisfaction rate with functionality and visual improvements.

Key measurable goals include:

  • Increase video starts and completes 

  • Higher % of logged-in user and user session

  • Increase app rating and ranking in Apple TV app store

Data analytics

When redesigning an existing product, learning from current behavioral user data is crucial. Unfortunately, the existing Apple TV data wasn't too helpful because the data tracking was set up poorly. Luckily, our Android TV app was recently redesigned, so I was able to pull some useful data from Google Analytics. 

By learning how people discover TED Talks on Android TV, I pinpointed critical user flows that we should focus on on Apple TV. For example, top ribbons on the home screen above the "fold" led to 20% of the total talk views, ranking as the second most popular source.

User survey and interviews

In-app data wasn't enough to tell the full story of why people are behaving in a certain way in the app. I moved on to conduct user surveys and interviews with existing TV app users. The research not only validated our hypotheses but also identified key areas of improvement. 

Some of the key takeaways from 124 survey responses and 11 interview sessions are:

  • On TV, passive content discovery (eg. stumbling on TED Talks on homepage and Topics tab) is a more common behavior than intentional content searching (eg. searching for talk title or speaker name).

  • 82% of the TV app users are cross-platform users. This means besides Apple TV, they also use TED mobile apps or ted.com to watch talks. Any functionality that allows content to flow fluidly across platforms will be very beneficial. 

Design principles

Informed by the quantitative and qualitative findings, I defined two design principles that we should keep in mind during the redesign:

  1. Surface relevant and personalized content with the least user effort. With a TV remote, regular interactions like clicking and sometimes even scrolling can be very challenging.

  2. Content continuity is crucial for the cross-device experience. TV is only a means to an end. Products are containers of content, and they should meet users where they are. 

Product iterations

Feature 1 – Personalized recommendations

"TED Recommends" is the engine that TED developed to recommend talks based on the user's interests. At that time, it has been available for TED users to sign up for recommendations on ted.com. 

Integrating "TED Recommends" into Apple TV will greatly help surface the most relevant data to users with the fewest click on the home screen. I set this ticket as the top priority.

As it turned out, supporting the TED Recommends signup flow on Apple TV was unexpectedly challenging because it required multiple-choice selection in three steps, making the app navigation even more difficult. 

1/1

3 steps required to sign up for TED Recommends on Apple TV.

The actual UIs shipped were adjusted to fit the AppleTV TVML template. Due to limited engineering resources, we were not able to build custom views in UIKits.

I landed on the final design through trials and errors. You can see how the interest selection screen progressed as I started to get more familiar with Apple TV interactions. For example, I rearranged the non-grid layout of buttons into a grid layout after realizing the diagonal navigation will be almost impossible with a TV remote.

1/1

The interest selection screen progression.

Shortly after we integrated TED Recommends, we observed a 48% increase in the week-over-week number of logged-in users and a 59% increase in video start. It was a great success.

Feature 2 – My TED

To create a seamless experience across devices, we needed to make sure people can access their saved or liked content anywhere. Also, syncing the Watch history on Apple TV was one of the top 3 requests from the survey. In the second product iteration, we decided to make user's collections in their TED profile more accessible and reliable.

MyTED.png

Analytics, unfortunately, wasn't available for this feature rollout.

Future iterations

Due to a shift in team focus, we didn't have enough resources to support more Apple TV feature updates. Following screens are the UIs I created for a navigation redesign and a dark mode. We put these potential updates on hold.

Reflections

Design for higher accessibility standards on TV.

Designing for TV comes with many unique challenges. For example, navigating the remote could be ten times more difficult than on a touch screen. Also, be mindful of UI elements size and color contrast on TV because people are usually10 feet away from the screen.

Always conform to the system design guideline.

The interaction model on various TV systems (Android TV, Roku, Apple TV...) can be drastically different. Choose the interaction that aligns the most with the system standard will cause the least user friction. 

There are many untapped design possibilities with TV.

TV watching is often a communal experience. 69% of our survey respondents reported having watched TED Talks with others. How do we best facilitate reflections and discussions in a group setting can be an exciting challenge we pursue later.

🙌 TEAM

Product design, Product manager: me

TVML developer: Clayton Selby

Principal engineer: Andy Merryman

Director of user experience: Michael McWatters

© 2021 by Yitao Wang

  • LinkedIn - Grey Circle
  • Twitter - Grey Circle
  • medium