AGENCY: READY SET ROCKET (2017)

ROLE: ASSOCIATE CREATIVE DIRECTOR + PRODUCT DESIGN

NBA —
Redesign + Product Ecosystem

Creating parity between different platforms (iOs, Android, Web) and serving a whole new international audience.

Creating parity between different platforms (iOs, Android, Web) and serving a whole new international audience.

INTRODUCTION

The National Basketball Association is a beloved American institution — as well as one enjoyed around the world (1, 2, 3) . With international audiences consuming more and more basketball content each year, the NBA looked to focus their efforts on this market - delivering the quality of content and experience usually reserved for domestic audiences.

With our understanding in tow, we set out to build for our audience.

BUSINESS GOALS + STRATEGY

The challenge the NBA brought to us was a longstanding one: how we lessen the wide discepancy between the quality of digtial experiences offered to domestic vs international markets? 

Furthermore, even with the domestic offerings being superior, they still  were not performing well enough to drive subscriptions to NBA League Pass - their premium monthly subscription service. 

With our understanding in tow, we set out to build for our audience.

— Unify the system
In doing an audit of all the domestic and international digital apps (mobile and web), we found huge inconsistences in functionality and experience. Our plan was to create as much parity as possible; one holistic system to works across all devices. 

— Create a sense of personalization
Our competitive analysis of other sports apps showed us one big thing the NBA was missing: highly-personalized content for each user through selection of favorite teams and players. Let's use this opportunity to overhaul the information architecture and focus on curating more personalized content. 

— Make premium content worth it
Finally, we had to find a way to entice users to subscribe to NBA League Pass. While the answer was unclear early on, we knew it involved building natural entry points across all digital channels. 

From what we’ve heard - the renewals process from our competitors wasn’t great. In fact, everyone involved dreaded when this time came around. This was an opportunity for us to improve that.

DESIGN

A HOLISTIC SYSTEM APPROACH

We took a platform agnostic apporach from the start — borrowing elements from other NBA channels and creating a unified style guide to work seamlessly across platforms.  At the same time, we made sure to acknowledge and prioritize all native patterns and interactions.

img-sketches-1
nba-styleguide

GOOGLE MATERIAL DESIGN GUIDELINES 

Android

Android

nba-itl-android

APPLE HUMAN INTERFACE GUIDELINES

iPhone

iPhone

nba-itl-iphone

DESKTOP AND MOBILE BREAKPOINTS

Responsive Web

Responsive Web

nba-itl-web
img-devices

Design unification


All designs were carefully crafted as part of a unified ecosystem of digtial produts. As such, the vast majority of layouts and design patterns are platform-agnostic and designed responsively - allowing them to remain as consistent as possible across all app and web platforms.

We learned very quickly about their goals and pain-points. Externalizing this knowledge about users helped us get the entire team to align on a deep understanding of our users.

img-phones

Personalization


One thing we noticed in our early competitive audit was how other sports apps allowed for personalization. We kept this common paradigm and added another layer of customization through curated notifcations. 

We learned very quickly about their goals and pain-points. Externalizing this knowledge about users helped us get the entire team to align on a deep understanding of our users.

img-tablet

Streaming content to premium memberships


We strategically placed entry points to upgrade to NBA League Pass throughout the system. Furthermore, we worked with the client to allow a small amount of free streaming content to be offered to the general public.

After a certain number of plays has accumulated, we would ask them to subscribe to NBA League Pass. This let our users experience a trial period of premium content. 

We learned very quickly about their goals and pain-points. Externalizing this knowledge about users helped us get the entire team to align on a deep understanding of our users.

Streaming content to premium memberships


We strategically placed entry points to upgrade to NBA League Pass throughout the system. Furthermore, we worked with the client to allow a small amount of free streaming content to be offered to the general public.

After a certain number of plays has accumulated, we would ask them to subscribe to NBA League Pass. This let our users experience a trial period of premium content. 

RESULTS + IMPACT

RESULTS + IMPACT

After 6 months in-market, we checked in with the NBA on metrics:

We saw downloads in both the App Store and Google Play increase by roughly 25% in the first 6 months, a stark difference from just 12 months prior. As of this post, the Google Play Store has it rated at 4.4 out of 5 with 131k downloads, while the App Store has 2.5k downloads.

During the playoffs in 2017, in-app League Pass subscriptions increased roughly 15% percent than in 2016 - translating into revenue that the NBA wasn't seeing prior. 

Our redesign of the international offerings was so successful, that the internal domestic design team relied on it heavily for the 2018 refresh of their suite of apps. This only helps to create even more consistentcy. 

Based on our testing, we refined our user flow. We now felt confident building out our final screens. Since Oscar’s branding and UI are at the heart of what makes the company so great, we drew from that as often as we could.

CONCLUSION + NEXT STEPS

This was one of the agency's largest projects in 2018, and was a great deep-dive into platform best practices, visual design systems, and of course basketball. 

With our understanding in tow, we set out to build for our audience.

It's alwas gratifying to understand users and build directly for them.  Our qualitative research process yeilded a deeper understanding - fueling a small team to get big results in a short amount of time.  

For the next iteration, I would love to see: 

— User testing / usability studies
While we held some informal tests within the agency, I would have loved to have our hypotheses validated by some users. 

From what we’ve heard - the renewals process from our competitors wasn’t great. In fact, everyone involved dreaded when this time came around. This was an opportunity for us to improve that.

— Stronger protoyping / QA
Due to the nature of this project, my teams deliverables included an annotations guide for overseas developers - and therefore we weren't present to do any prototyping or QA for our platforms.

From what we’ve heard - the renewals process from our competitors wasn’t great. In fact, everyone involved dreaded when this time came around. This was an opportunity for us to improve that.