Learn Better UX/UI From Video Games

I’m a UX/UI designer who has played games most of my life. I can’t help but notice how video games tackle their unique user interface challenges. I like to ask myself questions like: How can you accomplish tasks efficiently within a menu UI while maintaining immersion; How often should players open the game menu; and What are players thinking when using menus?

Navigation menus can take up a lot of play time in some genres. They exist for players to accomplish a goal—equipping a new weapon, viewing an unlock or changing gameplay settings. Video game designers need to find a way to make a lot of tasks intuitive and easy to quickly achieve.

The menu should feel like a place users can go to and accomplish goals without feeling burdened by decisions.

First-time players confronted with an overloaded menu will feel instantly defeated. It needs to feel like a place users can go to accomplish goals without feeling burdened by decisions. Any game menu, regardless of its complexity, can be structured to make tasks easy and feel second nature.

Here are a couple games that show how different menus can hugely affect the gameplay experience.

Fallout 4 Pip-Boy

Fallout 4 has a unique approach about menu design: It means to feel like a product inside the game. To access it, the main character holds up their wrist to look at a Pip-Boy, essentially a giant smartwatch with the game menu displayed on it. It strives for immersion but sacrifices usability.

The interface frustrates me for these reasons:

• The usable area takes up a fraction of the screen space
• There’s too much text and not much hierarchy or consistency
• Nested tabs hide important information, make finding other options difficult and increase chances of going to the wrong place

Continually using a frustrating interface to accomplish tasks will impact impressions of the game. The menu should make users feel a sense of accomplishment, not dread. Fallout 4 isn’t a bad game, but little things add up to sour the experience.

Forza Horizon 3 Grid

With a simple and consistent menu, users can understand the possibilities at a glance. Designers provided the right amount of important choices on the home screen and clarified where to find anything else.

Here are some of the things it gets right:

• Everything a player needs to do logically fits into seven categories
• Imagery makes important buttons stand out
• Consistent typography and hierarchy makes parsing information easy at a glance
• Unavailable items clearly appear disabled
• Uncompleted tasks are clearly marked without obstructing other UI elements

Designers chose to make “world map” selected by default when the menu opens. This is a really smart decision because it’s by far the most accessed button. Opening the menu and viewing the world map takes almost no time or effort from the player, keeping them focused on the game instead of getting lost in a menu.

Striking a balance of simplicity and usability requires a strong understanding of user flow.

More great game UI examples

• Overwatch
• Rise of the Tomb Raider
• Watch Dogs 2
• Persona 4
• Stardew Valley

Video games are a great source of design inspiration when examined with a user-centered perspective. Striking a balance of simplicity and usability requires a strong understanding of user flow. Over simplification causes users to stumble their way through, unsure of what to do. Giving players too many choices will cause confusion around how to parse information. These UX principles extend into apps, websites, interactive kiosks and more. I love taking inspiration from my favorite hobbies and applying it to design projects.

Kyle is a Digital Designer at Parliament where he crushes UX/UI.