Successful user interfaces are more important in casual games than in any other type of app. Creating an environment where users can easily enjoy straightforward, fast-paced exciting games is incredibly important.
You don’t want to have to navigate through half a dozen screens to start actually playing Candy Crush Saga. Likewise, you don’t want to have to wait for the game to load up again when you only had to come out of the app for a few minutes to answer a phone call.
Today, I’m going to discuss the elements of great user interfaces found in well-known and beloved (by some, at least!) casual games.
I’ll be making reference in this article to the user interfaces of Angry Birds, Plants vs Zombies 2, and Temple Run 2. These highly-successful apps make great use of UI theory and provide players with heavily-streamlined navigation options.
In a manner of speaking, good – in casual gaming apps or any other type of software – is about being noninvasive, unobtrusive, and intuitive. That is to say: you should try to ensure that users are comfortable in operating and navigating the app without too much thought.
If you find that you have populated a significant portion of your screen’s real-estate with buttons, it might be worth considering whether certain options can be rolled into each other. Many apps achieve this with a simple “hamburger” icon (you know, the three horizontal lines that are stacked one above another?), which – when tapped – will reveal an expanded menu containing all of the necessary options.
Narrow Pathways: Guiding Users Where You Want Them To Go
Angry Birds and Temple Run 2 are two of the most successful games ever in achieving the UI ideals set out above.
In Angry Birds, there’s one button in the top-left of the screen which, when clicked, provides easy access to the restart option, the level selection screen, and audio settings.
In Temple Run 2, the setup is very similar. Press the “Pause” button in the bottom right to stop gameplay and reveal the “Resume” and “Restart” buttons, as well as a swipe-in objectives screen.
There’s nothing wrong with sticking to the basics in this regard – you’ll see a variation of this style in a lot of casual games. It helps keep things quick and simple, so why change it?
Well, you might have to. A game like Plants Vs Zombies 2 is less about reflexes or coordination, and more about strategy. Of course, it still involves fairly fast-paced and exciting gameplay, and so it has been developed accordingly. There are more buttons on screen, but this allows the player to access everything he needs without having to pause the game or – even worse – having to go off-screen while the action continues.
Let Your Users Start Playing Immediately
A very common element in all of these titles is the very quick startup time. None of them require more than five motions of action before you are playing the game. There are are always fewer than five taps between the app selection screen on the phone, and actually looking at the game engine.
This is particularly important in casual gaming, as it gives users a chance to quickly get 5 or 10 minutes put into a game during commutes, lunch, or in the waiting room when they’re going to see the doctor.
Translating User Input Into Game Action
Another factor to take into consideration when designing your UI will be how easy the player can convey their instructions to the game. In games like Angry Birds and Temple Run 2, simple swipes allow for an intuitive method of controlling characters.
On the other hand, Plants Vs Zombies 2 requires that the player first select units and then insert them into a grid-based playing area. Despite the extra motions required by the player, this tried-and-true method of control is perfect for a strategy game. At no point are you going to feel hindered because you have to tap the screen twice to insert a sunflower pod!
Add A Sprinkle Of Visual Flair
While it might not be to everybody’s tastes (especially if you were a hardcore gamer growing up), the graphic design-cum-illustrator look is the pixel art of today. The visual style found in successful casual gaming apps – in particular those in 2D – is strikingly similar across the board.
Take Angry Birds, for instance. You wouldn’t have a hard time believing that the same artists had worked on Plants vs Zombies 2, or Candy Crush Saga, or Farmville. While I won’t deny that the aesthetics vary throughout, it’s hard to argue that they’re not all part of the same visual language.
And so, if commercial success is your number one priority, ahead of even your own creative freedom, you may have to bite the bullet and stick to the same style. Users who see your app will, if a little subconsciously, compare it to what they know. Since a lot of them have likely played a lot of Angry Birds, it stands you in good stead to try to increase your potential userbase by mimicking the graphics of the world’s most successful casual games.
The Challenge Of Great UI
Hopefully, you’re reading this article before you’ve actually started developing your game. I certainly hope that it hasn’t caused any deep regret on your behalf, but the gaming app market is simply saturated these days. Those of you hoping to make a substantial amount of money may have to bite the bullet and make a few changes.
Nonetheless, I feel that these games do what they do particularly well. I don’t play a lot of them personally, but understand that they satisfy a market that it’s always worth tapping into – the typical non-gamer.