UI gamification: Making your design fun to play with
5 game design techniques to implement for a “gamified” experience.
Directing users’ attention. That, they say, is the primary job of a designer. But I’d argue that things are a bit more complicated than that.
Depending on the product we’re building, a user might simply be forced to give us attention to get a vital service or a product.
At that point, the attention is a given, but does that make every banking app well-designed? Of course not. This is where we come across the idea that good design might just mean that users want to give us attention.
This is where the somewhat nebulous concept of “gamification” comes in. Fundamentally, it’s striving to create the kind of experiences and products that our users would want to play with by integrating the principles of game design.
When is gamification appropriate?
Video games are designed to hold their player’s attention, often for thousands of hours. And the reason we should be taking notes from our colleagues is that they very often succeed spectacularly.
The important question then is: which products actually need gamification? Can you just add badges to any product?
As usual in design, there are no simple answers, but I find the following rule of thumb extremely useful: everything in your design must fit the user’s intended experience.
You have to know who’s the end-user and what their intentions for the product are. Some game design techniques, such as interactivity paired with discernible feedback, are inherent in pretty much any app — but that doesn’t mean we should be working to implement leaderboards to mail clients.
Example: LinkedIn has, for years now, been using the “gamified” experience of awarding you points if you fill out your profile, make connections, etc. This not only encourages people to go and fill out their profiles but also works as an all-in-one guide through the LinkedIn features.
Three main factors of gamification
Before going full-throttle into gamification, there are three most important things you need to always keep in mind:
- Player — a.k.a. your user. Always know their role and purpose within the space you’re designing. Within a gamified framework, they are indeed players, so they need to know why they are performing certain tasks, and then actually perform them. If everything works at a single click, there isn’t much space for interactivity.
- Communication — informing your user about: a) the ultimate purpose of the product; b) all the smaller tasks that need to be completed to achieve that goal; c) communicating how to complete those tasks without overwhelming the user
- Appeal — the most abstract of the concepts here, this one’s directly related to your actual product. What is the appeal of the thing that you’re designing? Is it supposed to be fun or buttoned-up? Is the appeal that your users can relax, or that this is their space for deep work?
5 game design techniques to implement for a “gamified” experience
All games have rules — therefore all games need tutorials. Making a tutorial can be as easy as highlighting a button or two and adding descriptive text, and that’s what a lot of us end up doing.
However, I believe that the best way to learn how to solve a problem is to solve it yourself, step by step. In some instances, it’s worth the time to create a “trial” problem for a user to solve, covering different modules and features available to them.
Then, by the end of the onboarding process, the users will have all the tools they’ll need at their disposal.
The key to creating a good tutorial is organizing it in a way that lets users feel the flow of the space they are working in.
Tip: judging from my experience with both video games and tutorials, even the best ones need to have the “skip” button. Make sure that the user can turn the tutorial on when they need to (e.g. during the trial period for a product), and turn it off when they’ve had enough.
The real satisfaction in any game, even the endless ones like Tetris, comes from a feeling of progression. This could be a progression in general terms, although I’m assuming most of us don’t deal with projects that a user can just “finish”.
But, depending on your project, each user-session can be imagined as a quest to be completed. Then, the success of your gamification enterprise will depend on how well you’re guiding your player through the composition of space that you came up with.
The progression is traditionally represented by progression bars, percentages, etc.
Keywords for establishing progression arcs are:
- Quests — completing which the user can get more —
- Experience points — getting enough of which they’ll be able to step onto the next
- Levels — the ultimate representation of a user’s time and effort invested in your project.
3. Rewards system
I was unfairly harsh on the badges earlier — they can actually work wonders. And gamification per se wouldn’t work quite without some kind of rewards system integrated.
What we’re looking for, ultimately, is an investment from the user/player. Investment can come in the form of money, time, or specific actions. And that investment needs to be rewarded.
Even something as simple as awarding sobriquets for correct answers on forums, or “expert” status for advanced knowledge will work perfectly fine.
It’s important to make sure you’re offering this in addition to the valuable service/product, and that the underlying mechanic of getting these points really constitutes a “game experience” — i.e. specific tasks completed by the user in a specific way that you want to reward.
Don’t fall into a trap of overly rewarding your user, though, as that might end up exhausting rather than stimulating.
4. Reminder of risks
The thing about most games is they have stakes. Your character can die/fall/not make it in time, and fail their mission. The thrill of a potential failure keeps a player engaged, wholly attentive, and ready to learn more.
In video games, this is often (though not always) represented by the health bar, showing you how much room for error you still have.
As usual, the mileage will vary. It’s not exactly user-friendly to punish an app’s user for making mistakes or not engaging enough. You need to find a way to inject just enough peril that the user will stay engaged but not frustrated.
If what you’re building is an app providing a vital service, find where, if anywhere, the stakes lie. Then, once you find where the stakes are (e.g. their website’s positions would drop) — hit that pressure point from time to time.
For example, if you’re designing a product, it’s essential to know how every feature available to its user is necessary and vital for their overall success.
That means that using a timely reminder will mean that a certain feature is not being engaged, therefore the product is not being used at its maximum potential, therefore the user is not accomplishing the goal they need to accomplish.
5. Strategy and customization of workflow
Here we’ll talk about two very important notions for game design: width and depth. Width means all of the different features and functions that your product offers. All of the different buttons, modes, etc.
Then there’s such a thing as depth, which means the functionality that a user can get out of the product if they combine the features in order to create the most efficient workflow.
It’s how the features interact with each other, and how you can set up different processes to work together. Maybe the end-user will get all the same results and not necessarily “unblock” new ways of using your product, but they will find new, more efficient ways to do it.
It’s all about cultivating the feeling that there are “right” and “wrong” ways of using the product you’re designing. That, in turn, creates an incentive to learn more about the product and the service it’s providing, in order to build up the skills necessary to get the biggest benefits with the smallest efforts.
Additional game design principles to consider
Having an overall theme/narrative
This obviously won’t work for most of us, but the overwhelming majority of apps and products currently on the market have, as their theme, “the program”.
The vast majority of video games today have a theme and a narrative, as well, which impacts every screen, every menu, and every line of text they see. A particularly fun example here is TunnelBear VPN, which has, as its theme, well, bears digging tunnels.
However silly it might seem, it goes a long way in helping users connect emotionally to the app.
Having varied anticipation effects
That means all the different “task in progress” bars. In a game, when a player pushes a button to complete an action that takes some time, you’ll often get a juicy animation or a fun animatic.
I feel like we could take a page out of their book. To come back to the TunnelBear example (I swear this is not a promotion) — the connection to the VPN takes some time, so it takes a form of your bear going underground to dig a tunnel and come out the other side in the country of your choosing.
Tunnelbear. Image by tunnelbear
Using competition to drive user engagement
Arguably the biggest thing that makes a game — competition. This is definitely not available to all of us, but having your users compete with each other for valuable rewards or just bragging rights can work wonders.
E.g. when YouTube first started there was a brilliant column showing the amount of video you’ve watched on your current account.
It wasn’t anything special, but it sure drove a bunch of people, myself included, to get weirdly competitive over it, and, therefore, spending a whole lot more time on the platform than we would have otherwise.
Using boss battles as teaching moments
This harkens back to the tutorial part, but having a boss battle as an endpoint to your tutorial is a brilliant move.
Forcing your user to use all of the skills they’ve learned, possibly in more of a stressed environment, can make a difference and help them learn the ropes much more effectively.
It’s not easy to pin down what constitutes “game features” in designing human experiences. In fact, if the underlying product you’re building is not game-like, it seems even a little useless.
What gamification can be instead is merely taking pointers from people who create experiences their users want to plunge thousands of hours into. And that kind of expertise should never be overlooked.
Senior UI/UX designer at Awario.com