Case Study
Encouraging Ranked Play in League of Legends
A concept redesign of the ranked tab — making competitive play less intimidating for new players, and more rewarding for the dedicated ones.
A concept redesign of the ranked tab — making competitive play less intimidating for new players, and more rewarding for the dedicated ones.
League of Legends is Riot Games' flagship MOBA and one of the most-played PC games in the world. Teams of five pick from 160+ champions, each with their own abilities and playstyle, and race to destroy the enemy's base.
With a massive cosmetics economy and a booming esports scene, League spans the full spectrum of players — from the purely casual to the fiercely competitive.
MOBAs are notoriously hard to break into, and League is no exception.
Try getting a new player to explain what's happening here. (They probably can't.)
With a steep learning curve and a high bar to entry, growing the ranked community means making it inviting to the casual player — and worth the grind for everyone who shows up.
I looked at the third-party tools players already rely on — OP.GG and U.GG — to understand what a leaderboard needs to feel useful.
Both spotlight the #1 player and show win-rates with clear graphs and percentages. The key difference: OP.GG also surfaces each player's top three champions — a small touch that makes the board feel personal.
The existing ranked tab is lackluster. Nothing connects a player to the leaderboard beyond a list of names, and the stats players actually care about aren't there. In practice, most players finish a game and leave the client entirely — opening a separate app or browser just to check their progress.
A survey of 41 players made the emotional gap clear.
Ranked players are also the most engaged with the wider ecosystem — community events, esports viewership, other Riot titles. Converting casual players into ranked players doesn't just help ranked; it lifts everything around it.
Before sketching anything, I organized the survey responses into the four needs that came up most.
Motivating the newcomers, rewarding the veterans — all inside the client, so players never need to leave to see how they're doing.
Profile pictures and each player's top three champions make the board feel like people, not a name list.
CS, KDA, and vision — the numbers players were leaving the client to find — now live in the tab.
Clear milestones and the next goal, always in view, so the grind has a visible payoff.
The player's three best games, surfaced so they can rewatch and learn from their own peaks.
The research set the priorities: stats like KDA, CS, and vision; a board that feels personal with top champions; rewards tied to attainable goals; and a dedicated space to track progress.
Rewards apply the moment a player hits a milestone — the divisions within each rank (I, II, III, IV) — all the way up to Diamond. Master and above have no divisions and, per the research, are already competitive enough not to need the extra nudge.
But everyone who invests the time deserves the payoff. So at season's end, players can still claim every milestone they've passed.
Example: a Platinum III player can go back and collect all the earlier rank milestones — Gold, Silver, Bronze, Iron.
This was a passion project, and it showed me how much research design hinges on the questions you ask. My first survey was worded loosely and some responses came back unusable — once I tightened the questions, the answers got sharp enough to actually build on.
The most rewarding part was the design system. After reading Riot's published design blog, I studied League's typography, color, and hierarchy closely and worked within it, rather than imposing my own style. Seeing how they build something intricate yet seamless gave me a real respect for the craft — and the discipline of designing inside someone else's system is a skill I wanted to prove I had.
Next, I'd run more usability testing and explore bringing the same system into the post-game screen.
