Welcome to Phaser World Issue 179.

First, thank you to everyone who participated in the GameDev.js Jam 2024. There were some amazing entries, and the team had great fun playing! We look forward to featuring them in the coming issues of Phaser World.

This week we've released a big new tutorial and project template for those of you wanting to create games for Discord, and we also published our Playable Ads Plugin. You'll find more details below ...

Game of the Week
Sustainable Shaun
This game is a few years old now, but we've never covered it in the newsletter before and I recently re-found it and got sucked into its compelling loop! Help Shaun build a new eco-friendly city for the stray animals of the Big City, making sure to keep them all happy by monitoring resources, food, energy, transport and nature issues.

My Pocket Blacksmith
My Pocket Blacksmith is a mobile and browser game in which you play the role of a blacksmith and create various tools and weapons for your clients.

Bubble Strikers
Super fast shooting game.

Loop Frogs
Guide two froggy friends through a pixelated, time-warping adventure. This 2D platformer will require you to master the time loop and leap your way across 30 levels of hazards and puzzles.

Phaser Discord Multiplayer Tutorial Available
A tutorial and project template showing how to combine Phaser and Colyseus to create a multiplayer Discord activity.

Phaser Playable Ads Plugin Released
Our new unified Playable Ads Template is now available and supports 10 major ad networks.

I have replaced Arcade Physics with Box2D-WASM in the “Making your first Phaser 3 game" tutorial
Check out the GitHub repository with Rollup guide for details.

Building Tetris with Phaser 3 - Part 1: Game Board and Tetriminos
Explore the world of game development with Phaser 3 through this detailed tutorial on creating Tetris. This first video in the series covers the basics: setting up the game board, spawning and moving tetriminos, and landing them accurately.

How To Make Connect Four Game
One of my CodePen pens got real attention. I am still not sure why it has more than 50,000 views and a lot of likes. But why not build a better version with more modern libraries, a better user experience, and a fully finished.

A* path finding demonstration in Phaser
Alexander Semionov's short video.

“Serious Scramblers” HTML5 prototype built with Phaser and TypeScript – Adding sprites and animations
I made a big update to my Serious Scramblers prototype, adding sprites and animations taken from Pixel Adventure assets. See also part 2 and part 3.

Francisco: Hola a todos.

Update of the sandbox where the pixel miners deposit their sands.

This week we have been working on a new sandbox update that will be released soon.

• Fixed user interface bugs when a user used the keyboard on a mobile device.
• Now you'll see how many people liked your pen.
• Titles are updated from the menu making it easier to edit them.
• Now you can fork your own pens!
• And now we have THEMES! You can change the themes from the options menu.

I hope you find these updates useful and keep on programming!

Arian: This week brought back a fond memory: "The Tritogeny of Democritus." One more book on my mother's bookshelf, full of titles on materialist philosophy and Cuban history. I read this book when I was a teenager and I was fascinated by philosophy. Democritus talked about the atom, that's why I remembered him, because I don't have much time to read anymore, but we are fully into a new tool: a particle emitter editor!

This tool has been, for years, a demand from Phaser Editor users. There are some online tools that allow you to design a particle emitter in real time, but having a tool integrated into the scene editor will undoubtedly be a great help. I'm sure many of you (like me) will be able to add more dynamism to your games once this tool is ready.

To make the particle editor a powerful tool, we have to enable real-time editing. This is a great challenge because until now the scene editor updates the scene every time it is modified, and not dozens of times per second, which is a requirement for the new particle editor. For now, we have implemented the option to run/stop the scene update loop. Perhaps in the future we will have to provide the option to change the FPS.

It's a challenge, but so far everything is going well and here we leave you a video of what we have done.

The work we do now in the particle editor will also help us show other animations in the scene and in real time, such as sprite animations, Spine animations, and in the future Tweens-based animations.

At the beginning of the week we also worked on the online version of the editor. Previously you could only work on one project at a time, in a single browser tab. Now each project template has its own database so you can work on several of them at the same time in different tabs.

That's all for this week. In the next one we will continue working on the particle emitter. I will be uploading videos to our #phaser-editor channel on the Phaser Discord server. Have you already subscribed?

Can: Hey all,

Summer is creeping in here! Hopefully, I won't get toasted this summer!

This week was hella fun and productive. We released the Discord Colyseus Multiplayer template. Thanks to you, got quite useful feedback to improve it better! Like mocking the Discord SDK on the local browser. Keep an eye on for the update!

Another big thing is we released our unified playable ads template. We have 10 ad networks supported so that you can get your builds with a single command. We have a lot to improve and provide a better experience, so it's just the beginning!

The last thing is I started to work on Nexus along with Richard, which I'm pretty excited about to see what a CSS renderer can bring to us these days! Soon enough, I'll be coming up with some example games to demonstrate its features. Stay tuned!

Robert: ¡Feliz día de la Madre y lunes!

Welcome to the new Monday dev log! Instead of a wrap-up, this log gives you something to look forward to. I am diligently improving the Examples, specifically more moderation features but that also includes ways you can improve moderation of your own account. You can now also order the examples, based on specific fields like when it was updated, created or published to find the newest ones. Additional filtering fields, for examples of specific versions, framework or status. This week I will likely go back and forth between solving bugs for the next Phaser release and the Examples. Stay tuned for more exciting updates! ¡Salud!

Rich: Last week was quite the week. We played all 49 games that were entered into the GameDev.js Jam 2024 under the Phaser category, and honestly, the quality was stunning. We will be releasing the games through the coming weeks onto the Phaser site and, of course, including them here. Thank you to everyone who took part.

Looking forward, we have a busy period coming up in which we need to start preparing for the next release of Phaser. In the past, all this meant was me publishing the build files to GitHub and npm, and posting a bit of news onto the site. This time around, we need to ensure the release ties in perfectly with everything we've been working on so far this year. That means we have to update all of our Project Templates (there are lots!), update the create-game CLI app, test the new release still works against our Ads Plugin or Discord Templates, ensure that Phaser Editor is updated to support it, add it to the Sandbox and many other incidental tasks. It's great that we have to do this, of course, but it does add a whole new level of orchestration onto something as seemingly straightforward as a version release.

Ben: 2024-05-10

This week, I've been running diagnostics on a range of mobile devices. They're the most popular way for people to engage with web content, yet they're very different to the desktop (or laptop) devices where most development takes place. It's important for us to understand how they work, so that Phaser performs well on these platforms. I'm still gathering data, seeing where the sweet spot lies for batch size and other performance characteristics, but I've already found lots of interesting behaviors.

Some devices have an interesting restriction: WebGL shaders are slower when they use more texture units. But using more texture units lets us generate larger render batches. Phaser can automatically switch over to a smaller batch renderer when it detects it's running on mobile, to keep the shaders running as fast as possible.

This is why it's important to use texture atlases. If sprites are all part of the same texture, they can all be part of the same batch, even on mobile where batches only have one texture at a time.

Actually running these diagnostics is difficult, because mobile browsers don't have good developer tools. So I wrote tools inside Phaser itself, using a new RenderNode that just pushes huge amounts of data into WebGL until the frame rate starts to drop. It's simple, but it gives us quick insight into how our engine performs in the real world. And that's what really matters. With this data, I'll be able to update the mobile renderer to the new render system, and make sure it's doing everything it can to perform well across the mobile ecosystem.

Phaser Releases

Phaser 3.90.0 Technical Preview 1 released 2nd May 2024.
Phaser Editor 2D 4.0.1 released 26th April 2024.
Phaser CE 2.20.0 released 13th December 2022.

Have some news you'd like published? Email support@phaser.io or tweet us.

Missed an issue? Check out the Back Issues page.

©2024 Phaser Studio Inc | 548 Market St PMB 90114, San Francisco CA 94104