Episodic End Card - Hulu, Web & Mobile Web Platform

Overview

As the design lead on this project, I did a complete overhaul of the episodic end card experience for Hulu’s Web player. I was responsible for defining the end card interface for credit marker and non-credit marker scenarios. Episodes with content post-credits have no markers to indicate when the end card should show.

As a result, the non-credit marker end card appears during the last 15 seconds of playback. No actions are displayed. The end card for content with credit markers, however, appears a few moments after the last scene. Viewers are given the option to start the next episode immediately or watch the credits instead. If autoplay is on, the countdown gives them 15 seconds to decide.

This project involved many rounds of iterations, prototypes, and feedback. After trying different approaches, I went in the direction of repurposing existing player components to maintain visual consistency and keep scope minimal while still delivering a clean interface. I worked closely with Product, Tech, TPM, Copy, and Legal to deliver this feature.

Responsibilities

User Stories, Sketches, Wireframes, Literature Review, Social Sentiment Research, Competitive Analysis, User Flows, Mocks, Prototypes, Responsive Design, Legal Review, Accessibility, Technical Specs, Design QA

Duration

This project took about 10 months to complete. The end card experience launched in October 2020.

Full details and documentation will be posted soon!

Previous Episodic End Card

Interaction Flow