Back to work

Archive · 2019–21

Client
Blizzard Entertainment
Role
Product Designer
Year
2019–2021

Overwatch Ana UX Redesign

Overwatch

Overwatch Ana UX Redesign

overwatch-ui-redesign
overwatch-ui-redesign

Part 1 - Matchmaking Game System

Challenge: The current matchmaking interface does not allow the player to create their own personal preferences when joining matches from the Play menu

Solution: A robust and qualitative matchmaker menu to maximize inclusivity of all play-styles

Target Audience: Players who feel their play style is not being supported by the current matchmaking system.

“Support variation in play styles, again this is something that Overwatch does a good job with, for example with Bastion not requiring jumping, fast movements or precise aim.”

Ian Hamilton, UX Designer

overwatch-ui-redesign

Key Insights from Ian:

When coming up with solutions for inclusivity, it is critical to consider the following areas..

Support variation in play styles, Overwatch already does this well with

all of the playable heroes it has to offer.

Current Sitemap

Sitemap created with Overflow
Sitemap created with Overflow
Low-fi UI Flow - This illustrates how the different queues link back to the Main Menu and how the Preferences menu links back to the Play menu
Low-fi UI Flow - This illustrates how the different queues link back to the Main Menu and how the Preferences menu links back to the Play menu
Proposed IA Map - Matchmaking Preference
Proposed IA Map - Matchmaking Preference
overwatch-ui-redesign

Menu Prototype

Disclaimer: Players can only join matches with other players who have the same or similar matchmaking settings as them.

Ex; All players in a match have Aim Assist toggled ON.

Part 2 - Ana Biotic Rifle Redesign

Challenge: The scope view for Ana’s Biotic Rifle is not intuitive during high intensity gameplay

Solution: A streamlined scope view that focuses on player immersion and target accuracy

About The Bionic Rifle

The rifle functions as a dart gun, which fires darts filled with a biotic solution that are injected upon impact with the target. For this purpose, Ana carries multiple darts with different effects, including healing darts and offensive darts.

It carries fourteen rounds in a single clip and is able to affect both teams, healing allies for 75 HP and dealing 70 damage to enemies. It comes equipped with a scope which makes Ana's shots hitscan at the sacrifice of vision of her surroundings and movement speed.

In-game view of the bionic rifle.
In-game view of the bionic rifle.
overwatch-ui-redesign

Redesign Process - Biotic Rifle Scope

Current User State

overwatch-ui-redesign

The current state of the biotic rifle is very basic. The user is able to either use no scope or opt to use the scope, which is toggled with either the left trigger on an analog controller, or the right mouse button.

The Biotic Rifle shoots darts, if these darts hit an enemy then they will cause damage, if they hit a teammate they will heal the teammate. With this being said, there are no linear micro transactions between using a scope/no scope and targeting an enemy/teammate. This causes a cognitive conundrum for the player, especially in fast paced action.

The biotic rifle is primarily used for healing, so from a UX standpoint I think it would be interesting to add a special feature to the biotic rifle to enhance its healing capabilities. Something that makes the biotic rifle special from other weapons is its scope ability and unique hitscan

overwatch-ui-redesign

Redesigned Solution - Biotic Rifle Scope

overwatch-ui-redesign

For my redesigned solution. I knew it would be important to incorporate other UI elements into Ana’s Biotic Rifle, making Ana look and feel unique to the player, while still harnessing the powerful interface elements that are pre existing. Some other interface elements that were particularly important and consistently used were her Ability #1 (Sleep Dart) and her Ability #2 (Biotic Grenade).

Another notable part of the interface that is particularly important for a first person shooter is Ana’s ammo count. In competitive moments or intense action, it can be crucial to know when to manually reload.

Lastly, because the Biotic Rifle is primarily used for healing, I wanted to add confirmations in the scope view as to when Ana is targeting a friendly player. This confirmation works with the engine to determine the distance of the teammate and the velocity of the dart being fired.

Redesigned Scope View
Redesigned Scope View
© 2022 Liam Maheu
© 2022 Liam Maheu
Next project

Psyonix

View project