Get the full commented source code of

HTML5 Suika Watermelon Game

Talking about Game development, HTML5, Javascript and Phaser.

Do you remember my take on handling slopes with Phaser and ARCADE physics?

It was a nice try and a good starting point if you want to have a look how slopes work, but today we’ll have a look at the most advanced Phaser plugin to handle slopes.

A Phaser enthusiast called Hexus, one day said:

« I’ve been intending to make a 2D platformer with Phaser for ages, and I knew I wanted it to have sloped tiles to allow for a liberating way to traverse the Y axis, but I couldn’t find anything that worked the way I want it to.

I experimented with Ninja Physics, but it’s deprecated and its limitations left me wanting. I tried P2, but it was too much in terms of physics for me, and I didn’t want to tame a beast like that. I started searching these forums to see if anyone had managed to get sloped tiles working in Phaser, with some success, but not completely. The solutions wouldn’t allow for completely free tile placement, and they just stuck physics bodies to the slopes and left it at that.

So, with a somewhat limited understanding of the maths I’d need to learn to achieve what I wanted, I started reading tutorials about the Separating Axis Theorem (SAT), particularly the ones from Metanet and one I found magically through a Google search.

After experimenting with SAT.js in Phaser, I decided that I could totally pull off my own plugin to solve this the way I wanted it to be.

With lots of learning, but with a clear vision of how I wanted the plugin to work, this is what I’ve managed! »

And the result, as you can see, it’s impressive:

I will create an example using this engine next days, meanwhile experiment with Phaser Arcade Slopes Plugin.

Never miss an update! Subscribe, and I will bother you by email only when a new game or full source code comes out.