UI Design Pattern in Overwatch 2 and resulting User Experience
1. Description & Prombt:
I wrote in my thesis about #uidesignsystems in the game genre shooter, and 1 example was #overwatch2.
In this project I will detaily display my version of a UI Design System for Overwatch2 and a new menu, to get the styles consistent as well as the control in the menus. I will show how Overwatch 2 can handle User Experience Design Methods and actual player experiences from my Master thesis.
With the following portfolio I will show some issues I found while playing, researching and asking players and designers for they knowledge and opinion.
2. Times:
09/10/2022 - 03/28/2023 Full Time. 7-9 hours a day
09/10/2022 - 12/01/2022 Research, Questions Experts, Survey Players
12/02/2022 - 02/21/2023 Writing, Designing, Corrections
03/01/2023 - 03/28/2023 Presentation, Training
3. Overview:
a. WYSIWYG - What you see is what you get - charts, short, precise and summarized input
b. UX in OW2, target groups, problems
c. solving UI and UX problems
d. making UX better with UI and UX principles
3: UX in Overwatch 2
New and returning Overwatch 2 players are the target audience. Overwatch 2 had some changes in the past, which allowed the designers to provide a better experience in the application and the game itself.
In my research I found out that most players do not consider Overwatch 2 to have a fair and consistent design solution for the Players.This issue could lead to others and could get the players to decide to deinstall the game.
Some Players I asked already took the final step and completely dis-installed Overwatch 2 completely.
So let's take proto-personas to use for the UX in Overwatch 2:
The following proto-persona where seen in Overwatch 2 Games and Playertest. Names and Personal Information were changed toprotect the people and players.
- Profile 1 competetive type:
- Name: Brit - Female, 22 - open to talk in video games
- brought Overwatch in 2014
- likes and main Widowmaker and has an overall KDA of 20/3/11 with her.
- She is the competitive type and likes to play against actual players and people.
- Profile 2 social type:
- Name Josh - Male, 45
- talks in video games
- came to Overwatch in 2022 as free to play gamer
- likes and main Winston and Reinhardt and has an overall KDA of 10/10/3. He likes the social aspect of games.
- Profile 3 fun and immersive type:
- Name: C. - Male, 15
- does not talk in video games, cause to flame and toxicity in previous games
- came to Overwatch in 2022 as free to play gamer - likes to main Lucio and Kiriko and has an overall KDA of 5/ 10/46.
- He likes the immersive aspect of games and plays for relaxation and fun.
All the player types and proto-persona above are part of the target group of shooters like Overwatch 2.
3: solving UI and UX problems
The Players do not use as much individualization methods and possibilities in Overwatch 2
A lot of Players are unaware that games have specialty options. Neither outline nor crosshair are changed for better view or recognition of enemy players. Overwatch 2 lets you customize sounds, animations, skins, and sprays. Voice lines can be displayed on your screen so you can see and hear the enemy's Widowmaker ult or Reinhardt charging in. This problem can be seen at all proto-persona Profiles.
Solution for this issue: The Option function can be easily implemented in the main menu.
New Players do not know or use the Matches against KI
This Mode is perfect for new Players to learn the Hero in actual games. Especially for quite Player type like our Profile 3.C. can learn and progress here with almost any danger that brings social interaction, toxicity or flame.This problem can be seen at profile of the social gamer Josh and the shy and immersive player type C in the proto-personas Profiles 2 and 3.Solution: Show new or re-joining Players how to get to this Menu.
No Option function in the Main Menu (Players need to search or know to find this in the Option-Menu)
Completely new Players may not know the gear wheel Icon as an possibility to get to options-menu for changing the options in Games. Almost very game has this Icon inside, and almost every user knows it. Almost every user, so not all. And even if you do know this Icon, maybe it is hard to find when you first use an application. You can solve this issue very easily as a designer: make a text Menu-point for it. The User can see and read it. He/she/div has now more possibilities to completely understand what the Icon or the Menu-point mean and does.This problem can be seen at all proto-persona Profiles.Solution: Show new or re-joining Players how to get to this Menu and implement the option-function in the main menu.
double functions: payable functions in 'Shop' and 'Battle Pass'
I, as player type 1, do not see this as a positive thing.Brit likes to play for her gain in a game and does not consider once buying for content in Overwatch 2. She sees these 2 Menu-items in the main menu of the application, looks at it, clicks on it and does not like it. Players like her consider these two options as an apprombt to grab her money and to see this so openly discussed her.This problem can be seen at all proto-persona Profiles. But mostly in the competetive re-joining player type of Brit in Proto-Persona Profile 1.
For most Players it is okay to have payable functions and these Menu-items in a Main-menu and applications, but not that many as shown here. Solution: So how could designers make both marketing and players happy: combine it into 1 Menu-item. This way the user has the opportunity to click on the options and consider buying it. Yes, now he/she/div has it as well, but not so aggressively shoved and shown in the main menu. To combine almost equal Menu-points and functions are part of design principles and can be considered as good and usable design solutions.
double functions: Challenges (In Option and Main Menu: 3 Times)
This Menu-item and Icon is implemented more than 3 times. Older players could consider this annoying. New Players can learn like this what the function and Menu-item means. Both opinions are valuable and should be considered by the designers.This problem can be seen at all proto-persona Profiles.
There are numerous ways the designer can walk now from this issue. I as designer would research how other games do approach this. In Valorant the player have quests that pop-up in the header region of the screen. This way the player can easily access the quests and see the quest when they want, and not 3-4 times as an icon or menu-item in the main-menu and screen.
3: How to make the best out of the findings
For this step we need to take a look back at the charts. What we have, what are the findings and what issues we are facing.The charts show that we need to improve the consistency of the UI and HUD in Overwatch 2. Also the usability and reachability part can be easily improved by design and already existing design principles.
1. Consistency
The design should be consistent, so the user can easily reach every point in the application. In Overwatch 2 can be improved:
Menu-Items in Main Menu
accessibility, usability and reachability for the menu-items
more is less: payable options in Main Menu can be reduced and combined to one item
social aspects (friends and groups) as side panel
all second menus, e.g. game menu or shop, need consistent design, best to re-design here
2. Usability and accessibility
'Option' as Menu-item in Main Menu, so user can access options and Individualizations more easily
combine multiple Menu-items and Icons: Challenges and payable Menu-items
After the changes the developement team could do, a menu flow could look like this.
