Aug 2019: Multi-touch Tutorials — Four Pitfalls

The very first time we showed the game in public, we didn’t have a tutorial yet.  Our dev team of two, plus one friend of the company, were standing by and giving quick demonstrations of how to play.  People picked it up instantly after a short demo, so at the time I’d figured that a tutorial would be simple and straightforward.  I couldn’t have been more wrong. Time after time, I’d rework the tutorial with a set of fresh ideas only to be met at our next convention with blank stares, frustrated users, and booth staff reverting to old habits of personally demonstrating the game to every newcomer.

The core challenges we faced were rooted in the very multi-touch interface that helps set our game apart.  The touch screen itself wasn’t the issue: players seldom needed extra encouragement to tap the screen with a single finger — that’s an instinct that, in one form or another, dates back at least to the advent of consumer electronics.  Getting players to play with two fingers at once is a much tougher proposition. And our game? Our game had the audacity to ask the player to use three fingers.  How do we teach that?

For those of you unfamiliar with The Day We Fought Space, here’s a quick demonstration of the controls: one finger on the left side of the screen maneuvers your drone, and two fingers on the right control control the angle and spread aperture of your drone’s cannons.

Our multi-touch controls in action

Our multi-touch controls in action

The multi-touch interface is one whose potential the industry has only just begun to explore, and if you’ve got an idea for something clever, then I hope you can learn from our missteps and successes.

Pitfall #1: When people find something that responds, they stop exploring.

The very first iteration of our tutorial was a bit of a non-tutorial.  With a head full of articles praising the unobtrusive brilliance of how the likes of Super Mario Bros. and Mega Man taught their mechanics through level design, I came up with a series of enemies I hoped would prompt the user towards certain behavior.  There were cues in the UI that suggested that the spread fire aperture could be adjusted, but they were subtle. A swarm of tiny scattered ships would fill the screen, too many to target individually, but easy to take down if you spread your firing aperture to cover the whole screen.  Next, a heavily armored cargo ship would float by, with enough hitpoints that you’d need to concentrate all your fire on it to destroy it before it floated off-screen.

It was simple, it was unobtrusive, and it utterly failed to teach players how to play the game.

The scattered swarm?  Players were content with only taking half of them down.  The armored cargo ship? Dismissed as an over-powered enemy.

The issue here was that poking and prodding the screen, pretty much anywhere, produced some sort of response — and thanks to the irrational primacy effect, that first response became, in the player’s mind, the principal way to interact with the game.  To make things worse, not only did not a single player experiment with pinching and spreading with two fingers, but many would only either dodge or aim.  They’d find one thing that did something, and then they’d stick with that thing.

Our touch screens aren’t arcade cabinets: there aren’t clearly marked buttons that a player might see and wonder, “Hey, what does that one do?”  The versatility of touch screens means there are dozens of meaningful, intuitive gestures one can implement, from simple taps to drawing lines to swiping to playing ‘chords’ with multiple fingers like it’s a piano to pinching and spreading and rotating — but that large inventory means that almost certainly no player is going to, unprompted, start cycling through every possibility. And, unfortunately, this versatility also opens up the door to our next pitfall.

Pitfall #2: Expect superstitious behavior.

Pictured above: trying to pop enemies like bubble wrap

Pictured above: trying to pop enemies like bubble wrap

Once we did finally put enough cues in place to prompt users to pinch to focus their fire on the larger enemies, we hit an unexpected snag: about half of our players thought that it was the pinching motion itself that you used to fight enemies, rather than a tool to focus your drone’s fire.  Once a scattered swarm of enemies appeared, they made the game ten times more difficult by trying to pinch each individual enemy, which didn’t work well but did work just barely well enough to make them think that they were doing the right thing and they just needed to be inhumanly fast at it to succeed.

Even after putting in a separate stage explicitly encouraging people to spread out their firing aperture, we’d have some people continuing to pinch every tiny enemy, partly because of our good friend the irrational primacy effect, and partly because of pitfall number three.

Pitfall #3: Anything that can be ignored will be ignored.

This one is hardly unique to touchscreens, but I’m including it in the list because I was unprepared for the sheer depth of the human capacity to ignore instructions when I started in on our tutorial.

One tutorial had some subtle cues with tiny hands making pinching or spreading motions.  They got so very ignored. I don’t think a single person noticed them.

We had several iterations of the tutorial where we played an animation that took up over half the screen and showed you what to do.  Those got ignored by at least half of our players.

In response to that, eventually we made a version of the tutorial where if a user hadn’t completed a task after a while, we’d bring the animation back hoping that players, realizing that they were making no progress, would stop and read the directions they had dismissed earlier when they came back around a second time.  What actually happened was that players would dismiss the instructions as quickly as they possibly could so they could get back to banging their head against that wall.

The key to our tutorial would prove to be instructions that one couldn’t ignore, and I’ll explore the techniques we used to do that in part two of this article. But even once we finally had players’ attentions, we had one more obstacle to clear.

Pitfall #4: Be prepared for misinterpretations.

At PAX South 2019, our tutorial began with a simple message: “You’ll use both hands to fly your drone.”

More than a few took this as an invitation to grasp our iPads with two hands like a steering wheel and, to my dismay, vigorously try to wrench them free of our brand new display kiosks.  Certainly wasn’t an outrageous conclusion for a player to leap to, but it made us re-think our wording a bit and include a small diagram for good measure.

Slightly-more-difficult to misinterpret directions

Slightly-more-difficult to misinterpret directions

And even when they aren’t technically mis-interpretations, expect players to stretch their interpretations of your instructions to the very limits.  One version of our tutorial had a message that ended with the phrase “tap anywhere to continue,” and I swear, about ten percent of users went straight for the pause button despite it being tucked away in the corner of the screen trying very hard not to draw attention to itself.

Moving Forward

In the second part of this tutorial, we’ll take some steps backwards and talk about the strategies that were successful in overcoming these and other obstacles until we finally came up with a tutorial that got us nearly 100% comprehension rates.

Catherine Kimport