Author
By Arran D'AubignyManaging Director
4/11/2014
GAME UI: Heads-Up Displays PART2
OK, OK. DIEGETIC, SPATIAL. YOU GET IT.
So, you know the theoretical applications of HUD types. You know the difference between spatial elements and non-diegetic UI. What’s the point?
Well, to make the game playable for one. People play games to have fun and get lost in the virtual world of the game. From Angry Birds to Zelda. Be it for 5 minutes or 5 hours, the point is to take on the persona of something else and do things we wouldn’t normally get away with.
People are savvy to things like UI these days. They expect the design to be intuitive and informative. They may not know the reasons why things are not working, but they’ll know they’re bad. If the player is concentrating on the HUD too much, it’s already failed in my opinion.
Think of the screen like a letter box view into the game world. Anything that is placed on the screen will reduce the size of the visible gaming arena. So everything that is displayed should be considered in its application.
Ask yourself questions. Where will the action take place? Will there be an on-screen Avatar and how will it move? What information is relevant to the player during gameplay? How should the information be put across? When, where and how could it be used; Diegetic, Spatial, Non-Diegetic?
Knowing and understanding your game will help you decide on the direction you should take your UI. Your GDD is your bible, refer to it, check back through it, and you will know how the score and game mechanics work. You will know what content you need to include.
My mantra as a designer is ‘CONTENT IS KING!’ Content will inform the design. The genre of game, the information the player needs and the mechanics of the game will give you a great insight into how you should proceed. Refer back to the 6 Rules, keeping your design clear, clean, legible and relevant.
Be thoughtful in your design. If you put all of the information the player could ever need on the screen all of the time, it may detract from the game experience.
Regardless of the overall UI direction, your first priority has to be to enable the Player to operate in your game world. UI empowers the Player. A user interface is the sensory perception for a human to ‘live’ in a virtual world.
EXCEPTION TO THE DIEGETIC RULE?
It could be argued that unlike all the other mushrooms in Super Mario Bros, the ‘1UP’ mushroom is the only Spatial one.
The other mushrooms have a diegetic existence within Mario’s world. The green 1UP does exists in the 2D realm. Mario even interacts with it (by picking it up), however, that does not necessarily make it Diegetic.
The reason being, it serves no other purpose other than giving the PLAYER another go. It has no effect on Mario himself.
The other mushrooms give him special powers and costumes etc. But the iconic 1UP is for the sole benefit of those in the real world. Therefore it’s a Spatial representation.
GIVE YOUR GAME A PLATFORM
The platform you’re designing the game for will also have a huge affect on the design of the game and HUD.
Consoles have many control inputs; A, B, X, Y, Rb, Rt, Lb, Lt, Left Stick, Right Stick, D-pad… PCs have even more with the whole QWERTY keyboard and mouse plus buttons.
Mobile devices however only have the touch screen. No hover state and some of the screen is obscured by how the player will hold the device.
After deciding on your platform, you will know the restraints, pros and cons. Try and embrace the limitations and use them to enforce simplicity and ease of use into the way information is made available.
IN CONCLUSION
Next time you’re playing a game, take a moment to look at the way the UI has been laid out. More than likely you’ll notice bad UI before you notice a smooth UI system.
Try and note the use of the Diegetic and Spacial elements. Decide for yourself what works and what doesn’t. Could the enemy’s health bar be a small line above their head in Non-Diegetic 3D space? Or would it be better to have it dock to the HUD? Or even be represented on the enemy avatar itself!
There’s never a right or wrong. That’s the difficulty designers face, however, there are better and worse ways of delivering information. There may be a more suitable solution for different situations.
Is the screen crowded and cramped because of the over-elaborate icons in every corner? Is the whole thing so sparse that you have no idea what the hell is going on?
Is the placing of the important information awkward to see when you’re concentrating on taking the racing line around Monaco?
All of these things will have an effect on your enjoyment of the game. Either the HUD will give you an extra sensory perception of the world you’re running around, giving you all you need to destroy dragons. Or it will be an extra barrier on the fantasy world and somehow sterilise the experience into nothing more than a postcard from what could have been.
The HUD is not more or less important than the avatar’s 3D gaming world. More that there should be no real distinction between them. The HUD and the Game are one and the same. Symbiotic, like the algae and fungi that make up lichen.
KMP
n.b. Another tip for slick looking UI is adhering to a well thought out grid system. But that is a whole subject on its own. I’ll get to that another day.