top of page

NBCUniversal Driving Retention For Authenticated Audiences

Optimizing the authenticated viewing lifecycle for millions of users across Web, iOS and Android.

THE CHALLENGE: INTRODUCING AUTHENTICATION WITHOUT FRICTION

As we integrated the "TV Everywhere" model into our digital ecosystem for the first time, we faced a critical UX hurdle: requiring users to authenticate via their cable providers to unlock content. This introduction of a "verification gate" meant the post-authentication experience had to be immediate and rewarding to prevent drop-off. My goal was to ensure that once a user verified their subscription, the viewing experience was so seamless that they remained engaged, maximizing session duration and driving return visits.


Redirecting at the point of engagement led to user drop-off and lost value.
Redirecting at the point of engagement led to user drop-off and lost value.

MY ROLE

I was the sole designer on a lean team. I led research, UX, prototyping, visual design, user testing, and developer handoff. ‍

CONTEXT

Product: NBC-owned local news apps (NBC + Telemundo) Goal: Add seamless in-app Live TV streaming Constraints: No research team, limited data, and fixed ad placement zones ‍


PROCESS

1. Data-informed direction

Partnered with the social team to build personas based on top markets. Found users spent over an hour watching live streams and frequently used the TV schedule—so I designed around those behaviors.


Translated viewing patterns into a full-screen, schedule-integrated layout tailored for long sessions.
Translated viewing patterns into a full-screen, schedule-integrated layout tailored for long sessions.

2. Realistic prototyping + testing

Typical prototyping tools weren’t enough to simulate the login flow. I used a more advanced tool to model provider search, authentication, and stream start. Tested and iterated across internal departments.


Built and tested for real-world behavior—like users entering the wrong credentials.
Built and tested for real-world behavior—like users entering the wrong credentials.

3. Branding meets usability

Worked with marketing and on-air teams to transform heavy broadcast assets into scalable, mobile-friendly visuals. Used universal icons and clear language to support both English and Spanish-speaking users.


Original on-air graphics were built for broadcast—not optimized for digital or mobile environments.
Original on-air graphics were built for broadcast—not optimized for digital or mobile environments.

Redesigned visual elements to strike a balance—preserving brand identity while improving scalability and usability across digital platforms.
Redesigned visual elements to strike a balance—preserving brand identity while improving scalability and usability across digital platforms.
Extended the system to Telemundo using inclusive iconography and a layout that worked seamlessly across both languages and audiences.
Extended the system to Telemundo using inclusive iconography and a layout that worked seamlessly across both languages and audiences.

DESIGN HIGHLIGHTS

  • Introduced and tested calls to action across high-traffic pages without disrupting existing content

  • Prioritized quick access to top TV providers and built predictive search for long-tail options

  • Designed a step-by-step login flow to reduce confusion and support accessibility

  • Added clear, lightweight visual cues to guide users through streaming and sign-in decisions

  • Integrated the TV schedule into the streaming experience to increase engagement and ease of use

  • Created a theater-style viewing environment optimized for longer sessions, with caption support built in


Tested lightweight header CTAs across screen sizes to promote Live TV without disrupting content flow.
Tested lightweight header CTAs across screen sizes to promote Live TV without disrupting content flow.

Designed contextual CTAs that blended with the platform’s UI—resulting in higher visibility without being mistaken for ads.
Designed contextual CTAs that blended with the platform’s UI—resulting in higher visibility without being mistaken for ads.

Optimized provider selection with quick-tap defaults and predictive search to streamline the login experience.
Optimized provider selection with quick-tap defaults and predictive search to streamline the login experience.

Designed around third-party login flows to set user expectations before handing off to external systems.
Designed around third-party login flows to set user expectations before handing off to external systems.

During commercial breaks, the schedule automatically expanded—using shadow and scroll cues to keep users engaged without manual interaction.
During commercial breaks, the schedule automatically expanded—using shadow and scroll cues to keep users engaged without manual interaction.

Introduced a theater-style layout post-authentication to shift users into a dedicated streaming mode, designed for long-form content.
Introduced a theater-style layout post-authentication to shift users into a dedicated streaming mode, designed for long-form content.

Balanced business needs by clearly separating third-party on-demand content from our in-app clips—using layout and iconography to set user expectations.
Balanced business needs by clearly separating third-party on-demand content from our in-app clips—using layout and iconography to set user expectations.

IMPACT

Though numbers weren’t shared, I was told directly: ‍

"Can’t share the numbers—but let’s just say streams, impressions, and revenue all moved in the right direction.”

We didn’t get hard numbers—but the feedback was clear: streams, impressions, and revenue all went up.
We didn’t get hard numbers—but the feedback was clear: streams, impressions, and revenue all went up.

WHAT I'D IMPROVE

On mobile, we launched before fully understanding how live TV commercials would impact our layout. Because ads can’t run during a commercial break, the reserved ad space often appeared as a large, empty area. We solved this later during the tablet phase by dynamically adjusting the layout—but in hindsight, I would’ve pushed to explore that solution earlier in the mobile flow.


Initial mobile layout didn’t account for live TV ad conflicts—leaving a blank space where an ad would’ve been. This was later addressed in the tablet phase with a more adaptive layout.
Initial mobile layout didn’t account for live TV ad conflicts—leaving a blank space where an ad would’ve been. This was later addressed in the tablet phase with a more adaptive layout.

bottom of page