Games made with Phaser

7
Welcome to Issue 51 of Phaser World There's a nice mixture of content this week. We've the games of course, and some of them are so fun! (Jetpack Spikes had me literally swearing at my screen), but we've got a nice mix of tutorials too. There's also a proper Phaser book published by CRC Press. I've not read it yet (I ordered a copy from Amazon today!) but it sounds good, and anything that helps promote learning Phaser is a good thing :) Until the next issue, keep on coding. Drop me a line if you've got any news you'd like featured (you can just reply to this email) or grab me on the Phaser Slack channel .

Transcript of Games made with Phaser

Page 1: Games made with Phaser

Welcome to Issue 51 of Phaser World

There's a nice mixture of content this week. We've the games of course, andsome of them are so fun! (Jetpack Spikes had me literally swearing at myscreen), but we've got a nice mix of tutorials too.

There's also a proper Phaser book published by CRC Press. I've not read it yet (Iordered a copy from Amazon today!) but it sounds good, and anything that helpspromote learning Phaser is a good thing :)

Until the next issue, keep on coding. Drop me a line if you've got any news you'dlike featured (you can just reply to this email) or grab me on the Phaser Slackchannel.

Page 2: Games made with Phaser

Games made with PhaserKart Wars

Game of the Week A massively multiplayer game of car wars! Stealcoins, use shields and destroy the other players.

Gather

You are one day old. You have no memory of thepast. You have no foresight of the future.

Jetpack Spikes

In this small but fiendishly addictive game you mustsimply avoid the spikes!

Robo

It's all about shooting bad guys! Pick a robot, andunleash destruction across 9 levels.

Lorenzo

Take on the role of Lorenzo the bull in this great littlepixel art game.

Phaser News & TutorialsHTML5 Game Development with Phaser

Learn all about Phaser in this new 280 page bookfrom CRC Press.

Pokemon Go Tutorial

How to create a game like Pokemon Go.

Page 3: Games made with Phaser

Pokemon Go Tutorial Part 2

In the second part of this series you create a Trainerand different species of Pokemon.

SameGame Engine

A tutorial on creating a SameGame Engine in Phaser.

Coin Fountain Tutorial

Create a coin fountain effect with Arcade Physics.

Mobile Game Development Course

12 free sample videos from the Complete MobileGame Development Course.

Patreon Updates

Thank you so much to the following new Phaser Patreons who joined us thisweek: Mike Arlington, Christopher Scott (Feudal Wars), Odysseus Chiu andeli penner. Also thank you to Daniel Egger for upgrading his pledge.

Patreon is a way to donate money towards the Phaser project on a monthly basis(you can also make one-off donations). Donations start at $1 and receivediscounts, forum badges, private technical support from me, and my eternalgratitude, in return :)

Development Progress

Page 4: Games made with Phaser

It's been another insane week of Phaser 3 development. If you're subscribed tothe GitHub watch list, then I apologise for the huge volume of commit emailsyou'll have been receiving lately :)

There is some confusion over what Phaser 3 is. I take the blame for that,because I confused matters by talking about Lazer so much, and saying it wouldbe Phaser 3. So it's time to set the record straight:

▪ Phaser 3 is written in ES5, not ES6.▪ It uses the same renderer as Phaser 2, but with huge improvements▪ It removes the PIXI namespace

Page 5: Games made with Phaser

▪ There are brand new Game Objects and Components▪ There is a new internal structure▪ It deprecates a bunch of old Phaser 2 ways of doing things▪ It is NOT API compatible with Phaser 2▪ There will be a migration guide published on release▪ It is in heavy active development right now, changing every day▪ It will be maintained after release▪ There is no ETA yet, but I'm confident it'll be this year

Fundamentally the way you do things in Phaser 3 is very similar to Phaser 2. Inlots of cases it's identical, but you absolutely will not be able to just run yourPhaser 2 code directly and expect it to work, because it's highly likely it won't.Migration will be needed. Lots of new Examples are being created to help easethe transition.

New ComponentsThis week I added a bunch of new Components. The first was the Transformcomponent. This manages all transform updates for a Game Object, such aschanging position, scale or rotation. It also propagates those down to any childrenit may have. It uses aggressive caching and a Dirty state manager, meaning ifnothing has changed in the display list, then no transform updates take place. If aleaf node in the display list is dirty, then only that node (and its direct children) areupdated, the rest of the list is kept clean. This has reduced processing overheadon scenes tremendously. I'll share some stats and timeline charts with you soonto show this.

Transform properties, such as Scale, are no longer Point objects. This reducedthe sheer number of objects being created for every Game Object, but moreimportantly we don't need to worry about Observable Points, and you can now dothings like single tweens that adjust the position, scale and rotation of a Sprite allat once, in one single go. It's a lot cleaner, and I'm looking forward to sharing itwith you.

Another feature of the new Transform class is that it's not tied to the Game Objecthierarchy. Every Game Object has a Transform component, and a Game Objectcan also have a parent - but the two are not linked. This means you can groupsimilar Game Objects together in a single Container or pool, but that when itcomes to rendering them they can have their own entirely separate transformancestry. While for most use-cases you will want them combined, they don'thave to be, and that's the key difference.

Colors Ahoy

Page 6: Games made with Phaser

Another new Component is the Color component. This manages display relatedproperties for a Game Object, such as the blend mode, alpha, tinting and a newfeature: the ability to set a background color behind a Sprite. As with Transforms,Color updates are aggressively cached, and also use the Dirty state manager.You're now able to set a background color that renders behind the Sprite, and youcan control each color channel directly - allowing you to easily tween the values.

Dirty RendererBecause of the way that the Components work, it's possible to set the rendererinto a new state whereby it only updates the scene if something on the display listis dirty. For example you could render 1000 sprites, but if none of them move fora while, then it doesn't need to re-render the scene. It can just skip the clear anddraw phase entirely. It's not just motion either, even changing alpha is handled.So a Game Object that is fading in and out will still cause a render refresh, but astatic scene won't.

In tests this has made a huge improvement. You tend to notice it most on mobile,where because it doesn't have to redraw the frame 60 times a second, then theCPU / GPU does a lot less work, and the devices don't get so hot! Obviously forsome games this will be useless, but I feel there are many potential use-cases forit, especially in the casual space, and anything that saves battery life, andimproves performance, has to be a win.

There's more I want to write about, but you'll have to come back next week for it:) Development is really exciting right now. I'm loving the shape this is all taking,and I thank you to everyone on Patreon who is making this possible bysupporting Phaser.

Geeky Links

Page 7: Games made with Phaser

Polybius is a new PlayStation VR game coming soon from Llamasoft. And itlooks utterly insane! I can't imagine what it's going to feel like playing this, but Ican't wait to find out either :)

How to be a Compiler is a great article by Mariko Kosaka. It talks about how you(yes, you) can act like a compiler, in order to learn how they work. Then it showsyou how to write one in JavaScript.

Finally this week is GitHub Audio. It's plays dynamically generated audio basedon activities on GitHub. For example pull requests, or opening issues. Each has adifferent sound, and depending on the quantity it can create some soothing andinteresting music!

Phaser ReleasesThe current version of Phaser is 2.6.2 released on August 26th 2016.

Phaser 3.0.0 is in development in the GitHub dev branch.

Please help support Phaser development

Have some news you'd like published? Email [email protected] or tweet us.

Missed an issue? Check out the Back Issues page.

©2017 Photon Storm Ltd | Unit 4 Old Fleece Chambers, Lydney, GL15 5RA, UK

Web Version Preferences Forward Unsubscribe