Moderation & Game Developing

Game Design: User Interface and nowaday’s overload

Today, I might finally understood why I can’t stand playing games like Titanfall (2), Overwatch and also Call of Duty or whatever similar in the First Person Shooter (FPS) jungle is out there. And I think it is one thing you will face in every game. I am not talking about cheaters, imbalance or boring game mechanics. I am talking about the User Interface (UI). The connection between the player and the game itself.  The UI’s purpose is to display crucial game information to the user, so he can adapt his tactics and play style according to the information shown. For example: You play a game of capture the flag, getting a notification about your stolen flag’s position and you will run after it. *BAM* – You stopped the enemy team from winning! And this does not have to happen by using visuals only!

UIs of games, especially FPS, changed significantly over time. This is caused by increased graphics, creativity of integrating the UI into the game world and also depending on the game and its setting and dozen other factors. This also points out: We are not at the end of UI design in the gaming world. VR will contribute to the UI and vice versa. But now I want to get into the mentioned examples above. The VR UI topic will be handled in a future blog post, when my game is going to be more appealing to show.

Basics of UI

As I read myself into the topic of UI, you have to seperate between 4 types of UI in gaming:

  • Diegetic
  • Non-Diegetic
  • Spatial
  • Meta

Diegetic describes the information, the UI displays, is available “in-universe”: Objects attached to the player in the game world do show the information and fit into the games narrative. Most common for this are the ammunition displayed on the side of a futuristic gun or a watch giving time information. Fallout’s Pip Boy is the very best example how this could fit seamlessly into a game.

Spatial overlays the information on objects in the game world. Watch Dogs can be taken as an example on this.

Meta is similar to Diegetic. But here the elements are displayed as separate objects in the screen but do fit to the overall narrative. Best example: GTA V’s smartphone.


When it comes to Titanfall 2, Battlefield 1, Overwatch or Call of Duty (whatever Call of Duty you like to choose), you have a somewhat Meta typed UI. In the cases of Titanfall 2 and futuristic Call of Duty titles, this is no problem as the setting is the future. Displaying a Head Up Display (HUD) is not considered as out of narration here. And I don’t want to talk about whether you should use which type of UIs. My actual problem is the kind of travesty done by overloading the UI and this is mostly done in Meta UIs. As an example, let us look into Titanfall 2.

Titanfall 2 - UI

Titanfall 2 – UI

If you see the first image of Titanfall 2 above, everything seems to be still okay. Most information is accessible on the left side of the screen. Even though, some elements could keep you asking yourself, why they are added. But now we look into some action of a Titan:

Titanfall 2 - Titan UI

Titanfall 2 – Titan UI

You can still see the action happen? Well, I don’t. I don’t have a problem with the frame the Titan sets around the players view. I really like that. But the information here is questionable: It is just too much! You got information about kills (bottom right), player stats (bottom left), core information (center left) and Titans killed (center right). And then you got the overall game information (top center) and a minimap. To proceed with my analysis of nowadays GUIs, let us structure the first screenshot:

  1. The minimap of the level
  2. Reward system
  3. Player stats
  4. Killing information (could be considered as a reward system but is also of tactical purposes)
  5. General team information
  6. Spatial information (Player names, location etc.)

Player stats, spatial information, mini map and killing information. Okay, that’s fine for me. But why does it need to display rewarding information? You did some serious killing here but can’t you remember what you did a few seconds ago? Why does this need to use some serious space here? And while I am writing this post, I noticed a pattern: Usage of this rewarding system.

Call of Duty Infinite Warfare - User Interface: Rewarding

Call of Duty Infinite Warfare – Rewarding

Battlefield 1 User Interface: Rewarding

Battlefield 1 – Rewarding

Overwatch User Interface: Rewarding

Overwatch – Rewarding

You see it? You got mechanics showing you how awesome you are. All the time. In terms of Overwatch and Battlefield this is not such a huge thing. Especially in Battlefield 1 the design has been done more elegant and you can still see the game happen. You can just say it does not fit into the games narrative. For Overwatch it is questionable if such a big Killing Streak banner has to be applied almost in the middle of your view. As for Titanfall and Call of Duty we face a UI that’s gone mad. You can only see 1/9 of the whole screen without disturbance.

But why do games need to show the player’s performance this way? This goes into fields of psychology now and my assumption is: Pleasure!

This pleasure is a result of giving the players positive feedback about their performance and most importantly communicate to the player’s reward system inside their brain. You are constantly stimulated via these systems. And as it seems – based on numbers of players – it works. You can also assume the player has to be kept entertained not giving the player a calm display. As I could not find any sources talking about the positive effects of these systems, it can be furtherly researched if these even exist. So if you need a topic for your thesis, feel free to write about it!

A Different UI Design?

Games are a multisensory. Most games do it right here: Primary information via visuals, secondary information via audio. It is also the case visuals are enhanced by audio. The problem seems to be the consideration of what is primary and what is secondary information.

If you ever played DOTA 2 you probably know this by hearing to the announcer. And that is crucial as you have a lot to do while you are looking to the screen for your very own situation. The announcer helps you to get a better overview of the overall situation. In Unreal Tournament you can also either hear the announcer say “MULTI-KILL” or that your flag has been stolen. The same for Team Fortress 2 and stolen intelligences.

Some games don’t even use a minimap. For arena shooters like Team Fortress 2 or Overwatch, that’s fine! Map awareness is the key for winning. For big maps like in Battlefield 1 or Titanfall, a map is crucial for players to provide orientation. But does a Call of Duty (in the picture above, the minimap is hidden by a flashbang grenade) need it? Questionable. Can’t the reward system be realized audio-wise in the negative examples above? Can’t the information of Titanfall (Cores etc.) be provided via audio or even via popups in the map? Apparently Battlefield 1 does this well.

The key problem here is you cannot see a lot within action packed situations! And that is a massive no-no for me. It does not provide proper orientation that is needed in tough fights.


Nowadays games have a UI overloaded with information. Most common in FPS games is the reward system, showing you your performance in terms of achievements, killing streaks and other interaction based performance. The depiction of these reward systems always takes a lot of space within the players view and leads to distraction.

One can assume it works well for the purpose of giving the player stimulation to either enhance the playing time or the player’s experience. It is questionable if these visual depictions are needed and if audio feedback could achieve the same effects. It can also be researched if the positive effects do even exist to a measurable amount. Other crucial game information could also be displayed in a more abstract UI design by having audio and visual interact. In addition, it can be evaluated what is primary and what is secondary information and if secondary information needs to be displayed visually.


Next Post

Previous Post

Leave a Reply

© 2019 Kai-Opitz.com