Tagged: games

States in Phaser

Phaser Fundamentals: Using States in Phaser

One of the core concepts in Phaser is States. States split your game code up into logical chunks, and you progress through these states one at a time. Typically, you would have individual states for a level in your game, a title screen, a game over screen, a bonus round game, and so on. You […]

Arcade Slopes Plugin

Using the Arcade Slopes Plugin in Phaser

A while ago I wrote a bit of a summary of the different physics system in Phaser, which covered a little bit about how they work and I also followed that up a little later with a more in-depth tutorial on using the Ninja physics system. To save you having to read the entire article, […]

Phaser Weather

How to Add Weather Effects in Phaser Games

I keep going on about how important atmosphere is in a game, and the last two Phaser tutorials I have created have focused on that. First we learned how to create a parallax background effect which adds more depth to a game, and then we learned how to create a day and night cycle so […]

Day and Night in Phaser

How to Create a Day & Night Cycle in Phaser

As I’ve stressed before, atmosphere is an extremely important element in a game that can turn a fun game into a masterpiece. One great way to add some atmosphere to your game is to add a day and night cycle (imagine how much less fun Minecraft would be with no night). This tutorial, and the […]

Phaser Parallax

How to Create a Parallax Background in Phaser

Many mobile games are 2D, and when building Phaser games for mobile 3D games are not really an option. To keep our games from looking boring and flat there are some techniques we can use to give them more of a three dimensional feel, while still actually being in two dimensions. One of these techniques […]

ES6 Phaser

Level up Your Phaser Games with ES6

Since starting with Ionic 2 I’ve fallen in love with ECMAScript 6 (ES6), and once I started working with Phaser again it just didn’t feel as nice working with ES5. In this tutorial I am going to show you how you can use ES6 in your own Phaser games, but first let’s talk a little […]

Phaser Timer

How to Create an Accurate Timer for Phaser Games

In a few of my projects I’ve been using a pretty simple timer, the general idea was I’d start off with some variable to hold the total time of the game and then create a timer loop to decrement that value. I would visually represent that somewhere on the screen (usually a bar that gradually […]

Creating a Christmas Themed Game with Phaser: Part 2

In the last part of this tutorial, we started working our way through building a Christmas themed game in Phaser. If you haven’t read Part 1 yet, click the link below to catch up: Creating a Christmas Themed Game with Phaser: Part 1 To quickly refresh your memory though, this is what we are trying […]

Creating a Christmas Themed Game with Phaser: Part 1

It’s holiday season, and I thought I’d get into the spirit of things with a little Christmas themed content. I’ve been putting out a lot of Ionic 2 content lately so I’ve been meaning to put out some more Phaser content and figured this would be the perfect opportunity to make a Christmas themed gamed […]

Literra

Adding Custom Fonts to Your Phaser Game

I’m certainly guilty of using the default fonts in games just because it’s easier, and they certainly don’t always look out of place, but in general a custom font can add a lot to the look and feel of your game. Take a look at the before and after of this tutorial for example: Before […]

Alphadrop Screenshot

Creating Animated Scoring in an HTML5 Phaser Game

When it comes to games (and apps in general really), I’m a big believer that making your game just that little bit more juicy can make the overall quality and enjoyability of your game increase drastically. Juicy is clearly a pretty vague term, but I think it’s pretty fitting (think biting into a juicy orange […]

Phaser Word Matching Game

Part 1: Building a Word Search Game in HTML5 with Phaser

Puzzle games are all the rage on the mobile app stores, with the most notable being the absolute giant that is Candy Crush. Puzzle games are usually pretty casual games, but they have mass appeal right through from the most hardcore gamers to your friends mother who doesn’t know how to send emails. I recently […]

P2 Physics Game

Can you use P2 Physics with Phaser on Mobile?

Recently I finished writing a tutorial for CodeAndWeb which featured using the P2 Physics system in Phaser with their Physics Editor program. In the tutorial I built a simple game that involved some rope swinging and a whole bunch of enemies with complex hit areas. I’ll provide a link to that tutorial here when it […]

Atlas Animations

How to Create Animations in Phaser with a Texture Atlas

In a previous tutorial I’ve shown you how to create an animated sprite with a spritesheet in Phaser. In this tutorial I’m going to show you how to use something called a texture atlas instead. Here’s an animation I created recently for a game I’m building using a texture atlas: I’m going to jump right […]

Phaser Climber Game

How to Create an Infinite Climbing Game in Phaser

I remember playing quite a few simple platformer games when I was younger where you would basically have platforms running vertically down the screen, each with a space somewhere to get up to the next level, and you would have to try and climb up the platforms before you hit the bottom. As I’ve mentioned […]

Ninja Physics

Setting up Ninja Physics in Phaser

There’s a few different Physics systems provided by default in Phaser, each with their own uses cases, advantages and disadvantages. The three default physics systems are: Arcade Ninja P2 Arcade Physics is probably the one most people use in general, most examples and tutorials you will find for Phaser will use the Arcade Physics system. […]

DPR

How to Use Retina Graphics in HTML5 Phaser Games

If you don’t have one, you’ve probably heard of Apple’s “Retina” devices. Retina is just marketing spiel that refers to the device pixel ratio of the device. If we take a look at the iPhone 5 as an example, it has a resolution of: 640 x 1136 this is how many pixels we have to […]

Curvatron

9 Fun HTML5 Games Built with Phaser

Since I’ve been busy finishing Mobile Development for Web Developers I figured I’d do a bit of a fun post today – posts like this don’t take me as long to write as tutorials do and I get to play some cool games to unwind at the same time! I’m a fan of simple games, […]