Torchlight 2

For many games, the Heads-Up Display (HUD) is one of the most important elements that facilitate game play. A well-designed HUD can make or break a game. To create an inclusive design that is intuitive for as many users as possible, it is important to keep design the default well but also to add choice and customizability particularly for more complicated layouts that contain a lot of information. Let the user decide the details and build their own UI.

HUD screenshot from Torchlight 2
Torchlight 2

Displaying text and information

Information should be easy to access. Use a clear, large size font against a high contrast back ground as default and allow the player to make adjustments:

  • Make text size, font and text colour adjustable
  • Flickering or flashing text should be optional
  • Information should not be audio only, text only or colour based
  • Keep menus one or two levels deep and avoid tree structured complicated menus where information can only be found by navigating through multiple screens.

Information and text boxes

  • Add the option to hide or display information boxes. Some users are overwhelmed by information whilst others require or prefer all the information they can get on the screen. Ideally also add options on when to display certain information so that the UI dynamically adapts to the situation.
  • Add the option to change transparency and colour of the background inside text boxes
  • Add the option to change the size of boxes and limit the amount of information displayed.
  • Add “next” buttons to allow the user to control the speed at which information is displayed, but also add an auto-play button so that proficient readers who may have difficulty with repeated clicking can read long portions of text without multiple clicks. If using a lot of long blocks of text ,provide a summary as well
  • Essential temporary information should be within a user’s eye-line, but ideally add the option for users to move essential pop-ups where they want them
HUD screenshot from World of Warcraft
World of Warcraft


  • Provide the option for maps to be north oriented or rotate
  • Provide both a text-based map and a pingable sonar-style audio map
  • Provide GPS as audio as well as displayed visually

Make customization an inclusive part of the game

A player-made heads up display can be an integral and vital aspect of a game, particularly for games that heavily rely on it, like MMO’s and RPG’s. It is frustrating when the option is there for lots of customization, but the process is difficult to use. Make it fun and usable:

  • Be clear which elements are interactive and make customization options easy to find and adjust.
  • Using large hitboxes instead of small buttons to move things around the screen
  • Use simple one button controls, for example don’t use click and drag as default, use click to select then drag instead
  • All areas of the user interface should be accessible with the same controls used to play the game. For example, don’t make the user interface mouse click only on a PC game, allow navigation with a keyboard as well.
  • Avoid using flickering images and repetitive patterns within the design and provide the option to have a fairly static background whilst in the process of customizing the HUD

Not all players are into customization, so make sure the default HUD is well-designed and make customization an optional extra.

Star Wars: The Old Republic

There are many ways to add flexibility and involve players in creating a heads-up display that they can use efficiently. For complex HUD’s, consider whether allowing player made add-ons might be something to incorporate. The goal is not to design the perfect heads-up display, but to find a happy medium that supports both the game and the player, regardless of ability and personal preferences, well.

For more information on how to make games accessible and inclusive, have a look at Game accessibility guidelines for guidance, examples and advice.

Leave a Reply