The League of Legends Coaching App
Summoner's Lift
Summoner's Lift
Give a Lift to Your
A League coaching app designed to give recommendations on items, spells, playstyle, strategy, objectives and more!
Project Duration
Since November 21st, 2023; roughly 3 weeks
Project Scope & Methods
Surveys, Interviews, Affinity Mapping, Personas, Wireframing, user journeys, user flows, Usability Testing, prototyping, m0ckup & UI, programming
My Responsibilities
Everything 100%. This is a solo passion project
Result/Status
Ongoing: Currently in iteration and user testing.
Background Context
After spending a night at Riot Games LA for the Worlds 2023 event, I had the pleasure of connecting with the people behind my favorite game (League) and my favorite show (Arcane), and was inspired by multiple Rioters to shoot my shot at becoming part of the dream!
I have worked relentlessly in whatever spare time I can find to learn about Riot and our values, and pursue a passion project that embodies them by putting players first!
In making this app, I wanted to help solve real problems for real players!
Step 1 Discovery & Research
Brainstorming
Player Empathy
The very first step is to ask the following 3 fundamental questions. The questions and answers serve as a mere hypothesis to stage the right questions and research, not to directly inform design decisions. It is, after all, all about the user!
Interviews
Asking the Right Questions
On your left, you’ll see the interview questions I asked several different League players to get a better understanding of their goals, needs, motivations, feelings, behaviors, & opportunities while defining the problem at hand. Notes were taken on empathy maps like the one below.
Step 2 Analyze & Define
Key Insight
Problem Statement
Playing and understanding League of Legends can be challenging, especially for novices. New players may not understand game mechanics like runes, items, abilities, and champions, and need an easy and less stressful way to find and understand that info. Potential or returning players may feel lonely or intimidated by all the new info and expectations. Some players are skilled but are not good teachers or coaches, and get distracted & frustrated holding another player’s hand. Some players want a way to encourage their friends to join League so they’ll feel less alone. Some players are simply eager to improve their craft and rise through Elo hell but are confused how to go about it.
Key Insight
Potential Solutions
Reasearch
Competitor Analysis
User Analysis
Personas
Here are the persona types of players I will initially focus on, for the first phase of agile development for the app. Many users of these personas feel underrepresented in other guides and coaching apps for either their skill level, knowledge level or preferences with regards to complexity.
Top Frustration Tags:
Phase -------->
Tasks->
Detailed actions our user is likely to perform
Mindsets->
What our user might be thinking and feeling at the moment
Pain Points->
Detailed actions the user is likely to perform. Frictions and pains encountered by users at each phase
Opportunities->
What you can propose with your product or service to solve the user needs and pains
User Analysis
User Journey Mapping
I mapped out a grid of user’s complete behaviors on their way to find guidance and support while playing League of Legends, including Tasks, Mindsets, Pain Points, & Opportunities during several phases including Awareness, Consideration, Onboarding, Engagement, Improvement, & Advocacy.
Project Goals
Project Briefing
Deliverables
Success Criteria
Step 3 Ideate
Information Architecture
User Flow
Low Fidelity Designs
Wireframes
Here are some of the earliest design ideations I came up with, some low-fidelity wireframes and light markup.
The designs themselves are not set in stone, but they provide good staging ground to outline page requirements for the UI design phase.
Step 4 Prototype & Design
High Fidelity Designs
Prototypes
This is the step I am currently working on! Normally in UX, the next step would have been to do a more low to mid fidelity digital prototype, but since I am personally building the UI myself, I decided to go for a high fidelity mockup.
Please keep in mind, many of the pages are still being designed as you’re reading this 🙂
Be sure to check back for updates!
Step 5 Test & Iterate
Current Status
Iteration in Progress
Since this is a currently ongoing project, this step, along with previous steps, are still in progress. Feedback on the design has already been given. Some design changes are minor, such as changing the avatar on the bottom left icon to show a face more prominently to illicit more positive emotions and connection. Some changes are more significant, such as adding in match notifications and a clearer control scheme and a brief intro tutorial about how the app works.
Below is the current state of app’s main page with annotations of wqhat is currently being worked on.
Summary
Retrospect
Although the project is still ongoing, it is clear that the needs of the users are complex and will need more attention than a single person can handle in two weeks in their spare time 😅 I knew it was a huge undertaking with very high constraints, but I knew I had to try and continue to try to demonstrate just the tip of the iceberg of what I can contribute to the player experience.
I will continue to update this and intend to have a working interactable prototype up here very soon, so be sure to check back… or better yet, contact me (info below) so we can talk about how I can give players an amazing experience they won’t soon forget 😀
Acrhive
Other Projects I've Done
Get In Touch
If You Enjoyed Learning About Me or Want to Know More, Let's Chat 🙂
