Topheman Bombs (v2)

bombs-topheman-com-qrcode-bandeauAfter Topheman Squares, I decided to make an other HTML5/JavaScript game.

I released a first version of Topheman Bombs in april 2012 which worked in the browser for the iOs devices and in an app for the android devices (both platforms were sharing the same source code, thanks to phonegap). The game is simple, it takes advantage of the gyroscope/accelerometer of your device :

  • Tilt your device to manage the blue dot
  • Tap the screen to drop bombs and kill the red dots
  • Grab the green dots to get more bombs

In august 2013, after many other projects in JavaScript, I decided to refactor the game to make it a full browser compatible and get rid of the android app. I also added some features such as :

  • offline gaming (using Application Cache with the HTML5 manifest)
  • optimized build file (refactored my source code to use require.js and generate a minified build file with r.js/grunt)
  • built-in device motion emulator (using remote-tilt)

Try Topheman Bombs

Ball.js

I started Topheman Bombs to test the accelerometer features of HTML5 (almost two years ago), but I surely finished it to release a real project that was using Ball.js at the time.

Ball.js is a JavaScript class I made back in 2012 that handles physics interaction (such as collisions) between balls, on a flat area (like you would on a pool table) as well as rendering (DOM or canvas).

You can find the Ball.js source code on github as well as a documented API.

The little Story

The idea of Topheman Bombs came to me while I was reading an article on html5rocks.com about accessing accelerometer from JavaScript. Since then, I made other games/experiments based on this particular feature and I learned a lot about it. But what’s sure is I couldn’t have made it without Remy Sharp’s remote-tilt gyroscope emulator (I’ll talk more about that in an other post).

Topheman Bombs sources are on github under Creative Commons license, if you want, you can also take a look at the grunt workflow I implemented.

Tophe

Leave a Reply

Your email address will not be published. Required fields are marked *