Due to the rapid pace of change some links or details may no longer be correct.

Published in Phaser World Issue 114 on 30th January 2018 by Richard Davey   @photonstorm

Death March to release, Sound Manager completed and advanced Tilemap Physics demos.

Today we released Phaser 3.0 Beta 20 to npm and GitHub. It includes every update over the past week (which is heck of a lot!) and is likely to be the final beta release. It includes all of the new streamlined renderer pipeline work, so if you have a chance to test it and spot any rendering issues (especially on mobile) then please let us know! It also includes the final version of the Sound Manager and Tilemap system, both of which are detailed this issue.


Death March to the Parallel World

Those of you who follow me socially probably already know about my love of anime. I recently watched a new show called Death March to the Parallel World Rhapsody (yes, really!) about a games developer who was on a massive death march at his work, trying to get bugs fixed in a game before release. One night he goes to sleep, on the floor below his desk of course, and wakes up in an MMO world with all kinds of special powers.

It's typical harem anime fodder, but the irony of it wasn't lost on me because I literally spent several nights last week in the office, asleep on the floor next to my desk, having crashed after 20 hours of non-stop Phaser 3 work per day. Strangely enough, I didn't then wake-up in an MMO world with the ability to cast spells, surrounded by masses of cute girls (damn it) - I did at least wake-up knowing we were closer to release though.

At the current time of writing (Tuesday, 30th January) we are supposed to release Phaser 3.0.0 in just two days. Even after crunching solidly for what feels like the whole of 2018, with some amazing contributions from Felipe, Pavle and Michael, we're still not quite there. I'm happy with the state of the API. It's the most solid and best it has ever been. There are some features missing, yes, but they can come post-launch. What is not yet finished is the documentation.

I've been writing solidly for a while now, literally hundreds of files worth, thousands of properties and methods and data types, and it's still not enough. I close my eyes and all I see are jsdoc blocks! It's quite a demoralizing feeling, to be honest. I don't mind releasing v3 with features missing, but I absolutely wanted the docs to be complete.

To that end, I have asked Mozilla if it's possible to get a small extension to our deadline. I've asked if we can release on February 12th, which gives 1.5 weeks to finish the docs and 1 week to finish the TypeScript definitions. Based on how much I got done over the past few weeks that feels like a safe estimate without the need to visit any parallel worlds during it. I don't yet know if they'll agree. I asked a few days ago and am still waiting to find out. There will be no more extensions beyond this. Hopefully, it doesn't impact anyone dramatically, but it will make a whole world of difference to me.

Sound Manager Updates

Pavle writes: Phaser 3 Sound API is pretty much done!

I’ve completed the HTML5 Audio implementation and the last big thing that was added to v3, which was lacking in v2, is the ability to play multiple instances of the same sound when using HTML5 Audio.

With Web Audio API there is no limit to the number of sounds playing simultaneously as audio data is stored in memory and any section of it can be read by the Web Audio engine and reproduced multiple times.

With HTML5 Audio files are streamed using audio elements and each element can play only one instance of a sound. So in order to play multiple instances, you need to create multiple audio elements.

For this purpose, I added an option of passing a config object when loading audio (or an audio sprite) which defines the number of instances of that sound that you intend on playing in parallel:


If at runtime you try to play more instances of a sound than defined in this config, there is a pooling system in place that will ‘hijack’ one of the already used audio elements, stop the sound using it, and assign it to the most recent playback. The pooling system tries to find the most advanced non-looping sound and as a neat side effect of this logic, it favorites longer sounds’ playback over shorter ones which provides more desirable audio experience.

On the other hand, if this is not preferred behavior for your project, you can disable it by setting the SoundManager#override property value to false.

Some of the HTML5 Audio examples use this config and provide almost identical behavior that makes it practically impossible to spot the difference when compared to Web Audio examples.

The last thing that I added to the Sound API is a "No Audio" implementation of the sound manager. It is used if audio has been disabled in the game config or the device doesn't support any audio, such as when it doesn't have access to a sound card.

It represents a graceful degradation of sound manager logic that provides minimal functionality and prevents Phaser projects that use audio from breaking on devices that don't support any audio playback technologies.

Things are now all set on the audio side of the framework, just in time for the big release and I can’t wait to see what it will enable you to create!

Groove Contact

Pavle created this Global Game Jam entry using Phaser 3 and of course the new Sound API he created :)


"Place yourself on a microscopic level in a role of turntable needle where your sole purpose is to transform physical dents of vinyl record into analog data to be transmitted via airwaves to our ears and interpreted as sweet sweet funky music.

Level terrain is generated based on the waveform of the underlying music track.

The goal is to produce music track at full speed. Playing slower or faster decreases your score, depending on how slower or faster you play."

Tilemap and Physics

There's actually so much new stuff with Tilemaps I'm going to split it up over this issue and the next, but here's Michael with Part 1 of what's new with the Tilemap API in Beta 20:

A ton of tilemap & physics updates this week, so I hope you like tilemaps! First up, the most exciting stuff: Matter.

Matter – being the most “realistic” of the physics engines in Phaser – is a great choice if you need some physics-based gameplay or have a tilemap with complicated shapes. Here’s a demo where you can wall jump around a map and knock around some crates:


This example shows how you can compose a player controller from compound bodies in Matter & Phaser. The player has four parts – a solid colliding area covering most of the body & three sensors for detecting collisions on the left/right/bottom of the player. The example also walks through how you can use the various matter events to track collisions with the map, e.g. to be able to tell if the player is on the ground.

Since that code has a number of moving parts, here’s a paired down example that shows how you can detect when bouncing balls fall in lava or hit spikes. If you want to dive deeper into Matter, I’d highly recommend checking out the examples on the Matter site.

Unlike Impact, you can easily add and remove Matter bodies from tiles on-the-fly. So how about a demo that removes tiles to create a little time pressure:


Or you can change & add tiles. Hop on the button to raise a bridge:


That demo also shows how can load up an invisible trigger from Tiled and integrate it with Matter. The button has an invisible hitbox so that you can only press it by jumping on top of it (and not by walking into the side of it).

Keep in mind that a lot of these types of dynamic things are more flexibly handled via placing proper sprites in your level, not changing a tilemap. The demos are meant to show what’s possible, not necessarily what’s best.

Next week we'll look at ghost collisions and the ability to flag tile collisions easily.

Phaser 3 Labs

Phaser 3 Beta 20 is out and ready for testing.

Visit the Phaser 3 Labs to view the API structure in depth, read the FAQ, previous Developer Logs and contribution guides.

You can also join the Phaser 3 Google Group or post to the Phaser 3 Forum - we'd love to hear from you!