Gamifying UX Design

Go to article

By Sarah Park

DECEMBER 18, 2012 0 COMMENTS

4 Game Mechanics to Engage your Users

The integration of game mechanics into an application or website, known as  “gamification” is used to increase participation and engagement. As user experience designers, we are constantly seeking new ways to engage users, so gamification is assumed to be a natural step. But gamification is more than just an added layer – there are many overlaps between pre-existing game mechanics and existing UX design principles.

Adding Appropriate Game Mechanics

Games involve risk-taking, skill, and a varying degree of challenges and actions the player must overcome. Games’ challenges have to be challenging enough to keep the player engaged. However, your web application should be like consistently winning the lottery– takes minimal effort and is easy to use, but is very rewarding and engaging.

Because of this difference, UX designers need to go beyond slapping on any game attribute. To quote John Ferrara, “Design considerations like the context of use, efficiency of navigation, complexity of decision-making, and mental models are native concerns of UX designers.” These are the areas where appropriate game mechanics can benefit an application.

We need to understand the why behind key gamification techniques. Only then can we recognize the UX design techniques inherent in these game mechanics.

Provide users with opportunities to succeed.

1. Show users their progress.

Breaking up large goals into smaller and easier steps creates more chances to feel a sense of achievement. A large goal that takes a long time to complete is intimidating, but by using progress bars, check marks, and other indicators, users are motivated every step of the way.

Keep this in mind for sites where users must fill out many forms before accomplishing their end goal. In UX design, this is usually referred to as progress dynamic, while in game design this is called progression or levels.

Linkedin uses a simple progress bar to encourage people to complete their profiles – a process which is both inherently useful, but also more fun when tied to a visible goal.

Domino’s Pizza gives users a way to visually track the status of their pizza. The main concern (i.e. user goal) customers have is “where is my pizza?” Even though they’re told it’ll take 30 minutes, being able to see the individual steps makes it feel as though the process moves faster.

2. Add Value with collectibles.

From expensive paintings to rocks – we know people like collecting things. Whatever the collection may be, the collector has invested some emotional value, and this value accompanies virtual items as well. Virtual collectibles such as badges and points can be used as great incentives and immediate rewards for small goals.

Your users may not need to collect any badges to accomplish your app’s goal, but these virtual items encourage user engagement by adding to the value of their actions and progress.

This relates to the game mechanic of having bonuses for players, and these virtual goods gives website users more attachment to the site.

Users don’t use Codecademy for the badges– they use it to learn how to program. But learning a skill is a vague, long-term goal. What helps users retain motivation in the short-term are the colorful badges and points they earn at Codecademy. Instead of grades (where users can feel failure for not achieving high enough) these virtual goods only accumulate (i.e. users only feel success).

While badges are commonly collected items, remember that users also collect everything from friends (e.g. Facebook) to videos (e.g. YouTube).

3. Personalize the experience.

In games, players can sometimes change their interfaces, characters, style of play, or character story to create a personal experience. Whether it’s an avatar’s hair color in a game or a profile picture in a website, the ability for personalization attracts people by giving them a form of ownership and value towards the platform.

For some games, replay value is added by allowing players to make choices that affect the game’s story. Thus, the player will be inclined to play the game multiple times since the game will not provide the same experience the next time around. The same thinking applies to web applications. When a user logs into their account for an e-commerce site, for example, and sees that his recommended items are new but still related to him, he will be inclined to visit again to discover new recommendations.

Before Netflix shows users any movies, they narrow down what movies are more likely to be successfully clicked on and viewed according to users’ tastes. Instead of having the user do the work and search for content relevant to her interests, the application does the work.

4. Predict user actions.

In games, feedback refers to everything in the player’s environment. Positive feedback, such as seeing an amusing animation when pressing a certain key, reinforces player actions while negative feedback, such as dying and needing to restart a level is a signal to the player to do something different. The goal for games is to have a challenge that is not too easy or too challenging for the player.

In UX design however, it’s important to ensure that any task can be done as effortlessly as possible. This means, any negative feedback (e.g. error messages) must be as informative and as helpful as possible. In other words, any roadblocks the user may encounter should guide the user swiftly to the correct page or goal instead of frustrating him.

Twitter demonstrates form-field validation. This prevents users hunting for any errors at the end of a long form filling process if errors are pointed out in real time.

Google use live suggest for their search field to quickly react to user text input and make the task of searching more fluid and swift.

Same Concept, Different Wording

The underlying, psychological reasons why some gaming methods are engaging and rewarding are very similar to why some UX techniques work to retain users within a website. While the appeal of adding a game’s exciting elements to an otherwise plain website can be alluring, make sure the user’s journey to her goal isn’t hindered from simply adding on features. If we pay attention to why certain principles work for games, we can then reapply underlying concepts to strengthen our UX strategy.