The art and science of user interface design
The first time you fire up a new videogame is always a bit of a thrill. Whether it’s a small indie puzzler or a massive open world game from a big studio, possibilities abound. And the immediate thing you’re going to do is interact with the game’s user interface (UI). An element of game design that crosses boundaries between art style, game mechanics, and brand management—user interface design is a critical part of the creation of any game.
Generally speaking, user interface design is the creation of the visual components through which the player interacts with the game. Think start menus, heads-up displays, health bars, map icons, crafting bench interfaces, and the like. The way these things are structured in the game and how player psychology impacts those structures is called the user experience, or UX. UI and UX designers work closely together to make sure that the flow of information in the game makes sense, and distributes the information a player needs to know quickly and efficiently.
The first thing that comes to my mind when I think about UI is the heads-up display, or HUD. This is the frame that overlays the screen that contains all kinds of information—in a shooter, it might have remaining bullets, a minimap, maybe a bar that indicates what button to press to pull out my Explodo-matic 3,000. In a trading card game, it will show me how much life and mana I have, cards in hand, remaining cards in my deck, that sort of thing.
Some games will have extensive HUDs with tons of information, like TCGs or massive 4x strategy games. Any time the complexity of the game requires a bunch of information to be displayed simultaneously, this is what you’ll see. In other types of games, like horror games or narrative adventures, you might have very minimal HUD elements. Here they take the back seat to a game’s ambience, and the less intrusive they are the less they pull you out of the suspense of the moment. Some important game information can be conveyed effectively to the player without the use of a HUD—think Mario getting bigger when he finds a mushroom, or your character shivering in Monster Hunter World when it gets snowy.
One neat element a game designer can use to shake things up is by putting elements of information that might normally be found in an overlay inside the game world. Maybe your character picks up an actual, physical map and looks at it like in Far Cry 2 or checks the Pip Boy on their wrist in Fallout 4.
UI designers also have to craft all of the other elements that convey information—level maps, menus, quest logs, ability icons and sometimes even narrative elements on a game’s website. With all of these separate systems being part of the same game, it’s important that they have consistent visual DNA. Between font choice, color selection, and clear design elements, everything should feel like it belongs together.
Another way a UI designer can bring consistency to their game is through motion graphics. Persona 5 has a famously great UI, in no small part because every time the player brings up a menu, there’s a stylish flourish that comes with it. The animation included in the movement of the menus or the way a character pulls out their cell phone to make a call from a menu of numbers are great examples of the way motion graphics can be used as a companion to the user interface.
Fantastic user interface or user experience design is about knowing your target audience well and bringing them the best information in the best way. If you’re the type of person that took as long tinkering with Leon’s attache case in Resident Evil 4 as you did shooting zombies, or that loves to rearrange their furniture to see what different layouts might look like, UI design might be for you.
