Gamification helps to improve the design of a non-games environment by adding game strategies.
Why do we need gamification in web design?
- To increase users’ engagement into processes
- To encourage people for actions
- To increase customers’ loyalty to the brand
- To achieve goals by playing
- To produce positive emotions by contacting the brand
The thing we have to remember: gamification makes the user’s path to his main goal funnier and easier. And makes him want to come back and repeat his experience because it’s cool and fun.
Rules of Gamification
So how to make gamification work for us? Let’s first analyze any game’s characteristics and then transfer them into non-game contexts.
When you play a game you always engage with a story. Like when you play The Witcher, you know who you are and what you are looking for, probably you like the story and adventures that it gives. You love the graphics, how the characters are drawn. In any game, you always have a map and you know what to do or the game tells you what to do next. And you always win some cool stuff you can collect while moving to your ultimate aim.
So you can pick up game elements to make processes look more like a game. Never forget that users came to your web page not to play, but if you offer them to achieve their goals in game manners, probably they will enjoy the process.
We can rely on K.Robson’s article about the gamification process with a game design model MDE, where M is for mechanics, D is for dynamics and E is for emotions. But never forget that gamification is not about game design.
Mechanics includes the story you created, the rules and progression that make users want to repeat their experience, dynamics includes users’ actions and emotions mean that users have fun on their path to the goal.
#1 – Create a story
Your story will frame the user’s “playing” experience and define the main options of the “game”. The story tells users what to do and navigates them, helps users to stay engaged with the product, because any game is always a story, and it represents scenarios for people to “play”: is it a competition, is it a self-representation, is it searching of solutions? A story will tell.
#2 – Create an environment to pretend
When we play games, we can become someone else. We can dive into different roles and act and decide as to the game’s character. It’s fun, right? Like when Instagram’s Stories offer us different masks and we can pretend to be someone else when we put on a puppy mask, for instance. We can be more playful and have so much fun.
#3 – Set up rules
We can’t play if we don’t know the rules. So use the visuals to set up those rules, tell the users who they compete with, how much time they have, what are they “fighting” for, etc.
Rules define the web project users’ actions, so designers should create reasonable content for the whole story.
By setting up the rules we also create conditions when we can mark the user's progression and reward him. Rules also define the main goal for a user.
#4 – Goals
It’s fun to complete tasks, right? It gives us a sense that we’ve made something good with our lives. And when we get feedback and prizes for our actions, it is even cooler. For instance, when you leave your email and get useful materials from a web project, it’s nice. So you not just made something, but you got a prize - a tiny “thank you” or “hello” from a brand.
#5 – Interactions
Define if users will compete or cooperate with other users. This gaming element makes interaction with your product more interesting.
#6 – Never complicate
When we talk about games we talk about different levels. Game levels engage the player and make him want to continue his experience. But in web design, we shouldn’t forget that the easier web navigation, the better the user's experience. Gamification is not the process of your product becoming a game, it is a process when you use game elements to achieve users’ goals. So don’t confuse users.
Gamification trends
#1 – Encouragement for actions through gamification
People tend to make fast decisions because nowadays we have so much to do in 24 hours. So gamification through its visuals and game-like processes helps us to say “yes” to brands. For instance, Nike not just tells us about its products, but offers us games and competitions, so we can use their products to participate in the game. They give us much more than just running shoes.
#2 – There will be no difference between fun and goals achievement
Gamification makes the processes easier and funnier. So what will we choose: boring process or fun adventure to the goal? Nowadays “serious” areas like banking, investment, finance, etc. use gamification more often, so now they have loyal customers. When Tinkoff bank offers the users to participate in the storytelling of their saving experience and offers a prize for the best story, it becomes closer to the customers and makes them interact with themselves.
#3 – Learning new roles
Gamification helps users to learn new roles through playing and nowadays people tend to learn new roles. We can learn new skills by educational games. For instance, different online simulators can teach us how to act if someone feels bad or needs medical help. We can read literature on these topics, but we can’t practice it. Simulators and educational games help with it and.
#4 – New vision of mistakes
It’s not that scary to make mistakes if you are playing. So gamification helps us not to think about mistakes too much, but try and try to get the best results and correct our behavior. Visuals and animation can make the process of failure less stressful. For instance, different brands offer us to learn languages by playing (using pictures, voices, movie clips, etc), so the whole process is getting easier.
Gamification types
To gamify the process you can use different gaming elements. We collected gamification types in a list with explanations:
Onboarding
It is easier to learn about something by playing, so users can play or collect points to learn more about it, etc.
Gamify the waiting process
If a user should wait, why not play? For instance, at canva.com you can read different quotes on design while waiting for the files exporting, but also they can create a mini-game or quiz on service functions for those who should wait.
Gamify error pages
One can gamify error pages, so users are not frustrated by it. For instance, Chrome has the pixel dinosaur game one can play by pressing the Space button. It helps to “kill” some time while waiting for the connection. Gamify completing tasks with stickers, badges, etc.
Rewards
Rewards always motivate users for actions.
Gamify the progression
It is nice to see your progress framed in good visuals, so you know your level of progress with progress bars.
Leaderboards
Leaderboards help users to connect with other people and interact with them. Element of competition is one of the main game characteristics, so we can use it wisely to improve the users’ experience.
Points and bonuses
Points and bonuses gamify your website too and help users to stay involved with it.
Self-expression
It is another type of gamification. We can “play” with icons, images, and fonts when we post our pictures or messages, for instance.
Timing
Timing as a gaming element can be used to evaluate users’ interest in the process, so if we add a mini-game when time matters, it can be much more interesting for users to stay on the website.
Conclusion
Gamification is a great tool that helps designers improve user experience. We can achieve goals more easily by playing. So the user’s interaction with products, devices, apps, websites can be fun and with minimum stress with the help of games. In this case, microinteractions have the same goal - to create a good user’s experience, but differently. If you want to learn more about microinteractions, read our article. Gamification is much more complicated and it asks more actions from a user.
