Hammer, Grenade and… Splash

Old Fashioned Pixel Graphic games may become much more enjoyable because there are way more creative freedom for game makers, while our mobile phone or tablet devices are fully capable of running them. This is the reason I make a pixel style platform game here.

The design of this project starts as a follow-up toward the Animation Project. The plot of this game is simple. The protagonist walks through the forest, and helps the viligers to defeat monsters on her way.

The Development Start with a list of things needs to be performed:

  1. A character with smooth walking animation.
  2. A jumping animation for the character
  3. Character attack smoothly while attack animation being played
  4. Character can throw an explosive projectile toward enemy
  5. Enemy has AI system, which allows a bit more complex movement
  6. HP, MP, and EXP system for character.

Figure 1, Splash Page of the Game

As you can see, The Splash page is composed of a fading sky (you can see it fading in such a crude way) background, a title and a brief tutorial for starting the game.




For a Pixel platform game, it’s a good idea to let people know what key to use before they even start the game. The control can’t be hard, so it’s better that way. Other than the tutorial, I put flashing behavior on the “Press Anywhere to Start” as a tradition.

You may be wondering why I said “Never mind if you are on Mobile Device”. I will show you this so you know what really happens on Mobile Device.

Yep, there is a Touch Control panel! I don’t think people need tutorial for that.


Figure 2, The game play screen on mobile devices

The mechanism of character attack has two types: Close Combat Weapon: Hammer, and a ranged weapon: Grenade.

The grenade will be thrown in a 60 degree angle so it will only hit far target, if enemy is too close the grenade will explode and harm the character as well. While the grenades explode upon impact, they will roll on the ground and wait for the 2.5 seconds then explode causing the same damage. The explosion is done with particle effect, which has a 360 degree spray. The square rocks can be destroyed by grenades too.


Figure 3, Shows Monster, Grenade, Stone Object and Potions.

Enemies Drop a red potion which reduce the difficulty in the game (because they will heal). They are designed with an AI that has two behavior conditions:

  1. If the enemy does not see the player, they will go from one marked road section to another, then walk back the same way.
  2. If the enemy sees the player, they will disregard the road section and chase the player instead.

Enemies are generated by a spawner on top of the screen. Enemy will be generated and fall from the sky every 3 seconds from the closest spawner to the player.


Figure 4, UI and Game Character display

UI design has two parts, One is the tablet design already shown, the other is the character information and mission display.

Character information is topped by a character head, a level meter, a HP meter (Green Bar), an EXP meter (Blue progress bar) and a charge meter (red fancy bar). The mission progress hang right on top of the character. The red charge bar isn’t very necessary, I made that bar in order to prevent player from throwing 5 grenade/second and limit the frequency to 1 per second. On mission start, it will show how many monsters need to be killed, and the score will update and flash for a second every time a monster is removed from the scene.


Figure 5, Finishing Screen Display

The End Screen has two components, A player comment and a command that you can touch anywhere to continue to replay the game, however I don’t recommend that since that’s the only few content I have.



Anyone can access the game at:


I will be glad if anyone likes my game.

By the way, the character design is basically the same as my previous project.

Annie Hellblaze

Figure 6, Original Character Design


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