Hulu Onboarding

One of the most critical points in the customer lifecycle is when customers use your product for the very first time. First impressions matter, and a successful initial experience can go a long way toward fostering active, long-term engagement.

With these thoughts in mind, we set about creating an onboarding experience to help new users better discover the value of Hulu, and keep them coming back.

Role:  Design, prototyping, user testing.

Getting Personal

At the end of the current Web sign-up flow, new users find themselves on a homepage with no personalized content and little guidance on what to watch. Instead, they are presented with an abundance of trending or editorial content that they rarely end up engaging with.

By contrast, existing users are treated to a number of personalized touchpoints, including shortcuts to their favorite shows, recommendations, and targeted editorial features.  

One of these personalized touchpoints is Shows You Watch — a list of all the shows that a user is actively consuming on Hulu. With prominent placement across all platforms, Shows You Watch sees substantial engagement and drives an extraordinary amount of video views on Hulu.

Shows You Watch placement on Web, PS3, and iPhone

Defining the Experience

Thus, being able to offer Shows You Watch to new users seemed like a great way to kickstart a more personalized initial experience. However, since new users wouldn't have a watch history on Hulu, we needed a way to learn about their favorite shows beforehand.

With a strategy formed around Shows You Watch, we were now ready to start thinking about the design and flow of the experience. We started fairly broad with our explorations, trying out ideas like leading with genres, searching and filtering, and gamification elements to provide visual feedback.

Some early concepts we explored for Onboarding

We continued to iterate and refine the concept, eventually honing in on a direction centered around a few key tenets:

1. Fun and lightweight: Users just completed several screens of sign-up forms, and we didn't want this to feel like more work. 

2. Straightforward: No unnecessary distractions; keep users focused on the task of providing input.

3. Progression: Onboarding should be transitory, we didn't want an overly rich experience that would keep users from moving forward.

Selection Page

The Onboarding experience unfolds over three pages: Selection Page, Recommendations, and the Homepage.

On the Selection Page, the user is invited to highlight some of their favorite shows. These, in turn, are saved to Shows You Watch. 

We were striving for an experience that felt welcoming and inviting, so a lot of consideration went into the language, visual design, and animations. I created a series of motion studies to help fine-tune how these came together.

 Selection Page motion study, created in Keynote:

As for the actual shows featured on the Selection Page, we experimented with a number of different combinations and permutations. We ended up with the 64 most popular shows on Hulu, split across 6 pages. This subset offered a healthy range of genres and titles, without veering into exhaustiveness or obscurity.


After the user selects their shows, they are presented with a list of recommendations based on their choices. Here our goal is to introduce new content to the user to help diversify their viewing library. We also want to prime the user with the idea of using recommendations for discovery on Hulu.

Each recommendation is accompanied by a synopsis and a short clip/trailer to give the gist of the show. To tie these back to the Selection Page, we also call out the show that served as the basis of the recommendation.

When the user finds a show that captures their interest, they can easily add it to Shows You Watch with a dedicated button that anchors each recommendation.


After Recommendations, users are directed to the Homepage. Here they're rewarded with Onboarding's first payoff — the topmost tray preloaded with some of their favorite shows!

Onboarded users also receive a new Recommendations tray just below Shows You Watch, offering fresh content to enjoy once they catch up with their series, or are in the mood for something different.

User Testing

As we progressed toward a final design for the Onboarding flow, we were at a good place to start testing with external users. Moderated user testing was a new practice to Hulu, so I planned and executed the process from end-to-end, including screening, recruiting, and faciliation. I also summarized and presented the findings. 

We tested with 10 participants on-site. During the sessions, I had participants interact with a high-fidelity Axure prototype that I created, while I observed behavior and captured feedback.

Screen capture from test session

We found that overall, participants formed a solid grasp on the concept and were comfortable navigating the interface. We were also able to identify some usability issues that helped inform the final design. 


We launched Onboarding as an A/B test, with around 100,000 users funneled into the experiment in total. The two main metrics we tracked were minutes of video watched (to measure engagement) and churn (to track retention).

For the first month of service, we found that the Onboarding cohort was performing significantly better. Churn was 19% lower, and minutes watched was 34% higher. This suggested to us that Onboarding had significant potential to improve early-life churn and engagement.

However, this was just the beginning. Sustaining that momentum over the long-term would require additional tactics. Between content, personalization, and advertising, there were a multitude of opportunities to improve our service to be even more compelling for subscribers.

Ultimately, the development of onboarding was a big milestone in Hulu history — for the first time we were able to learn about a user's favorite shows a priori, and deliver a personalized experience from day one. The onboarding experience has continued to evolve at Hulu, and expanded into the sign up flow across all platforms.


Next Project Mobile Web

Change, at your fingertips.