Developing the combat


I decided that the combat in my game would be simple and restively easy to handle to attract a variety of players

The player fights an army of minions in each level, up until the boss fights (every three fights)

The minions attack in waves (3 to 6 robots at a time depending on progression in game)

The enemies have absorbed a large amount of colour from the world which will cause them to explode if they are overloaded, when they start to overload they turn the same colour they have absorbed too much of.

The player must shoot characters with ammo of the same colour to overload them

Developing the combat interface

Here are some sketches for the interface I came up with;

You can see in each image the pause button (II) the two long green bars representing health bars, the yellow bar representing the special attack bar, the small grey rectangle representing the total score, and the colour buttons used for ammo selection (coloured circles)

I played around with my design Ideas until I came up with a combat interface I was happy with




1) The first design I came up with places the two health bars at the top of the page, which is a popular place to put health bars in games, the way a person holds the device while they play with it (if they are holding e.g. a phone and have not laid it on a table, like you might with a tablet) makes it easier for them to reach the lower half of the screen, especially on larger devices such as the Samsung galaxy S3

For this reason I placed my action buttons along the bottom of the screen.

The turbo charge shows just above the buttons and the high score box shows under the player’s health bar.

The pause bar is top centre screen so it isn’t in the way of game play but still easy to find.




2) On the second draft of my interface I tried placing the action buttons nearer to the edges of the device so they are easier to reach for the player, I moved the high score box to the centre of the screen at the bottom so it’s more symmetrical and moved the turbo charge bar to the top of the screen nearer to the health bars, so they are all in one place and the player can glance at them easily during the game



3) By my third draft of the interface I realised it would be far easier and less confusing if there were less colour buttons on the screen,  this way they also do not take up as much space. I halved the number of colour buttons, sticking only to primary colours (which can be mixed to produce secondary colours) and placed them along the left side of the screen. This way enemies can approach from the right hand side, and players can use their left thumb to tap the colour and their right hand to swipe and tap at enemies (on the right hand of the screen)



4) I also tried moving the buttons to the centre of the screen to keep a more symmetrical design, but I didn’t think this was as good for user interaction as the previous design


5) I finally settled on this final design, It’s simple,neat and relatively symmetrical.

The buttons on the left hand side are in a more comfortable position to reach than my buttons in draft 3, and all the other elements of the interface are laid out neatly in one spot so the user can see them easily.



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s