League of Legends is one of the world's most popular multiplayer online battle arena (MOBA) games. Despite its popularity, its onboarding experience introduces only the basic controls, leaving new players to learn many of the game's core systems on their own. This project explores how a modular tutorial system could better prepare new players for real matches while reducing cognitive overload.
Role(s)
UX/UI Designer
Duration
5 weeks
New Players Are Expected to Learn Too Much, Too Soon
The Problem
League of Legends is one of the most mechanically complex multiplayer games available, yet its tutorial teaches only the basics. New players often enter their first matches without understanding objectives, roles, or vision, forcing them to rely on external guides or experienced friends to learn.
Desk Research
I reviewed Reddit discussions, YouTube videos, and community forums to understand common onboarding frustrations. Across these sources, players consistently described the tutorial as too basic and relied on external guides to learn the game. I also found that long tutorials are often skipped, reinforcing the need for shorter, modular learning experiences.
Competitive Analysis
I compared League of Legends against Dota 2, Smite, and Mobile Legends to understand how other MOBAs introduce new players.
User Interviews
I conducted interviews to better understand how players learn League of Legends and where the current tutorial falls short.
Key Findings
%
Participants said the tutorial did not prepare them for real matches.
%
Participants relied on external resources to learn the game.
%
Participants felt overwhelmed by the number of mechanics introduced.
How might we help new players understand how real matches work beyond basic controls when they first start playing League of Legends?
And…
How might we make new players feel less overwhelmed as they are introduced to multiple game systems at once?
And…
How might we support new players in learning the game without solely relying on external resources or experienced friends?
Balancing User, Business, and Project Needs
Before defining the solution, I mapped the relationship between user needs, business goals, and project constraints to ensure the design addressed all three.
The Solution
Rather than expanding the existing tutorial into one long experience, I redesigned onboarding as a modular learning system. Players complete five core modules covering the game's essential mechanics before choosing optional role-based tutorials that match their interests. This approach applies progressive disclosure, introducing complexity gradually while giving players more control over how they learn.
Core Modules
Optional Modules
User Flow and Task Flows
I created a user flow to map how users would navigate the new tutorial, then I mapped out task flows to visualize how users would complete key tasks.
(Switch to "Task Flows" page to view the task flows).
With the tutorial structure defined, I used low-fidelity sketches to rapidly explore different layouts for the tutorial hub and learning modules. Working on paper first helped me refine the flow before adapting the designs to League of Legends' established interface.
Usability Testing
The first prototype focused on the movement module, allowing me to validate the modular tutorial concept before expanding it further. I conducted moderated usability testing with 5 League of Legends players to evaluate the tutorial's clarity, navigation, and overall usability.
%
Successfully completed the movement module.
However, testing highlighted several opportunities for improvement.
%
Suggested replacing XP rewards with Blue Essence, as it would provide greater value for new players by helping them unlock champions earlier.
%
Suggested that first-time players should be automatically directed to the tutorial hub instead of needing to locate it themselves.
%
Were unsure how much of the Core Tutorial was required to be completed before entering a real match.
%
Felt that the different visual treatments between core and optional modules made the experience feel less cohesive.
%
Expected to continue directly into Part 2 after completing Part 1 of the Core Tutorial.
Changes Implemented
Designing for an existing product brought a unique set of challenges. Rather than creating something entirely new, I had to respect League of Legends' established visual language and gameplay while identifying opportunities to improve the new player experience. Although this is a conceptual redesign, it demonstrates how thoughtful onboarding can make complex systems more approachable without compromising depth.
Some Things I've Learned
Research and usability testing reinforced that the strongest design solutions come from observing real user behaviour rather than relying on assumptions.
Breaking complex systems into smaller, manageable steps helps users build confidence without feeling overwhelmed.
Good onboarding isn't about explaining everything at once. It's about introducing the right information at the right time.