Designing Log In Screens
Mojang Studios is a AAA video game developer known for developing the sandbox and survival game Minecraft, the best-selling video game of all time.
Role
UI Designer
Tools
Figma
Team
UI Designer
Illustrator
Copywriter
Duration
12 weeks
How Do You Make A Log In Prompt that Entices Players to...log in?
As a larger push from Xbox, Mojang Studios was migrating it’s Mojang Accounts to Microsoft Accounts (MSA).
Challenges:
-
Low Migration Rate
-
Lack of recognition from players that Minecraft was associated with Microsoft
-
Outdated Log In Pages
Solution
Starting with sketches, we redesigned all log-in screens by including:
-
Fun animations
-
Explanation of benefits of logging in
-
Update UI that included elements of MSA log-in to connect brands
Design Process
Mojang had started migrating users from Mojang Accounts to Microsoft Accounts, as part of a push under Xbox to unify the studios. With this, I was tasked with redesigning the look and feel.
We started focus on Minecraft Bedrock edition, instead of Java, and then focused on Minecraft Dungeons. From there, we went through to identify all the potential points of entry that would be necessary. This came to be about 12 pages.
As Minecraft is primarily played on mobile devices, we focused on a mobile-first design.
We knew we wanted to introduce the updated UI, colorful images and animation that best represented the brand, and copy that exemplified the Minecraft jargon.
Simply put, here's what we needed to do:
We needed the style to match the updated Ore stylings that Mojang adopted
We wanted the feel to have that classic Minecraft charm, so I designed a series of animations for each section.
The Copy was very intentional, as we wanted relay the benefits of logging into a Microsoft Account.
What were the current screens like?
Login screens in the game were original to the earliest releases and hadn't been updated since. The UI was outdated and the copy didn't reflect the tone that is so definitely Minecraft.
What did we want the sign in to look like?
Each Section had their own purpose, so each experience from was tailored to the potential intent behind logging in. That meant custom animations and custom copy.
Sign In Process
We have the screens, what next?
With the UI Settled, our team partnered with an internal Microsoft team to design a function sign in process.
But why? Well, the low migration rate was a two fold operation.
- Part 1 was convincing people as to why to log in.
- Part 2 was about ensuring that users knew where they were logging into
We met to discuss ways to better represent to the user that their MSA login was still a part of their game. Setting this process was vital so other studios could follow these plans as Xbox rolled out wider sign-in migration plans as they unified under Game Pass.
We focused on introducing elements of the game's feel into the sign in screen, ensuring to include mods for interactivity and the day/night cycle for progression cues. Designs are not included due to NDA's
Outcomes
This was for sure the funnest project I've had the honor to work on, resulting in screens that were truly fun and engaging, if only rarely seen. The nature of log-in screens is that once you're logged in - you're done. A major goal was to reach the oldest players who have had Mojang Accounts since (at the earliest) 2011, before the migration deadline.
Regardless, the sign-in modules got a much-needed makeover that's worthy of the title.