League of Legends Data Blog (Clairvoyance)

« PORTFOLIO

League of Legends Data Blog

 

 
jungle.jpg

The Clairvoyance Blog is a player-facing data editorial series that focuses on storytelling through data. The articles range from deep dives into the math behind some of our most interesting analytics projects to fun data celebrations of our favorite characters.

This was one of the most successful editorial series on the League of legends website, averaging 500,000 unique page views per article, with our most successful article sitting at 1,200,000 unique views.


goals

blood-gromp.png
  • Increase player trust: We want to show that player sentiment and actions impact the work we do by exposing our thought process. This also means showcasing in-game player behaviors that give players a better understanding of what they are doing (or not doing) to win games.

  • Engage players who love data products: Within the community, there is an inherent interest in the numbers behind the game. Because we have a wealth of data that players do not typically get to access, this blog creates an avenue for players to get further excited about League of Legends data, trends, etc.

  • Externalize the Insights Brand: Having a data blog that shows the richness of the data we have and reveals the way we work with it can garner interest in the Insights team and, therefore, attract talent in the community who may be interested in working with us. It is also a way for other internal Rioters to see our work and get interested in collaborations.

  • Boost Insights x Player Interactions: Oftentimes, the work of our analysts, researchers, and data scientists do not touch the players directly. This gives them a way to speak directly with players and showcase the work that they’re proud of to the community.


my role

I was the product owner and designer, working alongside an editor and various analysts, researchers, and data scientists to tell stories on a monthly cadence. My duties included:

  • Sourcing articles

  • Working with analysts to create narratives within the data

  • Developing visual brand

  • Creating illustrations and data visualizations

  • Managing localization pipeline

  • Laying out the article & coding it (HTML, CSS, Javascript)


article design

Warding & You by Riot Jules

This was the first article we released back in winter of 2015. Because we were very limited on resources and time, we strived to create a style that would be easy to produce quickly, stand out amongst the other articles on the site, look inspired by data, and not distract from the data visualizations.

Here is where we began to establish the foundations of our visual style:

  • Flat, clean geometric shapes

  • Subtle line art for spaces that lack visual interest

  • Slightly desaturated color palette

Other examples:

The Evolution of Kaisa by Riot Jag and Riot Blaustoise

Executed: The Terrible Truth Behind Jungle Monsters by Cactopus and Tamgros

Riven vs Yasuo: 1v1, Data Only by Jeopardy and Riot Blaustoise

Ethernet vs Wifi by Viscarious


data visualization

While the illustrations were meant to draw players in, the story was what got players to deeply engage with the article. After we found a story within the data, we crafted visualizations that directly related to the copy, allowing for a seamless flow in and out of data and words. In cases where there was value to provide large data sets, we created tools or interactive visualizations to allow the reader to choose their own adventure.

Bard’s Big Birthday Datapalooza by Riot Blaustoise

In celebration of Bard’s birthday, we worked with a researcher and passionate Bard-player, Nathan Blau, who took a deep dive into all the nitty gritty numbers that make this curious wanderer who he is.

We paired Nathan’s meandering explorations with equations and supporting diagrams to help readers follow along on this magical journey. The experimental nature of this article helped us push the boundaries of what we thought could do and gauge player reaction to some of our new visualization experiments.

Other Examples:

Finding Your Lunch Table by Jeopardy and Riot Bilby — Interactive visualization of clustering

Executed: The Terrible Truth Behind Jungle Monsters by Cactopus and Tamgros — Stacked bar graph, categorized by color

Warding & You by Riot Jules

Heating Up: How the Pros Warded at Worlds by Acetaminophen and Boom Bear — Heat maps based on coordinates

Riven vs Yasuo: 1v1, Data Only by Jeopardy and Riot Blaustoise

Ping, Winrate, and Vayne Probs by Christokkies — Line graph of winrate probability


the results

The Clairvoyance Blog went on to be one of the most successful editorial series on the LoL website, and later, on the new LoL editorial blog, The Nexus.

  • Views: We averaged 500,000 unique page views per article, with our most successful article sitting at 1,200,000 unique views within a month of publishing.

  • Engagement: All of our articles averaged 10+ minutes of time spent on the page actively. Although this measure isn’t reliable on its own, we were able to compare it to the numbers for other editorial content on the site as a way to gauge the success of this metric.

Anecdotally, we consistently received positive feedback and a flood of ideas from the community for new articles. Our team became more engaged on the forums and social media, and players seemed to find a lot of joy in going on these data explorations with us. I have such a deep love for this project, and I am so grateful to have had a chance to be a part of it.


noblood-raptors.png
mushroom-01.png
noblood-redbuff.png