The Single Source of Truth for all lore about Riot’s game IPs (League of Legends and others)

Project Length

March 2018 to October 2019

My Role

Lead UX, User Research and Testing

Background

The League of Legends IP, referred to by the name of its universe, "Runeterra", was generally considered a fractured mess when I arrived at Riot in 2018. Since 2009, much of Runeterra's lore lacked consistent documentation, and a massive lore reboot in 2014 resulted in even greater misalignments on what was true about its characters, events, and worldbuilding. It was often exceedingly difficult for Riot content creators and outsource partners in comics and film to do their work because of how confusing the Runeterra IP was to understand. This resulted in a negative trickle-down effect on our players, many of whom are interested in engaging with Runeterra content, but are unsure of how to piece together its disparate parts.

Goals

Our goal was to deliver a searchable and interactive database of articles containing everything about the Runeterra IP since 2009, including both current and outdated lore. This would serve as an authoritative resource to help Riot content creators understand the Runeterra IP, maximize their workflow efficiency, and deliver content for our lore-hungry players.

User Research

User Research

Before designing the tool, we had to understand the needs and pain points of our users.

We identified two major groups for the Lore Archive.

Primary users: Outsourcing managers (comics, film), writers, editors, worldbuilding artists, artists on product teams. Total: 200+

Secondary users: All other Rioters. Total: 3000+

We ultimately wanted all Rioters to use and gain value from the Lore Archive, but only a core group of creators and outsource managers at Riot would directly benefit from using the tool. They were approximately 200 or so people, a small number compared to the greater Riot org, but the products these Rioters impacted, were very large and expensive bets.

Leading the user research, I worked with my team to conduct dozens of interviews with representatives from each of our user segments to capture their pain points and current lore research workflows analyses.

I ran card sorting workshops with our users to determine their mental models for how they perceived elements of the Runeterra IP to be organized. The results of these workshops revealed our user mental models - how our users conceived of the lore of Runeterra and how it was most logically organized according to their understandings of it. This in turn provided the basis for our database ontology.

Ontology

After assembling our user mental models, we put together the categories, properties, and relationships of all things in Runeterra’s lore. What we uncovered was that many entities in our future database were connected in ways that subverted our early understandings of how they ought to be organized.

Creating the ontology of the Lore Archive was laborious but essential. When we completed it, we had essentially created the majority of the information architecture, navigation, and search categories of the entire tool.

Early Design Exploration

As I began designing, my goal was to ensure that the Lore Archive article pages were "wiki"-like in presentation, as our target users mentioned frequently that they relied heavily on Wikipedia and the League of Legends fan-wiki during their research and preferred its organizational structure.

The early wireframes for the Lore Archive emphasized high functionality. Considering users' different search and browsing behaviors, we included an omnipresent search bar; sticky in-page navigation to provide fast jumping to sections on a page; and global navigation to portals with high level overviews and phonebook-style links to more articles.

User Testing

While designing the core structure of the basic Lore Archive page types, we also tested periodically with real users. I created and ran tests with representatives from each of our user segments by assembling wireframes into InVision interactive prototypes.

Final Designs - Lore Archive Page Types

Final Designs - Lore Archive Page Types

The Lore Archive designs went through a polish pass with the help of our visual designer to achieve a look that matched the internal Riot tools brand. We ended up with approximately 12 different major page types which served as the templates for literally tens of thousands of articles written by our Lore Archive editing team.

Final Design - Article Pages

The bread and butter of the lore archive. There are tens of thousands of articles on everything in the Runeterra IP (e.g. characters, NPCs, places, weapons, food, mythology, languages).

Final Design - Article Pages

Final Design - Faction Portal

Final Design - Faction Portal

Final Design - Search Results

The workhorse of the Lore Archive. Search results can be filtered by content type (articles or original sources), tags (categories), and canonicity.

Final Design - Search Results