Create HTML5 Vertical Endless Runner cross platform games

Using Phaser framework and other FREE software
Endless runner games are gaining more and more popularity and they are really easy to code.
I will take you by hand through the creation of a complete HTML5 vertical endless runner cross platform game with a lot of features and room for customization.
100 pages + 31 source code examples with a free update to come in a few days.

“Trick Shot” HTML5 game prototype part 3 – handling collisions

Emanuele Feronato Box2D, Game design, HTML5, Javascript, Phaser

Here we go with the 3rd part of Trick Shot HTML5 game prototype. I showed you how to charge and launch the ball in step 1, and how to create a moving crate along with an obstacle in step 2.

Now it’s time to handle collisions to determine if the ball entered in the crate without touching its opened top.

Let’s have a look at what we are going to create:

You should know how to play, click and drag inside red box to create and charge the ball, release to launch the ball and try to make it fall inside the crate. If the ball falls inside the crate, that is if the ball hits the sensor, we set ball restitution to zero to make it stop inside the crate. If the ball touches crate opened top, then I destroy it. The original game does not work this way, but it’s just a prototype to show you how to handle collisions.

And this is the commented source code, with new lines highlighted.

Now you can make your Trick Shot levels. Next time I will show you the first couple of levels, meanwhile download the source code

From null to full HTML5 cross platform game

I will take you by hand from the bare bones of JavaScript programming through the creation of a full cross platform HTML5 game, with detailed explainations and source code.

If you don't know where to start, then From null to full HTML5 cross platform game is the book for you.

Comments 1

Leave a Reply

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