League of Legends

As a UX Designer on the League of Legends team, I was responsible for designing end-to-end features and systems, both in-client and in-game.

I collaborated with production, engineering, visual design, motion design, QA, and even at times narrative to ship features such as event minigames, pick order swapping, and various in-game QOL improvements.

Star Guardian: Another Sky

Star Guardian: Another Sky was a visual novel-style minigame released in July 2022 as a part of that summer’s Star Guardian-themed event. The story consisted of multiple chapters, with each chapter divided into three acts that were both time- and progression-gated.

I was responsible for designing the interface for the tutorial, navigation hub, and “Bonds” - where players could check how close their relationship was with each featured Star Guardian character and read their individual character stories.

I joined this project relatively late (during the Production phase), but led the redesign for the overall navigation and flow after pivots were requested by leadership.

The original design of the Another Sky hub consolidated both the Bonds and visual novel stories into one screen, by showing the unlocked characters and combined team strength that would help unlock the next act or chapter.

However, the design proved to be too confusing and complicated for players to intuit what each individual component meant, and how the overall system worked.

The revised design separated the stories into two sections - Main Story and Guardian Stories - so players could easily access the main story elements and rewards and navigate to the Bonds/extra Guardian stories at their own leisure.

Unrecoverable Health

Originally intended as a part of a scrapped ARAM variant mode, this feature remained relevant because of the development of the champion K’Sante. K’Sante’s ultimate, All Out, reads as follows:

All Out: K’sante loses a percentage of max health, bonus armor, and bonus magic resistance. K’Sante gains attack damage, omnivamp, and transforms his abilities.

I was responsible for designing the appearance of this new “reduced max health” treatment, and ensuring it didn’t visually conflict with any of our existing health bar statuses.

Visual exploration for unrecoverable health treatment. Inspirations for its appearance largely came from fighting games and even some mobile games like Cookie Run: Kingdom or Epic Seven.

My “nightmare scenario”: a health bar with every existing treatment + unrecoverable health on it.
I used this as a visual litmus test for clarity compared to the other existing treatments.

Pick Order Swap

Pick order swapping was a quality of life feature released in December 2022 for champion select in draft queues. Players in draft pick games wanted to formally swap their pick order instead of informally communicating via chat, which was often unreliable and hectic. The team also considered the possibility for “role swapping” during champion select, but scrapped the concept early on due to overcomplexity.

I was responsible for this feature’s interaction design, as well as integrating this feature into the existing champion select system.

Soul Fighter: Tournament of Souls

Soul Fighter: Tournament of Souls was a combo-battler minigame released in July 2023 as part of that summer’s Soul Fighter-themed event. As Samira, players would face off against various opponents in fighting-game-inspired 1v1 battles. While the characters would attack each other automatically, the player could strategically utilize and time certain pressed-key combos that would inflict certain status effects and damage.

I was responsible for the end-to-end design of this minigame, which was the first large-scale minigame built in Unity WebGL. We had previously experimented with Unity WebGL on a smaller scale with Cupcakes 4 Heartaches, a small-scale minigame that launched only on the OCE server.

Player Journey

Iterations vs Final

My Bad Interactive Emote

In response to the positive player reception that the “Fistbumps” feature received in 2023, “My Bad” was a follow-up reaction for players to express that they were sorry or at fault.

Unlike the innately net-neutral-to-positive interaction that Fistbumps originated from (celebrating teammates’ accomplishments), the challenge of “My Bad” was encouraging prosocial behavior from an initially net-negative interaction (apologizing when a mistake was made).

✅ Goals

  • Decrease severity of negative social behavior/activity in League of Legends

  • Design a low-stakes solution that is low-cost in development

⛔ Anti-Goals

  • Players use this interaction in a toxic/sarcastic manner like question mark or bait ping that increases disruptive behaviors

  • Design/implementation of “My Bad” too closely follows Fistbumps without considering different use cases and context, results in toxic interactions and experience

v1 Iteration (A-poro-gy)

The initial iterations featured a sad poro appearing over the initiating player’s head, with players responding in a way that would cheer the poro up before disappearing.

If no one responded to the initiating player, the poro would pick itself up and determinedly brandish a sword before disappearing.

We wanted the player to feel uplifted and resilient whether their teammates responded to them or not, and encourage the idea of moving forward even if mistakes were made.

Final Iteration

As we neared production, we ran into feedback that using an articulated, complex shape like the poro risked clarity confusion for players, since the existing poro models could blend in very easily with the surrounding map environment. By quickly working with Art, we were able to settle on reusing the hand asset but animating the hand to try and still preserve those themes from the initial iteration.

Jinx Fixes Everything

Jinx Fixes Everything was a point-and-click minigame released as a supplementary experience with the release of Arcane Season 2. Playing as Jinx, players would explore various settings from the world of Arcane and solve various puzzles to accomplish Jinx’s goals.

This minigame was a significant challenge even compared to its predecessor because of its immense scale and asset requirements. Built in Unity WebGL, I led the end-to-end design for this minigame and worked to polish both the client and in-game experience.

Player Journey (outside the minigame, within client)

Player Journey (within the minigame)

Wireframes

One of the challenges with this project was that each room and its corresponding puzzles were still very early in-development or not started when I began working on the user experience. I communicated frequently with game designers, engineers, and narrative designers to try and approximate what features would theoretically be needed and designed broad wireframes that would utilize those interactions and features.

🆕 Settings and Accessibility

While other designers and I advocated for including more settings for accessibility and customization in the past, scope and time limitations made it difficult to follow through on implementation. Much of the feedback we had received from minigames like Soul Fighter mentioned mild-to-moderate frustration with the lack of ability to change settings when the defaults we’d implemented were incompatible or inconvenient to players’ various environments.

With regular consultation from Riot’s Accessibility COP and using the Game Accessibility Guidelines as a foundation, we were able to add several adjustable Graphics, Audio, and Control settings to improve the overall experience for players.

Season Start 2025

I assisted and led various projects - both in-game and around-game - leading up to League of Legends’ reveal of the new “Seasons” format for the start of the 2025 year.

These include:

  • Atakhan (in-game)

  • Feats of Strength (in-game)

  • Battle Pass (around-game)

  • Client support for RTL languages