Fueling Rip City energy with a real-time NBA playoffs experience

The Portland Trail Blazers entered the 2019 NBA Playoffs riding momentum, star power, and a fanbase that expects the digital experience to be just as dialed in as the on-court performance. With playoff traffic surging and content updating by the minute, the Blazers needed a centralized, real-time destination where fans could follow the series without hunting across platforms.

Year

2019

Year

2019

Year

2019

Client

The Portland Trail Blazers

Client

The Portland Trail Blazers

Client

The Portland Trail Blazers

Role

Web Designer + Front-End Developer

Role

Web Designer + Front-End Developer

Role

Web Designer + Front-End Developer

Desktop, Tablet & Mobile mockups for the ticker and homepage experience.
Desktop, Tablet & Mobile mockups for the ticker and homepage experience.
Desktop, Tablet & Mobile mockups for the ticker and homepage experience.

Problem

The Playoff Problem: a vast ocean of content with multiple homes.

During the playoffs, the Blazers’ digital ecosystem struggled to keep pace with the volume and velocity of live content. Fans were forced to jump between pages to follow the series, while editorial teams relied on manual updates that couldn’t scale during live games.

Game-day challenges of the past
  • Playoff news, media, and recaps were fragmented across multiple locations

  • Manual publishing caused delays during live moments

  • No single destination clearly communicated series progress or game status

During the most critical moments of the season, the experience felt slower than the game itself.

Not this time!

Process

Simplifying complexity without sacrificing the experience.

Simplifying complexity without sacrificing the experience.

Simplifying complexity without sacrificing the experience.

By focusing on what experiences we had created to-date, I was able to utilize some known experiences to Frankenstein something together that was on-brand, functional and user-friendly. The solution would need to be able to adapt in real time, while remaining intuitive for fans and manageable for internal teams.

Approach
  • Identified opportunities to automate updates through APIs and JSON

  • Iterated on layouts and interaction patterns to support live data

  • Explored multiple concepts for a dynamic game-day bar that was placed on the homepage and would see thousands of unique visitors a day.

Throughout the process, design & development decisions prioritized data accuracy, speed, and resilience under playoff traffic.

Solution

Voila! A centralized hub that updates as fast as the action.

The dynamic Playoffs Hub powered by live data and automation was largely accomplished by integrating directly with NBA APIs/JSON and reducing manual data entry, the experience stayed current throughout every game of the series as the live score posted in-game, along with play announcements in the feed.

Delivering for the true RipCity experience
  • Live content updates driven by an NBA JSON API

  • Unique content tagging to connect posts directly to playoff data

  • A swipeable series overview for quick context

  • A dynamic gameday bar that evolved with game status

Each feature of the Playoffs Hub played a specific role in reducing friction and increasing engagement. Together, they created a cohesive experience that surfaced the right information at the right time without overwhelming the user.

Live playoff content feed

Always current, never catching up.

A real-time content feed powered by an NBA JSON API automatically surfaced news, videos, and media the moment they were published, ensuring fans always saw the latest updates during live games.

Dynamic gameday bar

Dynamic & continually updating on game day.

The gameday bar updated automatically based on date, time, and game status. It supported pre-game hype, live-game access, and seamlessly transitioned to post-game recaps when the game ended.

API-Connected content tagging

Every post knew exactly where it belonged.

Each piece of content was tagged with a unique identifier (a dame ID), linking it directly to the Playoffs API. This allowed posts to dynamically populate the correct sections without manual sorting or duplication.

Series snapshot slider

The entire series, one tap away.

Using Slick Slider, the Game Info module displayed the full playoff series in a compact, swipeable format, giving fans instant context without leaving the page.

Live playoff content feed

Always current, never catching up.

A real-time content feed powered by an NBA JSON API automatically surfaced news, videos, and media the moment they were published, ensuring fans always saw the latest updates during live games.

API-Connected content tagging

Every post knew exactly where it belonged.

Each piece of content was tagged with a unique identifier (a dame ID), linking it directly to the Playoffs API. This allowed posts to dynamically populate the correct sections without manual sorting or duplication.

Dynamic gameday bar

Dynamic & continually updating on game day.

The gameday bar updated automatically based on date, time, and game status. It supported pre-game hype, live-game access, and seamlessly transitioned to post-game recaps when the game ended.

Series snapshot slider

The entire series, one tap away.

Using Slick Slider, the Game Info module displayed the full playoff series in a compact, swipeable format, giving fans instant context without leaving the page.

Live playoff content feed

Always current, never catching up.

A real-time content feed powered by an NBA JSON API automatically surfaced news, videos, and media the moment they were published, ensuring fans always saw the latest updates during live games.

API-Connected content tagging

Every post knew exactly where it belonged.

Each piece of content was tagged with a unique identifier (a dame ID), linking it directly to the Playoffs API. This allowed posts to dynamically populate the correct sections without manual sorting or duplication.

Dynamic gameday bar

Dynamic & continually updating on game day.

The gameday bar updated automatically based on date, time, and game status. It supported pre-game hype, live-game access, and seamlessly transitioned to post-game recaps when the game ended.

Series snapshot slider

The entire series, one tap away.

Using Slick Slider, the Game Info module displayed the full playoff series in a compact, swipeable format, giving fans instant context without leaving the page.

Impact

Rip City was watching the game clock closer than ever, in real-time.

Visitors find info faster, engagement is up, and the school has a site they can brag about. Even tech-averse parents are happy—they can now register their kids without calling IT. Mission accomplished.

Engagement

+35%

more engagement during live playoff games

Increased Saturation

+27%

increase in post-game recap click-throughs

Session Time

+18%

increase in overall session time during live playoff games