Posts Tagged ‘Phaser’
-
Phaser Coding Tips 3
23rd Jan 20150Phaser Coding Tips is a free weekly email – subscribe here.
Welcome!
One of the biggest genres of game that devs new to Phaser want to create are platformers. It appears they can’t get enough of their Mario fix. Being a fan of the genre myself I figured it would make a great new series, especially when you factor in all the things that a platform game needs. In this issue we’ll get started with the platforms themselves.
Get the source
There are two source files this week. The first shows the core mechanics of just the platforms working and the second is the game Jump Up!
I’m only going to highlight the most important parts of the code here. So please always look at the source first. If you’ve questions about something I didn’t cover then ask on the forum.
Run / Edit Part 1 on jsbin or codepen.
Run / Edit Part 2 on jsbin or codepen.
Or clone the phaser-coding-tips git repo.
“Ride on” Platforms
What does a platform game need? Platforms of course! In this weeks Coding Tips we’re going to create two different types of platform, each with their own characteristics. First up is our standard platform. It looks like this:
The platforms are added to a Physics Group:
-
Phaser Coding Tips 2
16th Jan 2015Phaser Coding Tips is a free weekly email – subscribe here.
Welcome!
Missed Issue 1? Read it before continuing. It contains Part 1 of the Tanks game.
I was really pleased with the reception the first issue received! It seems I wasn’t the only one looking for small and focused tutorials. In this issue we complete the tanks game, although there’s plenty of scope left for you to push it further. If you do so please share the end result!
Tanks – Part 2
In Part 1 we got the tank displayed and firing a single bullet at some targets. Now it’s time to make it a proper tanks game and add a landscape!
-
Phaser Coding Tips 1
10th Jan 2015Phaser Coding Tips is a free weekly email – subscribe here.
Welcome!
If you’re anything like me you probably write loads of code. From prototypes demonstrating a single mechanic to helper functions. And sometimes you might even finish a game 🙂
I started this series as a means to share code with you in an informal manner, one game dev to another. The aim is to build-up something over the course of a couple of weeks. Each chunk being easily digestible in a short period of time. It’s something I call “lunch break game dev”: in that you can read and experiment for yourself in under an hour (just try not to get crumbs in your keyboard.)
I’m not writing to any fixed agenda here. I fully expect this series to evolve. If something doesn’t work I’ll pull it, and I equally won’t be scared of trying new things. Maybe one week the code will be far too easy for you, another it might be the opposite. But hopefully in all cases it will spark some ideas for you to play with regardless.
Finally I’m not here to try and “sell” you anything. If I release a new book or plugin then I’ll probably write about it, but only because I’ll be so pleased at having achieved that! On the whole this is our place to write some code together, so please do leave feedback and ideas.
-
Phaser v2.1.3 and Pixi v2 are out!
23rd Oct 2014
Over at Goodboy Digital they’ve been working away on Pixi v2 for some time now. As Phaser is built on-top of Pixi we’ve a vested interest in what is happening in Pixi land and its implications for Phaser. And Pixi v2 is their latest, freshest release.
There’s a detailed blog post explaining all about it, but the headliners include:
- Full High DPI canvas support
- iOS8 WebGL fixes
- Improved rendering performance across the board
- Significant updates to the Graphics class
- Sprite level shaders & more!
There have been a few Pixi API changes to accommodate all of this, but we’ve been able to blend all of these features into Phaser with no changes to our API, so nothing should ‘break’ if upgrading from an earlier build. Instead you just get to reap the benefits 🙂
As well as changes to Pixi there are also Phaser specific updates and fixes in this release, including little gems like Sound.fadeTo, BitmapData.getFirstPixel, BitmapData.getBounds, Rectangle.scale and more. See the change log for full details.
As usual you can grab the latest build of Phaser from github.
-
Pixel Perfect scaling a Phaser game
1st Aug 2014
With GBJam3 just started today I tend to get asked this a lot on twitter: “How do I scale my game and keep it crisp?”
This is a perfectly valid question and is essential for games that rely on pixel art. And the answer is that there is no 100% fully cross-browser compatible solution. There are various CSS hacks and vendor prefixes you can try, but they won’t work on everything.
However, if that was my final answer there would be no point in this blog post, right? When we created our lowrez jam game, which was a game running at a 32×32 resolution, we came up with the following approach that works much more reliably than any CSS hack. Here’s how to get it working:
For this example I’ll assume you are making a GBJam game, so you’ve a restriction of 160 x 144 pixels. The same as the original Gameboy resolution. First create your Phaser game object:
var game = new Phaser.Game(160, 144, Phaser.CANVAS, '', { init: init, preload: preload, create: create, render: render });The important things to note here are:
- Use the un-scaled resolution
- Always use Phaser.CANVAS as the render method
- Give an empty string as the DOM parent (the 4th parameter)
Once the game object is created we use a new object to hold our scaled canvas:
var pixel = { scale: 4, canvas: null, context: null, width: 0, height: 0 }
Hire Us
All about Photon Storm and our
HTML5 game development services
Recent Posts
OurGames
Filter our Content
- ActionScript3
- Art
- Cool Links
- Demoscene
- Flash Game Dev Tips
- Game Development
- Gaming
- Geek Shopping
- HTML5
- In the Media
- Phaser
- Phaser 3
- Projects
Brain Food
