The basics behind “jumping on enemies” feature, explained with Phaser and ARCADE physics

One of the most interesting features introduce in platform games is the ability to jump on enemies and maybe squashing them to death.

I am not sure which game was the first to introduce this feature, I would say some chapter in the Mario Bros series, although I am pretty sure in the very first game you couldn’t squash enemies.

Anyway, we are going to see how we can develop this feature in our HTML5 games using Phaser and ARCADE physics.

Let’s have a look at the result:

Our hero is the green character, while the red one is the enemy. Both characters run and change direction once they hit the wall, and you can make green character jump by clicking/tapping on the canvas.

If red character hits green character, the game restarts. Try to jump over the red character and you will bounce over it.

This is made by checking the side of the collision between red and green character. We can say the green character is jumping over the red character when the red character collides on its TOP side while the green character collides on its BOTTOM side.

Have a look at the completely commented source code:

We can create a lot of various platformer games using this feature together with wall jump, next time I’ll merge them into one single prototype, meanwhile download the source code.