The NFL dominates American sports — it accounted for 93 of the 100 most-watched TV broadcasts in all of 2023. But even as the nation’s most-watched sport, the NFL needed to modernize its app to bring the game closer to its die-hard fan base and new fans alike. So the NFL called an audible, transforming its app approach into more than just a game day companion, but an experience that fuels the rhythm of the game – every play, day and week, on and off-season
Objectives
The NFL introduced a revamped mobile app featuring their subscription-based streaming services, NFL+ and NFL+ Premium, aimed at boosting both visibility and subscriber engagement. To enhance the app’s usability and elevate its visual system, the NFL partnered with Code and Theory. The goal was to develop strategic design solutions that not only enhance user experience but also create a scalable design system adaptable to various user needs and future expansions within the broader NFL ecosystem.
Role
Collaborated with the NFL Product Design team to craft a scalable visual design system, unifying the core NFL brand with the unique identities of all 32 teams. This comprehensive system was designed to seamlessly support high-profile NFL events like the Draft, Pro Bowl, Schedule Release, and Super Bowl, ensuring consistency across the entire NFL digital ecosystem.
Partnered closely with creative strategy and UX teams to address the complex design requirements of various game states, paywalls, matchups, and subscription models, delivering a cohesive and adaptable user experience.
Main Responsibilities
Established the New NFL Mobile's core visual identity, defining the look and feel for the NFL digital ecosystem.
Led the visual design team in creating a comprehensive design system in Figma, including foundational visual guidelines and key component libraries tailored for scalability and consistency.
Developed a long-term atomic design system for the NFL product team, enhancing design efficiency and brand coherence.
Partnered with UX designers to deliver precise design documentation and interactive prototypes for seamless developer handoff.
Conducted design QA in collaboration with the NFL team, ensuring pixel-perfect execution and brand integrity from simulations to final launch.
Visual Direction
Our visual design aims to strengthen the connection between fans and their favorite teams, while accommodating sub-brands like NFL RedZone, NFL+, and NFL Network. By embracing the bold colors and jersey elements of all 32 teams, we crafted a system that balances functional clarity with emotional resonance, ensuring that colors do more than just identify — they capture the spirit and energy of the game.
Matchup and Video-First Experience
Built around the versatile Game Card super component, this system serves as the core building block of the new NFL experience. It dynamically adapts to various game states — pre-game, live, and post-game — while supporting diverse content types, light and dark modes, score hiding, and media-embedded variations, providing a seamless and flexible foundation for every matchup.
Enhancing Every Game Day
The new NFL app is designed to deliver the most relevant content throughout the week, with a special focus on Sundays — the heart of NFL action. With up to 14 games from 1 pm to 8 pm EST, the app ensures fans can stay connected, whether at home, at the bar, or on the go. With NFL+, users gain access to live local and national games, as well as RedZone, putting the ultimate Gameday experience directly in their hands.
NFL News, Anytime, Anywhere
The new mobile app delivers a richer, more dynamic news experience, keeping fans connected with the latest updates through articles, highlights, deep dives, and quick hits. Each news component is designed to provide fast, comprehensive coverage, making it easy for fans to stay in the loop.
Dig Into the Stats and Standings
The app transforms a vast array of stats into an engaging, real-time experience for fans. From pre-game insights to live updates and post-game analysis, it presents the right data at the right moment, with carefully considered hierarchy and density for optimal usability. It also brings individual team and player stats to life, along with leaderboards, empowering fans to explore the numbers that matter the most.
More Than Just the Season —
Year-Round NFL Experience
The app is designed to engage fans beyond the regular season, supporting off-season tentpole events like the Playoffs, Super Bowl, Combine, Schedule Release, and Draft. The design system must not only capture the unique identities of these events but also seamlessly integrate with the broader NFL brand and 32 team color palettes, ensuring a cohesive experience year-round.
A Scalable System for the
Broader NFL Ecosystem
Built on a comprehensive design foundation, this scalable system empowers the NFL team to extend its visual identity across the entire digital ecosystem — from NFL Pro and Connected TV to NFL.com — creating a cohesive, seamless experience for fans everywhere.
NFL Mobile App at Config SF 2025
The NFL mobile app work is being presented by Lauren Manning, Head of Product Design, UX Research NFL, and Arjun Kalyanpur, Senior Director, Product Strategy at Code and Theory at Figma’s Configs 2025 in San Francisco.
The Webby Awards Nominee: App & Software — Entertainment & Sports 2025
The Webby Awards Nominee: App & Software — Best Visual Design Aesthetic 2025
Fast Company Featured Article — How the new NFL app keeps you hooked on football all week