NHL.com/stats

Engaging hockey fans through statistics

Role

Design Lead

Client

NHL

Disciplines

UX Design

Industry

Sports

NHL.com/stats

Engaging hockey fans through statistics

Role

Design Lead

Client

NHL

Disciplines

UX Design

Industry

Sports

NHL.com/stats

Engaging hockey fans through statistics

Role

Design Lead

Client

NHL

Disciplines

UX Design

Industry

Sports

+

25

%

Number of site visits

Number of site visits

+

45

%

Engagement time

Engagement time

408

K

Unique visits on launch weekend

Unique visits on launch weekend

Summary

Since 2004, the NHL Stats site was little more than a collection of Excel tables. I was brought in to reimagine how hockey statistics could be used to drive interest for new and existing fans. An overhaul of the site's structure, content, and experience led to increases of 25% in number of site visits and 45% in engagement time.

Summary

Since 2004, the NHL Stats site was little more than a collection of Excel tables. I was brought in to reimagine how hockey statistics could be used to drive interest for new and existing fans. An overhaul of the site's structure, content, and experience led to increases of 25% in number of site visits and 45% in engagement time.

Summary

Since 2004, the NHL Stats site was little more than a collection of Excel tables. I was brought in to reimagine how hockey statistics could be used to drive interest for new and existing fans. An overhaul of the site's structure, content, and experience led to increases of 25% in number of site visits and 45% in engagement time.

Goals

Emerging out of SAP’s sponsorship deal with the NHL, this project had business goals for both parties.


The NHL wanted to increase engagement with the stats pages on their website, even hoping to use stats to attract new fans. They wanted to introduce advanced statistics, similar to those that had been embraced and popularized by Major League Baseball. Throughout the redesign it was important to the NHL that we leverage what they view as their best assets; the players and video highlights.


SAP wanted to host all the data on its tools and highlight their analytics capabilities by providing predictions and advanced filtering.

Goals

Emerging out of SAP’s sponsorship deal with the NHL, this project had business goals for both parties.


The NHL wanted to increase engagement with the stats pages on their website, even hoping to use stats to attract new fans. They wanted to introduce advanced statistics, similar to those that had been embraced and popularized by Major League Baseball. Throughout the redesign it was important to the NHL that we leverage what they view as their best assets; the players and video highlights.


SAP wanted to host all the data on its tools and highlight their analytics capabilities by providing predictions and advanced filtering.

Goals

Emerging out of SAP’s sponsorship deal with the NHL, this project had business goals for both parties.


The NHL wanted to increase engagement with the stats pages on their website, even hoping to use stats to attract new fans. They wanted to introduce advanced statistics, similar to those that had been embraced and popularized by Major League Baseball. Throughout the redesign it was important to the NHL that we leverage what they view as their best assets; the players and video highlights.


SAP wanted to host all the data on its tools and highlight their analytics capabilities by providing predictions and advanced filtering.

Discovery

In order to increase engagement with the stats page we needed to understand when stats become important to people and what brings them to the page today.


We recruited people for interviews from across the spectrum of fandom to learn from both the die hard and new fans. We joined them to watch games in their homes, at bars, and in-person to see ensure we understood hockey culture and role stats play.


We also spoke to people across the NHL’s organization to understand their goals for the site and league and how fans behave on the site today.

Discovery

In order to increase engagement with the stats page we needed to understand when stats become important to people and what brings them to the page today.


We recruited people for interviews from across the spectrum of fandom to learn from both the die hard and new fans. We joined them to watch games in their homes, at bars, and in-person to see ensure we understood hockey culture and role stats play.


We also spoke to people across the NHL’s organization to understand their goals for the site and league and how fans behave on the site today.

Discovery

In order to increase engagement with the stats page we needed to understand when stats become important to people and what brings them to the page today.


We recruited people for interviews from across the spectrum of fandom to learn from both the die hard and new fans. We joined them to watch games in their homes, at bars, and in-person to see ensure we understood hockey culture and role stats play.


We also spoke to people across the NHL’s organization to understand their goals for the site and league and how fans behave on the site today.

New homepage

The site’s web traffic revealed that most visitors didn’t go beyond the first stats page, which was just a table showing individual stats for the current season. There were many other pages of data tables by team, career, and shootout, but no curation of that content of invitation for visitors to explore further.


It quickly became clear that if we wanted fans to explore the stats pages we’d need to give them a reason to. Rather than the “Stats” button taking visitors to one of many data tables, we created a true stats homepage that could aggregate the best content. We worked with fans to identify the most compelling story from each dataset that we could visualize on the new homepage. With each visualization I aimed to incorporate headshots to humanize the players and foster those relationships for fans.

New homepage

The site’s web traffic revealed that most visitors didn’t go beyond the first stats page, which was just a table showing individual stats for the current season. There were many other pages of data tables by team, career, and shootout, but no curation of that content of invitation for visitors to explore further.


It quickly became clear that if we wanted fans to explore the stats pages we’d need to give them a reason to. Rather than the “Stats” button taking visitors to one of many data tables, we created a true stats homepage that could aggregate the best content. We worked with fans to identify the most compelling story from each dataset that we could visualize on the new homepage. With each visualization I aimed to incorporate headshots to humanize the players and foster those relationships for fans.

New homepage

The site’s web traffic revealed that most visitors didn’t go beyond the first stats page, which was just a table showing individual stats for the current season. There were many other pages of data tables by team, career, and shootout, but no curation of that content of invitation for visitors to explore further.


It quickly became clear that if we wanted fans to explore the stats pages we’d need to give them a reason to. Rather than the “Stats” button taking visitors to one of many data tables, we created a true stats homepage that could aggregate the best content. We worked with fans to identify the most compelling story from each dataset that we could visualize on the new homepage. With each visualization I aimed to incorporate headshots to humanize the players and foster those relationships for fans.

Hot streaks

Speaking with longtime hockey fans about when they care about stats, there were two scenarios that emerged; pre-game and the bar bet.


Before a game they want to know how their opponent and its stars have been playing lately. The idea and language of “hot streaks” is prevalent in hockey culture, and fans wanted an easy way to visualize that.

Hot streaks

Speaking with longtime hockey fans about when they care about stats, there were two scenarios that emerged; pre-game and the bar bet.


Before a game they want to know how their opponent and its stars have been playing lately. The idea and language of “hot streaks” is prevalent in hockey culture, and fans wanted an easy way to visualize that.

Hot streaks

Speaking with longtime hockey fans about when they care about stats, there were two scenarios that emerged; pre-game and the bar bet.


Before a game they want to know how their opponent and its stars have been playing lately. The idea and language of “hot streaks” is prevalent in hockey culture, and fans wanted an easy way to visualize that.

The bar bet

In our conversations about stats with fans, they told us about the debates they get into with friends, frequently at a bar, over whether Sidney Crosby could beat Wayne Gretzky’s points record, or who was the best American winger to play for the Colorado Avalanche. They expressed a desire for tools that would help them work with data to settle these arguments.


To answer these obscure and sometimes absurd questions that spark debate among fans, they’d need both access to a lot of data and ways to filter and analyze it. While the NHL worked on digitizing paper stats from the very beginning of the league, we designed an advanced set of options for filtering it.


In addition to the “moment in time” that a data table can show, we designed a way to see the trends over time. As the race for the most points heats up throughout the season, this allows fans to see how players got there. We also integrated the highlight videos directly into the charts for certain stats categories to leverage one of the league’s best assets.

The bar bet

In our conversations about stats with fans, they told us about the debates they get into with friends, frequently at a bar, over whether Sidney Crosby could beat Wayne Gretzky’s points record, or who was the best American winger to play for the Colorado Avalanche. They expressed a desire for tools that would help them work with data to settle these arguments.


To answer these obscure and sometimes absurd questions that spark debate among fans, they’d need both access to a lot of data and ways to filter and analyze it. While the NHL worked on digitizing paper stats from the very beginning of the league, we designed an advanced set of options for filtering it.


In addition to the “moment in time” that a data table can show, we designed a way to see the trends over time. As the race for the most points heats up throughout the season, this allows fans to see how players got there. We also integrated the highlight videos directly into the charts for certain stats categories to leverage one of the league’s best assets.

The bar bet

In our conversations about stats with fans, they told us about the debates they get into with friends, frequently at a bar, over whether Sidney Crosby could beat Wayne Gretzky’s points record, or who was the best American winger to play for the Colorado Avalanche. They expressed a desire for tools that would help them work with data to settle these arguments.


To answer these obscure and sometimes absurd questions that spark debate among fans, they’d need both access to a lot of data and ways to filter and analyze it. While the NHL worked on digitizing paper stats from the very beginning of the league, we designed an advanced set of options for filtering it.


In addition to the “moment in time” that a data table can show, we designed a way to see the trends over time. As the race for the most points heats up throughout the season, this allows fans to see how players got there. We also integrated the highlight videos directly into the charts for certain stats categories to leverage one of the league’s best assets.

Enhanced stats

Our conversations with new fans highlighted the need to provide education on the advanced stats, both what they are and what they could say about the performance of a team or player. It presented an opportunity to deepen the casual fan’s engagement with the sport.


The launch of the new stats site would be the first time in the league’s history that it would embrace a new set of advanced stats. Rather than linking fans directly to the data tables, we created a page to introduce and explain the new stats.

Enhanced stats

Our conversations with new fans highlighted the need to provide education on the advanced stats, both what they are and what they could say about the performance of a team or player. It presented an opportunity to deepen the casual fan’s engagement with the sport.


The launch of the new stats site would be the first time in the league’s history that it would embrace a new set of advanced stats. Rather than linking fans directly to the data tables, we created a page to introduce and explain the new stats.

Enhanced stats

Our conversations with new fans highlighted the need to provide education on the advanced stats, both what they are and what they could say about the performance of a team or player. It presented an opportunity to deepen the casual fan’s engagement with the sport.


The launch of the new stats site would be the first time in the league’s history that it would embrace a new set of advanced stats. Rather than linking fans directly to the data tables, we created a page to introduce and explain the new stats.