The League of Legends loading screen is the screen players see as they wait for everyone to load in. Containing important game data to help players start strategizing for their upcoming game.

ROLES: Product Design / Visual Design

Project Details

Every player that plays League of Legends spends time at the loading screen. This high traffic touchpoint hadn’t been touched for close to 8 years. The entire League of Legends experience around the loading screen had been rebuilt. Leaving the loading screen feeling dating and not capable of supporting new content types.

In addition to adding new functionality, this was an opportunity to take the Hextech language of the League client and expand it to the loading screen. Simultaneously, “Ranked Reforged” was being actively built and would need to be incorporated into the player frames.

The screen has been designed to be modular so if features go down or are deprecated the interface can adapt to accommodate the change.

Original Version

Built around the same time that League was launched the old loading screen suffered from an outdated visual approach. This contributed to a lack of strong hierarchy and scannability.

Redesigned

I refined the card anatomy to simplify the cognitive load on our players. By defining a guiding principle that the front of the card is the player’s identity in that specific game and the back side of the card is the player’s social identity in the League ecosystem. The back of the cards initially celebrated “Ranked Reforged” and champion mastery but were built with flexibility in mind.

Eternals Integration

When we launched Eternals the feature slotted into the back side of the player card and champion mastery truncates.

Next project
Nike+ Run Club