March 23, 2017 · 12 min read

5 Tips to Improve Your Game’s User Experience

In a small indie development team, you get to wear multiple hats, and you most likely fix some of your game's UX design issues. That’s why it’s important to know about this vast and deeply interesting domain.

Nathan Lovato

Nathan is a game design expert at GameAnalytics. Currently founder and game design instructor at GDquest.

#Strategies

March 23, 2017 · 12 min read

What is UX Design?

User experience – or UX – is often a domain we don’t know too much about as game developers. It isn’t big in games yet. However, it’s a common role in software development teams, and for a good reason.

UX designers are an essential bridge between the engineers and the users. Their role is to make the program clearer, and as intuitive as possible. Games are applications as well. We want the user – the player – to be able to pick up the game by himself. To overcome challenges on his own. In other words, we want his experience – the user’s experience – to feel great and seamless.

If the game designer adds features and mechanics to the game, the UX designer subtracts anything clunky, that adds noise, to make the game more enjoyable. A recent video from Extra Credits defines the role as follows: “UX designers design how game systems are taught to, and interacted with, by players.”

An Excellent Tutorial: Intro to UX Design

The idea isn’t to make the game casual: we’re talking about improving the game’s flow, its controls, the interface… The goal is to help the game’s intended design resonate with the players. It’s about making it easier to understand, to get absorbed by, and to play… for the players you’re creating the game for.

You’ll see that it overlaps a little with what you do as a designer, but at the same time it offers a fresh perspective. You’re using a different lens: instead of viewing your design from the creator’s perspective, you think about it from the player’s point of view.

5 Essential #UX Tips For Your #GameDesign ? https://t.co/hd5Q4o5RRV pic.twitter.com/MDtkKVCupd

— GameAnalytics (@GameAnalytics) March 23, 2017

Tip 1: Get to Know Your Players

And get to know them well. That’s some of the best advice I ever received from veteran game developers. You want to find a limited set of target users.

You’ve probably heard about early adopters, the few persons who will give you critical feedback on the game as you’re producing it. If you’re thinking “men from 18 to 30 years old”, then think again. It is too vague.

There are so many types of players with different tastes and expectations as far as the complexity of the game is concerned… You can’t please them all. So be more specific and design the game for those who will care.

Let’s take Wonderboy: the Dragon’s Trap as an example. It’s a remake of Wonderboy III, a cult classic, that’s currently in development. Last week, the team showcased a new retro mode that allows you to switch from HD graphics to the original game’s look and feel, all in realtime.

Feeling Nostalgic? Switch to Retro Design…

Beyond the fact that this is quite impressive, this tells us that the game targets the fans of the original series. It’s a remake, so it makes sense. But it’s still a specific target: adults in their 30s who loved the original title. This new Wonderboy is beautiful too, so it will spark the interest of many players.

Your game or your product can always go beyond your core target. But this example shows you developers who do not only try to stay true to the mood and the feel of the original game: they went the extra mile just to add that retro mode, because they know precisely who they’re making the game for.

Wonderboy: the Dragon's Trap screenshot — It looks gorgeous, doesn’t it?

You should decide who you’ll make the game for, then find them and do extensive testing. So yes, this is a tool to guide your testing and ensure that you not only get feedback, but that you get the right feedback.

Identify player personas with analytics

To get as much information as possible on the players, and some objective data, you’ll have to use analytics. There’s a good reason if you have integrated reports on Facebook, Twitter, Steam… you get the idea. All serious mobile game studios do it.

The data you collect will allow you to spot issues with your game design very clearly. The most useful metric I recommend to always track are the progression events “start, fail and complete”.

Game Progression Analysis — With GameAnalytics data and design work together

They tell you the proportion of players who play any given level, who play the level to the end and how many times they die or fail in the process. Along with the session length, the duration of a play session, it will help you spot deadly design issues. If people fail to many times, they will leave your game. If the game is boring or repetitive you will see less and less players try out the next level.

? Further Reading: Game analytics is a deep domain where there is a lot to learn. To help you get started, we wrote a post that lists 15 metrics that all game developers should know by heart.

You’re getting multiple tips for the price of one, but I’ve got an extra note to add: ensure that different types of players try out the game, within your target. People have different tastes, skills and playing habits. You can’t make the game work for every single person. But you do want to make it work as well as possible for a range of people: your future fans, your future community.

Tip 2: Lower the Scope

I mentioned that UX design is subtractive in nature, and you want to apply this idea to your work. When you design the game, you tend to add new features. New mechanics, new patterns, new obstacles. This is a natural part of the process. It is UX design that is unnatural at first as we are not used to removing parts. Yet subtraction is at the core of the discipline.

Concept art offers a good example. A concept artist will produce many sketches, but in the end the team will only keep the one that best captures the essence of a character or an environment.

Bioshock Inifinite, Elisabeth concept art — It took dozens of drawings to get to the Elizabeth you saw in Bioshock infinite

As a designer, you want to add extra mechanics to renew the gameplay, for it to feel rich and surprising. The UX design process is not the opposite of that, but rather a necessary counterweight that brings balance to your projects. And at the end of the day, some of the most clever and enjoyable titles I know only add new concepts sparingly: they introduce mechanics only from time to time and try to squeeze as many extra situations as they can. I just gave The Witness a try and I’m amazed by the amount of compelling variations the team found for each type of puzzle.

The Witness desert screenshot — Not only do they keep the puzzles fresh, but the game’s level design, that guides you without a word, makes you feel smart

It’s part of that iterative process: you build up the game, the prototype, try to make the gameplay work… And in subsequent passes you not only remove the parts that create friction for the player: you improve existing content so it is easier to grasp. On top of that, lowering the scope of your projects will allow you to finish them in good time, before you run out of money.

Tip 3: Think Seamless

“The challenge in creating a great user experience for a game is not so much a matter of getting menus, and the user flows around menus and settings, in order. The really big challenge is the gameplay itself. The gameplay needs to be instantaneous and seamless.” – iA Zurich

The whole point of the user experience designer’s work is to prevent any discontinuity in the player’s experience. You want the gameplay to be compelling, and the feedback instantaneous to keep the game rolling. You must build this foundation if you want your players to answer a state of flow.

They first need to be able to sink into the game. That’s where tactile devices shine and manage to capture people’s attention brilliantly: you touch some icon and it bulges up, you swipe and the menus move around in sync with your finger… You become physically connected to the game.

You’re looking for the same level of responsiveness in every element you design. Anything the player interacts with should respond with visual and/or audio cues. It is the same with any object the characters in the game interact with. Animate grass when the hero walks in it. At a bit of dust when you jump, land or run. We wrote about it in the past, so check out our article: Squeezing More Juice out of Your Game’s Design for detailed info on the topic.

Frog Sord, an abandonned 2d platformer, screenshot — The game was sadly abandoned, but Frog Sord seemed to do it right

Tip 4: Be Consistent

As you progress through the production of the game, find the core principles that your game’s User Interface and UX rely on. For example: if the first interactive elements you implemented have a yellow outline on mouse over, write it down and stick to it for everything you will add later.

Reuse Design Conventions

Consistency makes people feel smarter. It helps them find their way around the game easily because they have few rules to figure out. That’s also why we tend to reuse conventions. Green for the player’s life bar, red for the enemies. Red hearts or potions for collectible items that heal you. Yellow for coins or elements that give you points. Anybody with a small amount of experience playing other games will intuitively get the idea.

Effectively Use Game Sprites

Consistency is also key when it comes to the game sprites: you want to use similar proportions, vibrance, and high contrast on anything that’s gameplay related. Anything that’s part of the background, that you can’t walk on or interact with should then be less contrasted and saturated.

This happens in the real world. That’s what we artists call atmospheric perspective: the farther away something us is from us, the more it leans towards greys. In a game, you can exaggerate this effect to silently tell the player what he can click on, touch, hit, or use at a glance.

As a 2-D game artist, one of the main tricks I use is to simply have a thin outline around every part of my sprites. For one, it is somewhat close to reality because as the form of an object turns away from your light source, it will end up in the shadows, which creates a subtle outline effect. Or you can get a bright outline if you use a rim light, a light that sits behind your characters. You can see this in action in Rayman Legends.

Rayman legends castle interior screenshot — The trick is to use a hand-painted mask along with the lights’ positions and add it to the sprite using shaders

Tip 5: Breathe Life to Your User Interface

Layering visual and audio cues on your game characters make them more interesting to play. This is also true for your user interface. You want to tween and add sound to every single button. At least when the user interacts with them in some ways.

Use animation, color contrast and extra effects to draw the player’s attention a specific button. This creates visual hierarchy in your interface. The worlds of web design and motion design are two great references in that regards.

Bttn.css screenshot, a css button animation library — The Bttn CSS library offers a range of appealing over animation to draw inspiration from

A few years ago, I teamed up with an Australian developer to make a small game for browser-based mobile portals. It’s a very simple game that was made very in little time, with few assets, and we yet managed to pitch to publishers and sell.

We focused on tweening. Every button in the game has some animation. The play and replay buttons, the most important ones, have unique animations. If you don’t press play quickly, the sprite wiggles around to draw your attention.

We used so few assets it shows the power of tweening pretty well. And although there are few sounds in the game, every time the character or the player interacts with something, we play a sound effect.