What 4 things can Sonic the Hedgehog teach us about UX?
Anyone that knows me will know that I have an age defying obsession with Sonic the Hedgehog. I still remember the Christmas my parents got me our Sega Mega Drive (Genesis to our overseas cousins). They pretended that we had no more presents after we had opened the ones under our tree, and then pulled out a mystical wrapped box after dinner time.
So of course I had to find a way to shoehorn the holy blue one into this blog, and of course the topic of user experience. Fortunately, that has not turned out to be as contrite as I first thought it may be.
Lets take a look at the above screen. This is literally the first experience many children (and adults) had with a video game. There were no tool tips, no guided navigation and Sonic isn’t the kind of character to offer helpful advise.
But you still knew what you had to do within about 15 seconds of firing the game up. How did Sega and Sonic Team accomplish that?
After only 9 seconds you can see Sonic is getting pretty fed up waiting about if you don’t press anything on the controller – that’s our first visual cue – the game is literally begging us to interact with it. The logical thing to do is to press something.
The next visual cue comes in the form of the gold spinning thing on the right that you can only see half of. Gold things are normally pretty valuable in real life, and that metaphor translates nicely into the game – so the player is highly likely to want to move closer to see what it is.
This technique is still in use heavily today, only showing a small teaser of an object or piece of content in order to encourage a user to explore or interact. Just look at the partially concealed icons on the Apple App Store which provide tantilising hints that more content lies beyond.
It’s only a matter of seconds before the player runs into their first bad guy. Ok he’s a standard issue ladybird riding a unicycle, but he can still kill Sonic – which will be quickly discovered if the player walks into him with no rings. It’s a mistake that will only be made once (at least on purpose). That’s learned behaviour right there. Fortunately you get a couple of lives to keep you going so it’s not a catastrophic punishment for making a mistake. It is of course UX 101 to never punish your users for making an error at all, but this being a game means that there needs to be some level of challenge.
The game provides further visual cues to help promote the game mechanics. Notice how the rings indicator is flashing red up in the top left corner there? The majority of us will associate red with danger or warning – road signs being a good example.
Therefore it’s not a massive leap to realise that with no rings in the bank you are probably in danger of dying. It won’t take the player long to realise that to get rid of that annoying flashing they need to grab a few rings. That will give them valuable armour against such a mighty foe. Of course colour should not be the only way you convey meaning these days, due to colour blindness issues…but this was a bit before the days of accessibility.
Encourage users to explore
You’ll also notice on this screen (again remember we are only a few seconds into the gameplay here) that there is a ring television up on high. By this point the player should have learnt that rings = good, so how do they get up there? Fortunately the Mega Drive only had 3 buttons, and in the case of Sonic they all mean jump. Jumping is the primary means of moving around the world, and also a handy way to kill bad guys.
Reward the power users
We’ve got rings, bad guys and jumping all out the way within the first 10 seconds of the game. And to be honest, that is about 90% of what you need to know. The final move to master is the roll. This is for the real hardcore guys. This move one is less obvious, and is likely to be something the player discovers by accident – similar to the ‘pull to refresh’ action on iOS. The game gives some hints by forcing you into a rolling ball in some tunnels which gives you an indication it’s possible, but leaves it to the player to discover how to do it on their own.
Making some interactions less obvious in your design is not inherently bad, as long as the user can complete the majority of tasks without them. It gives an element of satisfaction when they are discovered, and can be that nice ‘gravy on the meal’.
To wrap up
So in summary I think what we can learn from Sonic, and indeed lots of early games – is that we should make it easy for users to learn your interfaces by providing the right visual cues and design in such a way that the next course of action becomes obvious.
Of course conventions and familiar design patterns can help immensely in speeding the uptake of interfaces, but there is still room to throw in a few surprises to give your designs the extra sprinkle of pizazz that make users remember you.