• OPENING SCENE
• Introduction
• Jumping Right In
• Jumping Right In
• Choose your own Adventure
• Getting Started
• Building a World
• Adding Movement
• Create a Game Space
• Making Things Happen
• Adding a Reward
• Hazards and Enemies
• Adding Game States
• GAME MECHANICS
• Game Mechanic: Add a Countdown Timer
• Game Mechanic: Jumping on Enemies
• Game Mechanic: Player Health
• Game Mechanic: Longer Jumps if Holding Jump Down
• Game Mechanic: Smaller Sprite Collision Boxes
• Game Mechanic: Extending the Game Size
• Game Mechanic: Adding Levels
• Game Mechanic: Keys and Doors
• ADDING POLISH
• Polish: Animate Sprite when Zapped
• Polish: Scaling our Game and Sprites
• Polish: Screen Shake
• Polish: Add Soundtrack Music
• Polish: Explosions using Particles
• Appendix
• Summary of our approach to learning Game Making
• How we approach Coding
• Playful and Reflective Approaches

Polish: Screen Shake when Zapped

Rather than just disappearing we can add an animation to the whole screen to give our game player feedback that something bad has happend. We can do this by shaking the screen.

Check the Code: what we need to know and do

Better death here needs us to alter the function called when player and enemy overlaps. Let's concentrate on animating the enemy, we need to change the sprite animation but also add a delay into the process of restarting the game so we can see the animation play out. So we'll need the following background knowledge;

• Collision detection using overlap() function- see Adding a Reward

Going over the code:

Have a look at an updated hitHazard function;

playState.hitHazard = function (player, hazard) {
      hazard.kill();
      game.camera.shake(0.05, 500);
};

We just need to add a line about shaking the cameral position of the whole game into the hitHazard function.

Bonus: If you don't like the way everything shakes here then the shake effect can be done only on limited sprites or groups for a demo of that see here. https://glitch.com/edit/#!/add-polish-shake-sprites-only?path=game.js