First Person Shooter HUD Layout

In order to create a HUD for a first person shooter (FPS), I must first look at other FPS games to find what elements are included and how they are organised on screen.

An FPS HUD should typically display:
- health bar
- weapon type
- ammo count
- radar/minimap
- team information: score, teammates, round number (if applicable)


Counter Strike: Global Offensive (CS:GO) - 2012


CS:GO has one of my favourite HUDs. It has a very simple, minimalistic and clean look which does not hinder playability or visibility during gameplay. 

The lower left of the screen holds the player's health and armour stats, while the lower right displays the player's ammunition for their current weapon. The top left shows the player's current location on the map in order to assist with call outs to teammates, it also holds a minimap which allows the player to see theirs and their allies' locations relative to the environment. The bar across the top of the screen shows both teams players and whether or not they are alive. It also shows the round numbers won by each team and counts down the time remaining for the current round.

All of this information is vital to the player and is very easily accessible during fast paced gameplay while also not obstructing the players' visibility and limiting their view of enemies. The low opacity backgrounds allow the important stats to be seen clearly while not blocking out areas of the screen. In my opinion, this layout works very well and is a great reference for my HUD.


Call of Duty: Warzone - 2020


The lower left of the screen shows the player's health and match earnings as well as those of their teammates. It also shows the player's rank in the game and how much they will win from their game. The lower right of the screen shows the player's current weapon, ammunition and available utility. The top left shows a minimap and the remaining time for the current match. The top bar is a compass that shows the player's current direction in order to assist navigation.

There is a lot of information in this HUD and personally, I feel that it is okay. The important elements stand out from the gameplay relatively well, with the exception of the weapon stats in the lower right. I think that the lack of a low opacity floating box makes it difficult to read on an everchanging background of gameplay. I will try to improve on this when creating my own HUD.


Halo 5: Guardians - 2015

This layout is slightly different to the previous examples. The lower left of the screen displays a radar to help detect enemies. The lower right shows the score and rank of both teams and shows the number of kills needed to win. The top left shows the player's available utility while the top right shows current weapon and ammunition. The top bar displays the player's health.

I really like the simplicity and artstyle of this HUD. It shows the correct amount of information in a clear and concise way while also remaining unobtrusive to gameplay. The artstyle also mirrors that of a futuristic helmet interface. This really improves immersion for the player and makes the HUD layout seem more purposeful well considered.

Comments