A Look Through 14 Beautiful Video Game HUD Designs
by Nathan Noom
In video gaming, the HUD (head-up display) is the method by which
information is visually relayed to the player as part of a game's user
interface. It takes its name from the head-up displays used in modern
aircrafts.
As years have gone by, consoles have come and gone, games have gotten more
advanced and so have the HUD designs. Designers have learned a lot about how to
simultaneously display several pieces of information including the character's
health, items, and an indication of game progression (such as score or level) in
better and much simpler ways. Presented here are several examples of games that
have gotten it right.
Join the discussion. Do you have a favorite video game HUD? Leave a
comment and let us know!
The Dead Space HUD follows your character, never getting in the way and never
causing you to pause the action. Everything is displayed through it, maps,
tutorials, inventory, etc. Health and “Air” are displayed directly on your
outfit.
This has to be by far one of the best HUD designs around at the moment. Thin
monocromatic lines outlining everything you need for maximum kill streaks.
Simply perfect!
Seeing as the suit that Samus wears is all one unit, gun and all, logic would
tell you that there would be one centralized location for all of your statuses.
Thus they implemented everything into the helmet.
A very simple HUD. Basically, it remains hidden during normal play and only
comes up when necessary (i.e. When you take damage/Boss fights)
On Fallout 3 you have two different HUD’s. Your main HUD comes in the form of
your P.I.P. Boy wrist device. Your stats, items and detailed status information
are all displayed there. The other HUD is what comes up when you are in combat,
shooting from the hip, or using VATS. It displays the different body part
options for you to shoot, along with your % chance of hitting that part, as well
as the enemies health, your AP (amount of moves) and your health.
Much like Metroid Prime, Star Wars: Republic Commando puts you directly
within the helmet of a Storm Trooper, Clone Trooper or all sorts of other
“Troopers.” Ammunition and clips are displayed directly on the gun as well as
your current grenade, health, items, etc. are shown directly on the helmet.
Genius!
When you’re running around NYC causing mass chaos, you need to be able to
quickly and easily know everything about your character. The map is easy to read
and in my opinion one of the best I’ve seen. Again, keep it simple. Your health
and armor bars are wrapped around the map as a sort of border to save space.
Ammo and wanted level are displayed small but clearly in the top right
corner.
Just because it’s an epic game with a lot going on, doesn’t mean you have to
tell us every single little detail. Bethesda understands this, very well. They
kept it plain and simple with no fancy graphics getting in the way. They want
you to really absorb this epic landscape. 3 status bars stacked on top of each
other in the corner. Health, magic and fatigue. Followed by your weapon (pretty
much weapon type) and a small colored dot to indicate which effect is currently
on it. Next comes your selected spell. As simple as that. Last but not least, a
small compass with small icon indicators to show you if you’re headed in the
direction of anything specific. Simply great.
Maxis has always done a good job with HUD designs and The Sims 3 is no
exception (although EA bought them out…). Basically it is 3 content panes you
can pop open or closed by clicking the small arrows that join them. You can
choose to build, remodel or play your sim from the far left panel, view your
aspirations in the next, status effects in the next, and everything else in the
final panel which is tabbed at the top. There’s so much you need to know to
raise your little “human” and Maxis has arranged it all perfectly.
What’s the best part about the Resident Evil HUD? There isn’t one. Or, at
least there wasn’t until part 5… Instead, your character himself will show you
how much health remains. Once caution is reached your character will begin to
slightly limp, reach danger and your character is practically dragging himself
across the screen.
Resident Evil 5 was a two-person game (one or two players) and they decided
to add your ammo information to the bottom right. Sure, of course that’s
helpful. Nobody really enjoys having to pause to see the ammo, but it did have
more of a “Survival Horror” feel when you didn’t always have that information
readily available. To each his own.
Everything you need faded nicely.
The pieces of the Halo HUD:
1. Weapon Information
2. Shield Bar
3.
Grenades
4. Motion Tracker
5. Scoreboard and Voice Chat Mode
6. Aiming
Reticule
7. Ally Indicators
8. Objective Indicators
9. Other, Minor
Indicators
Again, taking advantage of the corners. Health on the top left, available
actions on the top right, map on the bottom right and weapons on the bottom
left. Very lightly shaded as to not distract you from the game play but easily
seen at the same time. What more could you ask for?
This is by far one of the smoothest, best games I have ever played. All the
basic info of course, but the best part here is the team control. From the top
left you have your command options and a small camera showing what your
teammates are seeing (only need one because they stay grouped.) You can direct
them with a simple up or down and watch what they’re coming up on as to plan
accordingly.
When it comes to creating such a huge world with such robust characters
there’s only one way to give the player everything they need at once, let them
do it themselves. You begin with one displayed action bar in the bottom left and
as you learn new skills you add them to it in the order you wish. Pretty soon as
your skills begin to add up you’ll start setting it to display more action bars
on-screen (up to 5.) This is the type of game and HUD setup that would only work
on a PC.
