Phaser Editor installer
We're very pleased to announce that Phaser Editor v4.1 is now certified for both Windows and macOS. Certification means the OS knows it can trust the app, so you'll no longer get annoying warnings about it being potentially 'dangerous' any longer, plus it's now fully compliant for company networks.
The new build also makes Phaser Editor fully compatible with Apple Silicon and Windows ARM processors.
We've also invested in a commercial suite of professional installation software and have used it on Phaser Editor for both Windows and macOS. Gone is the 'zip file' of old, instead, say hello to a lovely smooth installation process that fits seamlessly into the way your OS works. You'll also get our shiny new Editor icon in your macOS dock or Windows task bar. Plus, should you need to move it to another device, there's a fully native uninstaller, too.
Particle Emitters
This release isn't all about installers, of course. It also sees the introduction of a highly requested feature: Particle Emitters. You can now visually create and edit Particle Emitter Game Objects, directly from the Editor. Dropping them right into the Scene, exactly where you want them, with instant edits and a real-time preview:
All of the core Emitter parameters that the Phaser API exposes have been implemented in the Editor, allowing you to easily create some amazing visual effects simply by experimenting with the Inspector, rather than having to change your code and re-run your game to see if the edits worked.
All parameters have been grouped in the Inspector view:
As with all other Game Objects in Phaser Editor, you can turn the Particle Emitters into a Prefab, Prefab Variant or a Nested Prefab. Allowing for infinite customization and deployment across your game Scenes.
Adding the Emitter generates the Phaser code automatically for you. But you're free to modify this code, adding in any additional configuration parameters, or combining it with the logic of your game, as required. You could visually make an emitter that provides the 'thrust' effects coming from a jet engine, or an explosions or debris, then invoke that from your game code as needed.
Because particles are living, moving entities, we had to change the way the Scene Editor worked. It's no longer a fully static Scene. So to get the real-time preiew of the emitters in action you can click the new 'Play' button in the Scene toolbar. You can also restart the Scene with the 'refresh' button, which is really handy for testing emitters that work as single non-flowing effects, such as explosions.
Particle Emitter support is a comprehensive new feature and you can learn more about it in our documentation
New Project Templates
If you've been following what the Phaser team have been up to this year, you'll no doubt have seen we released a huge amount of project templates. These allow you to easily pick the front-end or bundler you wish to work with, i.e. React, Vue, Vite or many more. They are pre-configured with sample projects, build scripts, deployment scripts and documentation.
And now, all of them have been updated and configured to work directly in this new release of Phaser Editor.
When you now start the Editor and press the "New Project" button you will find all of the templates these, ready and waiting. Some are bundled into the Editor (i.e. available offline), which are listed at the top. The rest are downloaded as required. Use the new 'Search' field to quickly filter the list if there is a specific template you'd like to use.
Automatic installation of dependencies
The modern web stack can be an overwhelming place in which to work, especially for those more familiar with game dev than web dev. Although our project templates make it easier to get started, they still require you to have node and npm installed, plus be familiar with the command-line and running npm scripts.
Even those of you who are already familiar with this workflow, it still involves an extra step and time to download and install before you even even start using the template within Phaser Editor.
Which is why, new to this version, Phaser Editor will now take care of that for you.
When you pick a project template that uses a modern web stack, such as a bundler or framework, Phaser Editor will recognize this and prompt you if you'd like it to handle the installation for you. You don't even need to have node or npm already installed, as it's now bundled into the Editor by default. This allows Phaser Editor to run automatic installation of dependencies at the moment you create a new project:
Of course, some of you would still rather have control over what node/npm is doing on your system, and you may even have a specially configured npm build for a corporate firewall - in which case, you can just pick the 'Skip' option and manage the process fully manually. But for most of us, the default 'Install packages' option should save us all plenty of time!
Note that on Windows, the above dialog may look different, as we use the system Command Prompt to handle the installation.
Learn more about the first steps with Phaser Editor
Automatic Development Server
As well as managing project dependencies for you, this new release of Phaser Editor will now also launch the development server, too. Previously, if you were using a project template that had a development server, which most of them did, it was up to you to open a command-prompt and start this running before you could even click the "Play" button in the Editor.
It wasn't a complicated process, but it was a confusing one if you were new to web stacks, not realising that even had to happen - and even if you weren't, it still took up valuable time. Plus, it often made it look like the "Play" button simply didn't work. As you rightly expected it to launch the game, but it couldn't because the dev server hadn't been started.
Thankfully, we've addressed this top-concern in Phaser Editor 4.1. New in this version, the Editor will check to see if the dev server is running first. If it is, the browser is opened and the game starts. If not, you now get this handy prompt asking if you'd like the Editor to start it automatically for you:
As with dependency installation, power-users can of course skip this step. If you pick the "Start Dev Server" option, the Editor will run the dev server via npm in the background, plus it will also verify if the project dependencies have been installed, or not. If not, it will run 'npm install' for you as well.
If we've learnt one thing over all these years of working on Phaser and Phaser Editor, it's that developers have their own likes and dislikes and ways of doing things. While we could force all Phaser Editor users to use just one single build tool, i.e. Webpack, we know that you all have your own preferences. When that comes to front-ends, the choice is even more diverse. We don't want Phaser Editor to force you to only have a single option, and these changes are our way of giving you that flexibility while making life easier at the same time.
Other changes and bug fixes
- Fixes serialization of the NineSlice object with a size smaller than the border values.
- #7 Adds support to more audio formats.
- Logs all server and desktop messages and errors to
server.loganddesktop.log. - Server gets WebP image support.
- [#1] Fixes bad layout in the Inspector view when it imports multiple images.
- Removed legacy license key support.
- Clicking on your profile image / name will now open your Phaser account in a browser.
Download Now!
Phaser Editor 4.1 is available immediately for all subscribers. Simply login to your Phaser account and go to your Downloads page to grab it for macOS, Windows and Linux. If you need the Core Version, you'll find a zip file for that too.
Phaser Editor is a power-tool for Phaser developers. It doesn't remove the need for you to actually code, but it does augment your workflow with a suite of visual tools, asset management, prefab system and lots more to help you create and iterate faster. And now, it will help with dependencies and server set-up as well. We've a lot more exciting features on our roadmap, and this release is a big step in that direction.