HUD Elements and Composition

There is definitely a science behind the composition of a heads-up display. The HUD is a screen overlay, and is one of the best tools for communicating key information to the player in a clear and recognisable way. Presenting these in a way that the player can quickly identify is an important part of the player feedback loop, especially in a fast paced action game like I am aiming to create. The player needs to be able to see how much health and ammo they have at a glance, as to not slow the pace of the game or even worse, have the player die because they were too busy trying to find the health bar to dodge enemy attacks.

I have researched HUD design, and have researched the way that similar games have designed their HUD, in order to gather an idea of the elements I need to include in mine.

The elements that I need to include in my game are:

• Health Bar
• Ammo Counter
• Total Money
• Current Weapon
• Current Active Item
• Map
• Inventory
• Score
• Context-Sensitive Prompts

I have made some rough sketches for some ideas of what these elements could look like, and where they could be placed on the screen:

Some rough sketches of various HUD elements

An example sketch of how I could compose the elements of my HUD on the screen

    When it comes to designing the elements that will make up my HUD, I favour simple and clear icons. This is because firstly I am not a gifted artist, but secondly and more importantly I believe that the HUD is there to serve a purpose, to clearly communicate key information to the player, and as such having fancy icons may be counter-intuitive to achieving this goal. In regards to the composition of the HUD elements on the screen, I learnt that important information should be placed in the top left corner. In western civilisation, people read from left to right, and from top to bottom, hence why it makes sense to put the most important elements at the top left, as this is where the player's eye will naturally start reading from. It is also a good idea to keep as much information on a level horizontally, as this will make it easier for the player to quickly look at one then the other.

With the research I have conducted and the sketches and notes I have made as a result of said research, I have a good understanding of the elements I need to include in my game, how I want them to look, and also where they need to be placed on the screen for maximum effectiveness. As previously stated, I am not the most arty person, and as a result I was previously worried about having to draw as a means of communication during design. However after this task I now understand the purpose of rough sketching isn't to nail down an aesthetic, but is a method of generating and communicate ideas for aspects of design that aren't easily explained in written form.