ROku Visual Search

Roku Search has always been the platform’s most used content feature. As a host to every major streaming service, we enable the user to search for virtually any piece of content, find the least expensive streaming provider, and play it immediately on their TV. 

I was asked to refresh our search UI to create a more visually appealing framework that scales to our future content needs. 

Role

Project lead, Interaction and Visual Design

Background

The original text based search was hard to beat. It was bandwidth optimized and highly efficient, capable of delivering the exact title the user was looking for within 3.5 characters 90% of the time. The list was easily scannable and the txt results came in lightning fast. But because it relied on surfacing titles, it was also limited in its ability to support new use cases (such as “holiday movies” or Youtube videos).

The original text and title match based search was tried, true, and hard to beat.

Intuitively we knew that showing pictures instead of a text list would be a more engaging and immersive experience for our users. That said, switching from sending text results to visual would involve significant engineering investment. There was a high bar of due diligence needed to convince the business that the UX upgrade would be worth the effort.

Process

Through a combination of competitive research, heuristic analysis, prototyping, and user testing, we made our case that there was enough potential value to both the user and the business to merit building and AB testing a new Visual Search experience at scale.

Heuristic Analysis

One of our goals was to support new types of content a they started to become integrated to the Roku platform. The original Search had to support just TV and Movie content. But as we scaled to other types of content such as actors, music, and user generated video, the single flat list of text results was constraining us in in unexpected ways.

DESIGN

To continue building our case we embarked on an exhaustive design exploration phase. I drew every variant of Search I could think of (even the dumb ones) and developed a rubric to evaluate them all. We reviewed this with the cross functional team until we felt all concerns had been addressed and we could all align on a direction.

The exhaustive exploration was… exhausting :D but worth the effort. Visualizing every option drew out feedback we otherwise would not have gotten and helped build confidence that we were doing the right thing.

Prototyping and testing

I built motion prototypes to demonstrate how a final product might look. During the design phase I also made sure to gain access to the proper Search APIs and infrastructure to help our UX eng team build build a functional prototype using actual search data. This was extensively user tested and iteratedd prior to handoff to a production engineering team.

One of many animated motion demos I built to demonstrate new functionality.

Together with the UX Engineering team we built fully functional prototypes that we used to user test and iterate cheaply.

Results

I worked with the production engineers and data analysts throughout the entire build and AB testing process, continuing to make tradeoffs and iterations based on new learnings up until the final release. Together we tested countless iterations and ranking algorithms until we felt confident that the new design delivered both an improved user experience AND a significant boost to key business metrics:

  • Average domestic usage increased by 15%

  • Bounce rate (users not finding something of interest) reduced by 56%

  • International usage increased up to 46% in some markets

Subsequent experiments included adding a Search bar to the home screen and testing a variety of different keyword generation engines. Aside from the ability to launch partner apps, Roku Search remains the most used and revenue generating OS feature, a significant contributor to yearly revenue.