Learn Phaser: Cameras and Effects
Lesson 1 of 1
  1. 1
    Cameras
    In order to grant the joy of exploration and discovery it becomes important for the game world to be larger than what a player immediately sees upon entering the game. A useful way to convince the …
    Start
  2. 2
    Platforms
    If we want to create a side-scrolling platformer, we better make some platforms for the player to jump on! We’ve created a static group for our platforms as before. But how do we decide where to pl…
    Start
  3. 3
    Levels
    Now that we have a system for specifying where platforms should be in each level, we can create multiple levels! Each level is going to inherit from our customized Level class and then inject infor…
    Start
  4. 4
    Shaking the Camera
    Camera shake is an indispensible effect in the modern video game. It hints to the player that something jarring and surprising is happening. When a player falls down we’re going to start the level …
    Start
  5. 5
    Fading Out
    Fading out of a Scene seems like a fitting transition. A cue taken from the film industry, fade-out offers a much softer effect than the shake but is as concise in Phaser. .fade() is a camera metho…
    Start
  6. 6
    Parallax Scrolling
    We’re going to create the illusion of depth in our frozen tundra world using something called a parallax effect. Parallax motion refers to an observable real-world phenomenon that things closer t…
    Start
  7. 7
    Determining The Scroll Factor
    In order to accomplish this effect, we’ll update the scroll factor of each of our background layers. The scroll factor is how fast an object scrolls (with respect to our camera). By default, all …
    Start
  8. 8
    Changing the Weather
    If a long journey goes on for several days, how do we communicate that length to the folks playing our game? We’re going to use a few strategies to add in concepts of ambience, lighting, time of da…
    Start
  9. 9
    Changing the Lighting
    Different light colors things differently, so it will be a stronger effect if we color our world for each time of day. In order to convey this effect we are going to use the .setTint() method on ea…
    Start
  10. 10
    Making It Snow
    Where does all of the snow in our game world come from? We assume it falls from the sky, but how? In order to enhance the realism of our game we want the snow to fall as the player crosses through …
    Start
  11. 11
    Review: Credits
    Throughout this lesson you learned many ways to polish the effects in Phaser games, we’ve added: - Cameras - Special Camera Effects (Fade Out and Shake) - Particle Emitters - Tinted Sprites -…
    Start

What you'll create

Portfolio projects that showcase your new skills

Pro Logo

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Pro Logo