Iterating The Tutorial

The tutorial is one of the most important parts of a game. A properly trained player will have a much more engaging experience than a player that’s left trying to figure out what on Earth they’re supposed to be doing. And so, I’ve put a great deal of effort into the design of Hexagone’s tutorial.

In the original release, I gave a brief introduction popup which explained the goals and what the controls were. It was quick, simple, and it got the job done. Then, I let the player start playing. After a few moves, more concepts were introduced with another popup. In playtesting, players that used this tutorial almost always performed dramatically better starting out than those that did not. The tutorial shaved off about 15 minutes on average from the player’s learning curve. This is what it looked like:

 

Do you see what the problem is? A wall of text. Players that actually bothered to read the tutorial would easily jump into the game and know exactly what to do. But some players would just hit “okay”, and then stare blankly at the game, not knowing what to do. You’re not one of these people, because here you are, reading this wall of text. But they exist, and they hate words. Even three sentences, like in the above tutorial.

How do we make the tutorial better for these players? Pictures. And not just pictures… animated pictures!

 

The text has been simplified, and now an animation plays, showing blue expanding from left to right. At a glance, players can now visualize what’s supposed to happen.

This animation actually implies a few things. First, that the player is blue. Second, that they need to expand to adjacent tiles first. And third, that they need not control all the grey tiles – they can skip some to target red. This last one was actually pretty important in playtesting. In an animation where all the grey tiles were conquered, players would always try to take all the grey tiles, even if that wasn’t necesarrily the best tactic for the map. By leaving some in this animation, it implies at least subconsciously that skipping tiles is okay.

But there’s some room for improvement still. This is the current iteration of the tutorial:

 

The introduction fluff has been fully cut. The text is now just seven words, which is far more likely to actually be read. Additionally, the animation has been sped up, with better frame timing.

UX is fascinating to me, and you can always keep iterating and improving upon it. This latest iteration is good, but I look forward to seeing how you guys react and learn when you finally get your hands on it! Have any thoughts? Questions? Ideas on how this could be improved? Let me know!

Leave a reply