Month: November 2022

Phaser Classes

This week we focused on learning about phaser classes and their methods, we were tasked with finding and using 5 different phaser classes.

I decided to use the Sprite, Keyboard, Math, Text & Button classes as they are classes I am using in my phaser game.

Phaser.Types.GameObjects.Sprite

This class allows for animated and static images to be put into your game which can be controlled by inputs and have collisions that can be set. They can also have their images affected by other classes such as colour.

Sprite.kill() is useful when having to remove an object from the game, this allows for the games with lots of entities to keep processing power down as the unused entities are removed from the required update list.

Physics.add.sprite() allows for collisions to occur with the sprite and allows for gravity to be applied to the sprite.

player = this.physics.add.sprite(1700, 300, ‘dude1’);

This allows for a player to be initialised on the screen with and animatable image that can be collided with other objects and sprites on the screen.

Alongside this I continued to add to my phaser game, making an animated background and adding more players to the game, making it a local multiplayer shoot out game.

This week we were introduced to Phaser, a JavaScript coding utility. This allowed us to simulate physics and arcade type games.

Bullet Bro’s

Bullet Bro’s is the game I decided to make, it’s a mix of Smash Bros and a Bullet Hell type of game.

This is my main focus as our deadline is on the 25th of November, I have used the demo to familiarise myself with how phaser works and am currently using the Phaser api to give myself a solid foundation to improve my code and design a working JavaScript game.

I changed the start to not just give points, but to make the player invincible and give the player a higher shooting rate, this was inspired from Super Mario, and I decided to show that by making the player change colours while the invincibility is in effect.

Collision Detection

This week we also worked on using physics on our sprites and collision detection.

Easing Graphs & Animation

This week we learnt how to use more complex JavaScript code to animate web browsers and use them alongside easing graphs. This meant we could use easing equations to display objects moving around in a more natural fashion, instead of teleporting from one end of the screen to the other side, they would move in a smoother fashion.

We also learnt the difference between Frame Animation & Time Based Animation

An example of this would be 2 objects moving in the same direction, one at 30 FPS, and the other at 60 FPS updating the movement every frame, the 60 FPS object will be moving 2x as fast as the 30 FPS object.

Time based animation however tries to calculate where the object should be every frame based on the time change since the last frame. This means that higher frame rate means more accurate object position calculation. However, lower frame rate can cause a lot of calculation issues and slow down the object.