top of page

A Graceful Adventure

My daughter, Grace, does drawings like any kid, some of which are related to video games.  As a learning exercise for ImpactJs I decided to get some of these together and make a rip off of SMB3.

 

Impact is a nice 2D HTML5 engine with a framework for getting the stuff onto mobile quickly and easily.  So my initial goal is to build the game and get it onto Grace's tablet.

Design Goals

  • Player input must be simple and intuitive

  • No random element(s) to gameplay

  • Shouldn't be frustrating for a 6 year old!

Production Goals

  • Learn ImpactJS basics 

  • Put a game onto Grace' tablet

  • Build it in a week

 

Development

The tileset and characters I adapted in photoshop from sketches that grace drew.  Some parts were pretty straight forward, like flipping the body back and forth to make a 2 frame run cycle, while others were more tricky. 

 

It took me some time to get a legible tile set from Grace' sketches ​and I quickly gave up on trying to extract a font sheet from her handwriting 

Impact came with a lot of bits and pieces ready to use right out of the box, so glueing them together was pretty straight forward, although setting up the Apache server proved a bit counterintuitive.  

After a few false starts I was able to get things up and running in a couple of days and start building the content.

 

Mechanics

There wasn't a lot of originality here to be honest.  The goals were pretty straight forward and a world beating game design wasn't really on the list.

  • World

    • Made of solid and 'top only collision' platforms​

    • Don't use pits or instant death traps 

    • Player respawns at the start on death (no checkpoints)

    • Exit door leads to next level, levels play in an endless loop but always start at level 1

  • Enemy

    • Single enemy initially with bounce off walls walk back and forth 'ai'​

    • Enemies don't respawn

    • Second, jumping enemy if there's time

  • Collectables

    • Coin - basic pick up, vanishes on touch and is added to the player's counter​ in the HUD

    • Powerup - As per the coin, but grants special ability until the player dies

  • Player

    • Jump and run​

    • Can jump on enemies to squash them

    • No ducking, sliding or other fancy stuff :)

    • Power grants the ability to throw fireballs while active

Main Character was 3 frames of animation

1-2 were run

3 was 'pain' when hit by an enemy

All were made from the same sketch, just with different parts flipped in either X or Y

Conclusion

I was just wrapping things up to deploy to the tablet when it a Misfortunate Event occurred (Grace is innocent!) and the tablet power socket was broken beyond repair.  I looked for a replacement to solder onto the board, but couldn't find the exact component.

So, considering Impact's native web SDK, I built it there and she played on my laptop.

It was a bit too incomplete and clunky for her to have much fun to be honest, and without a decent frontend for her to launch it herself a bit too limited to have fun with.  She was happy though - she got to bounce fireballs at the critters she'd drawn.

And I learned quite a bit about putting things like this together under a time limit.

A Graceful Adventure 2: Frank's Rampage?

If I was to make this again then there'd be a lot of best practices I've since learned that I'd put into practice.  I'd probably also make it a single button infinite runner, but with a few more power ups and modifiers built into the gameplay (reverse gravity, slow down, speed up etc).

Basically, make it less content heavy and easier to pick up and play, but with more depth.

My son is just reaching the age where he starting to ask about the game's I'm making, so I may take up the challenge sooner rather than later...

bottom of page