Animating Sprite Demolition with Typescript How to Blow Stuff Up By Nick Branstein.
-
Upload
rolf-lawrence -
Category
Documents
-
view
216 -
download
1
Transcript of Animating Sprite Demolition with Typescript How to Blow Stuff Up By Nick Branstein.
Animating Sprite Demolition with Typescript
How to Blow Stuff Up
By Nick Branstein
• Consultant and Developer at KiZAN Technologies
• Blog about technology at https://brosteins.com
• Video game lover and enthusiast• Love reading about and playing games
• Working on a HTML5 game
• Cleveland sports fan• Go Cavs!
About Me
• Tools• Typescript• http://www.typescriptlang.org• C# for the Javascript lover• Version 1.4 (latest release)
• Phaser• http://phaser.io• Javascript game engine• Version 2.2.2 (2.3 is out now)
• Goals• You will feel empowered to start a game of your own
Tools & Goals
• Phaser.State• Preloader• Load assets for our game• Start the next state of our game
• Main• This is our actual game• Add the background of our game to the world
• Phaser.Game• CodePaLOUsaGame• Construct our game object and add the states of our game to it
Create Game
• Preloader• Load in an audio asset
• Main• Create our audio object and play it over and over
Theme Song
• Preloader• Load a spritemap
•
• Enemy class• Phaser.Sprite
• Create a new animation and add this to our enemy
• Main• Create a new enemy object at a random location
Enemies
• Update Enemy class• Enabling inputs – mouse and/or touch input whatever the device
supports
• Movement• Every 2 seconds make the enemy move using a “tween“• A tween is a movement from one position to another, the framework
handles animating it properly
• Add a callback to our enemy constructor
• Main• Create a function to callback to since our enemy object requires
this in the constructor
Enemies Continued
• Preloader• Load in our other sounds that we will be using
• SoundManager Class• Easily play a sound once or forever
• Uses a simple Dictionary object to store the Phaser sound objects
• Main• Refactor playing the themesong to use SoundManager
• Play a sound when the enemy is clicked
More Sounds!
• Preloader• Load in more images to use for our explosions
• Main• Phaser.Physics.ARCADE• We need to startup the physics engine so we can create particle effects
• Phaser.Particles.Arcade.Emitter• This object is used to create the particle effects• As the name suggests, this object can emit or create sprites at a rapid rate• Start our emitter when the enemy dies
Explosions!!!
• Typescript• Hopefully you have become a typescript fan like myself
• Phaser• Hopefully you have seen how a game engine can assist you with
development of your game
• Anyone going to start creating a game?
In Conclusion
• Code: http://tinyurl.com/cpl15game
• Slides: http://tinyurl.com/cpl15gameslides
• @NickBranstein
• https://brosteins.com
Questions?