As a gamer, I hate in-game tutorials. The most common thing is I always want to jump straight into the real game instead of reading those long text-based or image-based indications, or even boring intro cutscenes. But, I still need to learn how to play. So, I think I need a quick, simple and fun tutorial. So as a game designer, it is our task to somehow make players comfortable with the game’s mechanics and systems, making them feel familiar with the things within the game. Months ago, I went to the 2017 GDC and enjoyed a great talk given by Itay Keren from Untame, talking about the design of teaching tutorial by the case of Mushroom 11. I found it is really challenging to design an effective tutorial for a unique mechanics. Because the designer needs to keep it simple and fun by overcoming players’ natural cognitive limitations. In the case study of Mushroom 11, I saw the team took a long time to design challenges to address teaching new concepts by understanding human biases and using various cognitive tools to break them down and making its various rules and tips in order to achieve a relatively painless, gradual and focused tutorial. And, as an UX designer, I know how important is the first few minutes of a game. The truth is, sometimes, the first few minutes of a game can make or break a player’s experience, which means the whole game. So, the designers need to get the player into the charming of the game as soon as possible to ensure they are having fun, otherwise, they will jump out of the game and find something new else to play.

Choosing What to Teach

The images below is from Santa Express, a game my team and I made just in 2 days. The entire game tutorials are three images. When watched people actually play the game, some of them never pressed the tutorial button, some just quickly glazed over. For most of the players, they did not care, because the whole game mechanic is the same with the Flappy bird. They all know that! What’s more, those players, who did not see the tutorials, all know they need to avoid the fly penguins. Yes, our tutorial actually teaches everything they have already known.

So when re-thinking about the tutorial design, I think the first thing is to identify the individual knowledge gaps for first-time players and to carefully consider what you want to teach them. Since we designers usually have already played or tested the game for thousands of times, I felt sometimes it is hard to make it clear which part required teaching. It is a kind of expert bias. So, I think it would be better to list everything, every single knowledge gap before designing the tutorial and then to see what is the most crucial thing that they need to understand. Also, it could be important to consider players’ preconceived notions, probably from their previously game experiences, because no one really wants to learn something they understand from bones as common sense. So, the more experienced the players are the less introduction on certain elements of the game they need.

Learning by Doing

People always amazed by the design of Super Mario Bros. 1-1 level, which serves as a game tutorial with understated brilliance. So understanding how Super Mario mastered Level Design can be a good way to learn how to design invisible tutorials. The game spread its whole tutorial over the first half-dozen levels. The first level teaches you the fundamentals: moving left and right and jumping. But the magic is that most of the teaching is done even before the first move. The player can learn a lot from the game opening screen. The player is the character, standing on a clean ground by using gravity. The position of the character is on the left of the screen with lots of empty space on the right, creating an affordance and subtly indicating the player to move right. The background separation indicated by the blue sky and green hills, and the overlap between the hill and the character. So if the green hill is in front of the character, it might indicate as an obstacle. As the character moves, he will meet boxes and goombas. The box is glowing and hanging with a huge question mark. These are signs of interaction. Since the player has already used the left and right controls, the next logical control to use is the up button to make the character jump into the box and get a coin. And then, the Level 2 teaches wall jumping, and Level 3, sprinting. Once the player has understood these basic concepts, the game starts introducing concepts like spinning blades, disintegrating platforms, and scrolling levels.

All these can be considered like continual learning and experimenting. In the game Plants vs Zombies, also uses trickle teaching effectively. In every level, the player unlocks a new plant and learn how to use these to defeat the zombie army. The game never overwhelms the player at one time, but always gives them something new to play with through the whole game so that the player can spend time with learning each plant and their pros & cons. It can teach and encourage the players to select the plants that are most effective in specific situations, instead of finding the few plants they like at the start and sticking with them through the whole game.

Teaching one thing at a time

So, from the step by step teaching level design in Super Mario Bros and Plants vs Zombies, the second important thing when I re-think about tutorial design is that never overwhelms the player, which means teaching one thing at a time. Players need to understand what’s going on at all times. If the designer gives the player a list of hundreds of combo moves and special attacks, the result would be they will remember only two or three and use those for the entire game. However, the issue can be solved if the designer trickle teaches the player, which means introducing one concept at a time, then the player will have more opportunity and possibility to get each ability.

In the game Progress 100, the first level is just showing a word “progress” on the screen. But at the same time, the colors of the background automatically moves like a progress bar. This level teaches the player that the level finishes as the progress bar going. And then, on the second level, a word “first touch” appear one the screen. The level will be finished when the player touches the screen. This teaches the player that the words on the screen are more like a hint of a puzzle that needs to be solved. After these two levels, the player can understand that the goal and form of this game. It is a puzzle game that using the words on the screen as a hint, and using the background colors as a progress bar to tell the solving progress, which are the most important mechanisms in this game.

These are what I am thinking after watching the video Mega Man Classic vs. Mega Man X. And every game is different and needs to be implemented in different ways. Just be careful with the tutorial design cause if we can make the first five minutes fun, we can probably hook the player to the end credits.

It has been a month now since I came back from GDC. I do appreciate that I have the opportunity to go to the GDC. It is an amazing experience. I hope to share what actually happened at GDC, a general impression of this experience, and some hopefully useful tips to people planning to go to GDC for their first time.

So why did I go to GDC? My background is UX design and I really enjoy creating the player-centered interactive experience where beauty and function intersect. I love what I have learned in ETC and I want to know more. I wanted to see what kind of perspectives other developers, researchers, designers, professors have in this industry, and their considerations and methodologies they have during their design work. In hindsight, I am very glad that the decision of GDC trip is brilliant and great. I met great people and enjoyed great talks.

The first I want to talk about is UX summit since I am a UX designer interested in games. It was a one-day Summit having eight presentations, which I gained many inspirations. This session covered all the facets of user experience discipline in the game industry. It gave me the sense of the UX power in developing the games by using knowledge from cognitive science, psychology, and by applying user research methodology. The talk I love most is the one given by the senior designer Jim Brown from Epic Games, discussing design from rational to emotional, and the one is given by Itay Keren from Untame, talking about the design of teaching tutorial by the case of Mushroom 11. Also, there was a third one, talking about dark patterns in game UI design which I will write in details in my next blog post. These presentations perfectly connected the methodologies and case studies, bringing me a great understanding of human and games, as well as the things under and behind them. After I came back, I also read the book Emotional Design written by Don Norman and mentioned by Jim Brown, learning more about those concepts and methodology discussed during his presentations. Jim gave a deeper understanding of an evaluation of the factors that can create the emotional attachment and the way to encourage those connections in games with focused UX design and techniques. And, in Itay’s talk, I found it is really challenging to design an effective tutorial for a unique mechanics. Because the designer needs to keep it simple and fun by overcoming players’ natural cognitive limitations. In the case study of Mushroom 11, I saw the team took a long time to design challenges to address teaching new concepts by understanding human biases and using various cognitive tools to break them down and making its various rules and tips in order to achieve a relatively painless, gradual and focused tutorial. Thus, I would strongly recommend people interested in game UX to come to GDC UX Summit.

The second thing is the importance of using GDC connect. I downloaded one for checking everyday schedule and activities. But, the most valuable function is inviting people to have a meeting! It really gave me great opportunities and unpredictable benefits. By using GDC connect, I had meetings with senior experience designer from Amazon Lumberyard, UX leader from XBOX, and UX researcher from a design studio. They helped me to review my resume and portfolio, answered my questions in this industry, and helped me to clarify my confusions in careers as well as giving me valuable suggestions. Thus, I would strongly recommend people to make the best use of the GDC connect during their time in GDC.

Overall, I would like to suggest anyone who interested in game development to go to GDC. It was really helpful to your work and career since I got lots of inspiration and motivation during this trip, and met lots of great and amazing people there.

As a game UX designer, I always believe emotional design can bring a capability to reach a broader audience and a deeper way. User experience pioneer Don Norman has a book written about Emotional Design. In his book, he said that a good emotional design has three major components: visceral, behavioral and reflective.

Three levels of emotional design by Don Norman.

Visceral level: It is a fast affective reaction about good and bad. People got first reactions and how they respond.Behavioral: The level of most human behavior, controlled by reflection, but heavily influenced by visceral reactions. Like, something is useful, so can it through its use somehow change people’s behaviors.Reflective: Cognitive, intellectual level. After something is gone, do people still think about the object that they were using when it is no long there.

Visceral designcares more about the natural and intuitive reactions and responses. This component is easy to get as a designer, but visceral reactions tend to be very unpredictable. Everyone will have some sort of reactions to a certain scene but the problem is that it is hard for the designer to predict and tell their reactions whether positively or negatively. Because those reactions are quite personal based on the different experience and context. Also, the visceral reaction is transient. After a short time continually doing other things, the emotional reactions will probably start to fade away.

Thus, as a designer, I think we need to carefully use the visceral design since this component is not good for the retention unless we just want to create a critical moment for first expressions. And the visceral design is more suitable to use for getting people interests early or just for obtaining the short-term goals like daily bonus and reward. One the other hand, the whole game system is serving players for a longer experience, so there are many other methods for long-term goals. As time passed, the game system can affect players emotion, then affect to behaviors. Moreover, if the behaviors change, the game system can respond to those changes and then recycled. It is quite like a feedback loop, which means the game system can respond to both emotional and behavioral state changes.

Affective loop by Jim Brown.

Jim Brown discussed the spree system as an example for the emotional design of visceral and behavioral aspect. “Killing spree” or “power grows” are the good feedback and respond to the game system. At this point of spree time, the player heart rate rises, power grows — this is a visceral emotional reaction. Then they maybe keep attacking enemies that they would not suppose to. This is a kind of behavioral reactions. At the same time, this reaction can also affect other players, like, their teammates will be encouraged and their enemies will be intimidated. Then these will influence each other further and further and recycled.

Killing spree time in LOL.

The reflective component is much more subtle but important. Because as a designer, we want our designs to have lasting value for the users and players. For example, there was a time when I used to play Planet Quest. It’s a game that stays with me long after I put it down. The animals, the colors, especially the sounds come into my mind, my ears, my screens again and again. This lasting experience seems going beyond the initial playing experience.

The gameplay of Planet Quest.

This is all what I learned so far from the three levels. And in general, I can use a formula to point out some relationships in emotional design as a conclusion.

Mini metro is an elegant, minimalistic puzzle strategy game about running public transportation systems. The player is going to connect lines (representing metro routes) to transport shapes (representing humans) using other shapes (representing trains). I have fallen in love with this game and enjoy every second of it. So now I really want to share some thoughts about this game.

Game design can be elegant and minimal.

Easy to learn and hard to master is the meaning of elegant design. In the game Mini Metro, the tutorial just shows a circle with a filled small square and another square. Then a circle drawn by a dashed line appears and moves from the circle to the square, guiding the player to draw a line between the two nodes. This is the first metro line the player creates. At the same time, the player can clearly see the train pick up the small square and deliver it to the other side. This is probably the most intuitive tutorial I have seen and it shows all mechanics in this game. However, this is never an easy game. The player will not be able to keep up with the increasing demand, the stations will overcrowd then the game will end. But, everything comes naturally that the player will never feel that they are being tested. There is nothing between the player and the things that the game wants the player to think about. Everything the player does is learned from their real experience. All about natural is the magic power of elegant design.

This slideshow requires JavaScript.

At the same time, Mini Metro creates its consistent experience for players by using the philosophy of minimalist to both appearance and the game design. The mechanics in this game are basic and incredibly minimalist. It tells a reprehensive philosophy that less can be more, which means the player does not need to do tons of things but still feel richly satisfied. Because when it takes away all the unnecessary details, the game can just focus on its only one mechanic and make that one mechanic really well.

Art can be simple and meaningful.

The graphic design in Mini Metro is incredibly simple and meaningful. Instead of trying to make detailed environments and thousands of assets, the art assets in Mini Metro is cheap and quick. Passengers, stations are shapes while the path is just colorful lines. The flat and abstract graphic interface brings an enjoyable visual experience with no texts. All the elements are shapes and lines but never make people feel bored. Because the shapes and lines are not just random designed. It looks like a map, which gives the player a feeling of travel and navigation.

The Graphic Design of Mini Metro

Moreover, each shape and line have the real meaning. It clearly conveys exactly what is going on the player’s performance. The player can always easily see the trains and the crowds. In addition, it looks like the map maps have a pre-determined layout of all the stations based on the real cities. A certain type of the stations pops up in the corresponding areas of that city maps. If the player takes out the real map and compares with the game map, it is clear that circles always appear in the residential areas and the square represents the transportation hubs.

Interaction can be authentic and delicate.

Games are a good way of thinking about real problems. Mini Metro takes the inspiration and works on a real problem in the transportation system. It is familiar to players but still challenging in decision making. The main experience in this game is obtaining the feeling of achievement by designing complex metro lines to commute people from different places. In addition, there is a mode called Extreme that the trains, lines, and all the other elements cannot be moved or removed once they are placed on the map. It is absolutely more difficult than the normal mode but realistic. At the same time, there are a lot of things that can strengthen this authentic theme. When the player clicks the play button, the main menu slides into the mode selection menu. After that, the mode menu will also pan around to get to the city selection stage. It is totally different with teleporting from one place to another. The whole workflow is so smooth that gives the player the sensation that everything is strongly connected in a whole world.

Besides that, Mini Metro also uses delicate, subtle but no less powerful effects and audios. The real-time feedback in this game is brilliant. If the players connect two stations or put a new element, there will be a flash to enlarge the effect and gives the feeling of fulfillment. Also, if a new station appears on the map, the low string sound will come first then the visual effect comes half second later, which makes people feel excited and brings a feeling that they can know something earlier than it really happens. In addition, the game has an adorable, minimalist soundtrack playing in the background. It’s soothing, which can help people to relax because once the map gets complicated the players will get pretty stressed out.

Conclusion

As a game UX designer, I am always looking for better solutions to problems. Sometimes I feel starting with a simple solution is helpful if I struggle with a problem as minimalism is the straightest path to go when designing a game just like the straight line is always the shortest distance between two points. By starting with minimalism, I can force myself to focus on the more important things in game experience first then to slowly begin to integrate more details while maintaining the balance. In general, Mini Metro is a quite lovely and amazing game. The graphics, the flows, and the gameplay created a gaming experience. And it can bring lots of inspirations and thoughts to me as a UX designer.

When I played Yang’s phone, I found an icon which looks like a camera App but with a name like Transit. It’s called Mini Metro. I was not sure what is it so I tapped the icon, trying to check out what kind of App it is.

What? It is a “game”. Hmm… a simulation game.

Then, I tried to play it. The whole game is based on the graphic interface which means no text to guide. The extremely simple tutorial made me speechless and seems like a fool. Is this really the tutorial that can help me understand the game? OK, maybe I am just not clever enough to get the idea. Never mind. “I don’t want to play it,” I told to myself. But Yang said that it is really a great game and just try it. Ok, He never seems like a liar, Let me try! As a user experience designer, I always need to learn the value of ‘less is more’. But at that time, I felt it cannot be less like this! YOU may lose your audience just because of lacking a completed tutorial. But, wait, if we think from another aspect, it can be a good design since for some “high-lever” player, a completed tutorial will reduce the feeling of “highbrow” or “fancy”. Anyway, after died for 7 times, I finally got how to play it and what is the goal.

Here’s how it works. The player can choose one of the several famous cities, which basically provides a famous set of water features that will require bridges or tunnels. When the game starts, little shapes like circle, triangle, and square start appearing. The player needs to connect this shapes as like making a line between the stations, where a short train starts running back and forth passing by the stations. Your role is in creating the cities’ subway system of the future. At the beginning, the game is really simple and relax, matching the basic principles of game design. But with the timing issue, the number of passages dramatically increasing, the challenge and difficulties popped out. The game needs a strong plan, I mean strategy. The game is all about the balance between of lines, trains, and tunnels. If there is a river but you have no tunnel, you can do nothing, just waiting to die. After playing it again an again, I found Mini Metro is really simple, fun, and addictive. I really wanted to survive longer and have more passengers.

As a mobile game, it is a big success both from the view of mechanics and playable. The $30 price is also worth the experience. And, how can Mini Metro attract me exactly?

Authenticity. This is a simulation of reality games. The game focus on a real problem in the reality–subway system construction. The main experience is obtaining the feeling of achievement by designing complex lines to commute people from different stations. The game only goes by this goal, reducing all the fancy parts, using abstract shapes and lines to represent the game elements.

Interaction and interface design. The target audience is the people who like the strategy and high quality. The UI style is flat and abstract. Different lines and shapes are using different retro style colors. The whole visual experience is enjoyable. We like the beautiful game, and we want to share with others. From the interaction experience view, the real-time feedback is brilliant. When you connect a line or put an element, there is a flash to enlarge the effect, which makes people feel exciting.

Rewarding. The reward is the core part in a game. In Mini Metro, the real-time feedback of those back and forth trains is a kind of reward. This is the feeling of achievement. Also, in the right top corner, it shows the real time number of passengers. This is also a visual clue as a reward, making me keep playing.

There are also something that I feel the game can be improved.

Randomness is an important factor in adding the fun of the game. In Mini Metro, it did not that good about the balance between changes and skills. Maybe it is because of the few game elements. Singer elements will have more impact on the randomness. Such as the location next to river may lead to the need for the more early tunnel so it will influence the selection of products.

There should be a better notification system, fast burst station should be more clearly reminded.

It would be better to customize the map.

The result can be used to give a better game over. For example, there can be an analysis based on the playing data. For now, there is only a chart to show the data.

The best medium to combine the testing of responseability with the game is music.

Years ago, I had once been obsessed with music games and addicted to the game Rhythm Master. Later, I found myself not that agile enough, so I quickly quit playing it. But last month, when my friend introduced a new game called Planet Quest to me, I found the game is so fun and couldn’t stop playing it again！

The name of the game “Planet Quest” is come from its powerful and fancy style background. The player is an alien in a spaceship, coming to a variety of unknown musical-themed planets and exploring a new world. The way to explore is to zap the crazy inhabitants who are all dressed in animal costumes and dancing.

Aesthetically Pleasing

Planet Quest is appealing visually, filling of a great sense of humor and its pleasantly quirky charm is apparent right from the get-go. Each planet has its own distinct visual aesthetic that’s clearly inspired by the music it’s parodying. The metal planet is all darkness and flashing lights, while the reggae planet has a beaming smile on his face. This extremely colorful and quirky style makes me going through levels consistently pleasant.

A Creative Idea for Rhythm Game

With the development of the touch screen. Rhythm games popped up and were loved by lots of players. Planet Quest is great rhythm game with totally different gameplay and style.

Unlike the normal music game, there is no keyboards, instruments or any audio track on the screen. Instead, only a huge planet pops out in the middle of the screen and was circled by the spaceship. The game combined the pace, rhythm, and all the music elements together with the visual interface and gameplay, making the music be a serious part of the game.

Also, there are not much music as the other normal games. In planet quest, there are only eight planets in total, and each has their own accompanying theme song based on a different genre of music. And there are not obviously checkpoint or levels. The difficulty will be added through the time you played.

Simple Mechanics, but Still a Challenging Game

Inhabitants dressed as animals dance and appear at regular periods and the player needs to use a simple tap to catch them.The spaceship hovers at a certain spot on a planet which spins in time with the music, rhythmically dragging the helpless animal inhabitants towards your ship.If the player misses the tap by even half a second and only can catch only their costume. If misses more than that, the player will lose a heart. Totally the player has three hearts to begin with, and lose one if you miss, though you get a half for a near miss, and a full heart if the player gets a ‘Perfect’ catch. The player will also lose a heart if he/she catches a sunflower.

Planet Quest’s music covers everything from pop to reggae, but all in an upbeat electro style. The beat seems that it is easy to follow. And the player may trust themselves that they can easily tap the beat and get a good score. But the reality is that it is always not that easy! At first, the player will just play with the basic mechanics, which is “essentially tapping to the rhythm to catch the creatures”, but then more and more nuance will be added. For example, some levels obscure the game view to add difficulty. This is a very interesting design. Since the camera likes to play with zooming in and out a lot of times, sometimes the planet’s surface appears like little more than a dot in the middle of the screen, and the player can just follow and feel the rhythm to tap without seeing the animals clearly.

Besides the changing of camera, there are many other details that improved the gameplay very well. Like each animal has a different sound effect, giving a clue about what’s heading your way. Some animals will line up nicely with the beam while others will try to slip quickly. Others will come up in large bunches, forcing the player to remember the pattern.

At Last

For me, it is really a crazy interesting game. I love the ridiculously charming settings, and the brilliant tunes and crisp visuals. Also, it’s highly addictive.

I could still remember that it was a Saturday. I was using my iPad, searching new Apps and I found Monument Valley. I played the whole game that night without stopping. Monument Valley cast a spell on me with its lively, magical work. Low-pitched music makes it restrained and elegant; concise icons and refined architecture design make it simple but not easy. The pace of the game is not intense. The movement of architecture, the camera angle shifts, and the NPC conversation are all presented in low-paced motion. The process is slow but effective. Game points are challenging not discouraging. I could only just sit there and keep saying “Awesome.” So now I really want to share something about this game.

The narrative throughout the game is mysterious and intriguing. And the designing of this game is like “Less game, more experience.” Monument Valley brings me a lot of insights. Compared to other games which are focused on mechanic’s side, this game is more likely to design with aesthetics as a focus. It is not about only improving skills, killing enemies, overcoming challenges and achieving goals. On the other words, it cares more about the feeling and beauty, I mean a good story, characters, sensory, and immersion. Lots of new techniques and ways are being used to express this beauty. I think this game create a totally new world and entire newly experience, not just mechanics dressed up with art and story. Monument valley uses good stories and characters, and striking visual and audio stimulation, successfully attracting those who are eager to see strange new things and be immersed in new worlds. So on one side, I think focusing on aesthetics rather than mechanics can make the game more accessible to non-gamers.

For the art style part, this game used Minimalist Style, a style or technique that is characterized by extreme spareness and simplicity. Because of this, this game took away lots of real lighting and textures and there were no complicated animations. It seems they give up lots of useful tools which can enhance the game, but because of this, they bring us a great new experience. Every minute of the experience has been planned, polished in details, and engaging. It gave me an insight that we can try to remove anything that wasn’t necessary. We can fully make those “limited things” on the screen more powerful, making them has their own meaning and context. The color of the game is flat. In each scene, the color all has a great balance of both warm and cooler colors and don’t see any significant weight on either side. The UI part is also very simple but elegant. For example, the color of the main menu is blue. The dark blue and the gradient color make me feel mysterious. The name of the game used white color and simple thin font, which makes the important information more focused.

For the music and SFX part, actually, there isn’t much music and sound effects. But the “simple” audio, combined with the graphics and arts, are perfect. When I was playing the game, I can fully understand the lonely of Princess Ida. If the sound is off, I can just see Ida’s isolation, but I cannot feel it. This is the charming of the sound. One thing I want to mention is that there are many details in the sound design. For example, the start sound effect sounds like the soft and small gong in Indian, announcing the important events. And the background music is calming, making you feel the immersive silence and mysterious.

For the interaction and user experience part, the important thing is the flow and the control of the pace. This is an exploration game and the guest needs to find ways to pass the maze. Because of this, low-paced is much better. For example, I felt pressure when I got a lot of possibilities in finding ways. Low paced can help me to relax and will never increase the unexpected intensity. I can have more time to enjoy this adventure in such a beautiful setting. It also will help the flow. It will be more difficult and takes more time to play after finishing each level. So the low-paced will give more time for a guest to stop and have rest, releasing the stress. Moreover, the whole game is entirely intuitive. There aren’t any goals for the game, but there are buttons which can make the guests intuitively know to guide the character move. And, there is no die or kill. The only thing is that a matter of problem-solving to get past it. From my background, UX, I think Monument Valley is a very good game to play. The guests can immerse themselves in the beautiful visual design, and enjoy the mental challenge of solving the puzzles, but the pace is always steady. The visuals elements, levels, and sound effects are perfectly matched to deliver a very well designed and meaningful enjoyable experience.

In general, Monument Valley is a quite short but lovely and amazing game. I was so mesmerized by the experience that when I finished playing the game. The whole environment colors, the structures, and the characters created a gaming experience. And it can bring lots of inspirations to me as a UX designer. The whole game is just like an artwork and magic show.