Working with UIs, there is one thing that will sooner or later rear its ugly head and that is form before function, which basically means “Hey! Look at this pretty but fundamentally useless or really difficult to use UI!”

A badly kept secret when it comes to presentation is that color and sleek form (as in “currently fashionable form”) often win over efficient functionality, and as a UX designer concerned with both, I’ve seen function relegated to the side more times than I care to count.

I have a pretty strong sense of functional design. When I create something, my first concern is “does it work” not “is it pretty”. Don’t get me wrong, I am certainly not above being seduced by a sleek and beautiful UI – I just lose the enchantment fairly quickly if I can’t find my way around.

A couple of guidelines that always see me through are these.

Is it consistent?

If a UI consistently uses the same placement for buttons or objects with similar function, then yes, it usually passes the consistency test. Consistency is important, because as we play or perform an action in an interface, we’re forming a habit, teaching our muscle memory to do things on autopilot (which is frankly how most of us get through the day). If you type a lot you know what I mean. On a keyboard you’re used to, you’ll make very few mistakes. Change the keyboard from an ergonomic one to a flat one and typos appear, like magic. Or if you do it like me – change from a Swedish keyboard to a North American one, and all of a sudden there are line breaks everywhere, because the enter key is in the wrong place with the wrong shape. Or – why not – switch from XBoxOne to Wii U and experience back button and select button confusion.

If you’ve ever played a game that break console conventions you’ll probably know what I mean. I have yelled at more than one game where interact is connected to the “wrong” face button. Well, according to me.

This, however, goes double for menus in the game. Keep the interactions on a level of consistency that makes the UI easy to navigate. Back is always on the same button, confirm, select, ok – same button. Changing screens in a game menu? Convention says LB/ RB for most games. In other words, before you set out to make the coolest UI ever, make sure that you’ve done your research. If you intend to break with conventions, be aware that you’re breaking with conventions and do it in a way that the player can pick up on easily.

The biggest difficulty with consistency is keeping it across several screens when there are several different requirements on each screen, because honestly – consistency is restricting. You’ll be all “yay! Solved a problem!” and then go back through the screens you’ve already made mockups for and go “nope. No problem solved, because consistency issues…”

It’s worth it though. It’s worth keeping an eye on how the screens work together to help build habit and muscle memory in the player. If nothing else because QA and UX research who do all the testing and usability testing will love you for it.

A pretty interface usually doesn’t care about consistency. It cares about looking good.

Is it deep or flat?

In a UI you will at some point have to dig down into the layers of the menu. It’s next to impossible to keep all functionality that you want on a top level (if you can – great! Just make sure it’s not overwhelming the player with too many options at once). A pretty interface may well hide information at depth, because it is more concerned with looking pretty than giving the player what it needs.

Take Destiny for example. Destiny is rather opaque as a UI, because no information is readily apparent in the top level of the menus. What Destiny does do though, is enforce a level of – yup consistency that is almost scary. As a new player, you may struggle a while to find the information you need though. But as an experienced player, you won’t be particularly worried, you know how to find the information.

However, if you have a UI that hides information at depth, you’ll be in trouble, primarily because player won’t find what they’re looking for. Now, there’s a difference between hiding information at depth or guiding players to information at depth. In a game interface there are often ways to be a bit tricky and make the player think they’re at the top level in the interface when in fact they’re not. The main thing to keep in mind is to make it easy for the player to understand where they are – be clear. Use breadcrumbs.

Useful information is better than useless information and if there’s nothing there, I can’t select it

These two are somewhat similar. When I look at game UIs, I sometimes get information I don’t strictly need. As a player I’m often put in the path of lore, backstory, information snippets about the world – and sometimes the information I really need is buried among all those nice but fundamentally useless info snippets.

I want the information I need when I need it. Don’t make me hunt it down.

Another thing that has to do with information is this: if there is no information on a particular subject as of yet – don’t make it possible to select or interact with it. Say I have a weapons mod menu, but I have no weapons to mod, or no mods to put on my weapons. I shouldn’t be able to open that menu. It’s a futile click. Normally in games there is already a fairly impressive array of potentially complex interactions and information. Don’t frustrate the player by leading them down dead ends.

The naming of things

Names are important, not just because of magic, but because a name can make or break a UI. Call something “teleport” and the player expects one thing. Call it “fast travel” and the player might expect something else. My point is that naming things is important because a name sets expectations. When I open this menu, what will I find? What would I expect to find, based on previous games I’ve played? Just as with functional consistency, naming consistency is useful to keep the player on track and for them to understand what’s going on. (One of my pet peeves in table top role-playing games – the tendency to call the game master everything from game master via dungeon master to storyteller etc. Why make up new terms when there are perfectly suitable ones available – terms that won’t confuse the player?)

The bottom line – my point if you will – is that pretty doesn’t really care about these things. As long as it looks good it is good. Functionality does care, meaning that sometimes a functional UI won’t be as pretty, but it will cause the player a lot less frustration and problems.

As a UX designer for games, I have the unfortunate (and fortunate) position to straddle the divide between pretty and useful. Contrary to software where function wears the crown, in game UIs there is a constant struggle between making things pretty and making them useful.

For me it’s a win whenever I manage to balance the two.