> For the complete documentation index, see [llms.txt](https://docs.launchboard.app/cxd/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.launchboard.app/cxd/video-game/project-outline/1-6-phaser-practice-2-top-down-game.md). # 1-6 Phaser Practice 2: Top-Down Game In this second practice, you're going to create a top-down game that shows an overhead view of the player. It will be a space shooter game, similar to [Asteroids](http://2600online.com/asteroids.php). This game will feature a nice balance of player skill, random chance, and increasing challenge. It will reinforce the basic concepts of using Phaser to create a game, plus show you some advanced features in Phaser. Our game will be an update to the classic Asteroids that we'll call **Asteroids 2084**. Here's its premise: > The year is 2084. The Mars colony is running out of water and needs to reach the icy moons orbiting Jupiter. You're a spaceship pilot sent on a scouting mission to clear a path to Jupiter through the asteroid belt. Asteroids threaten to collide with your ship from all directions. Your only option is to evade and destroy the asteroids before they destroy you. In this practice, all the game assets (i.e., images and sounds) and **some** of the game code will be provided. Focus on two things: (1) becoming familiar with the new Phaser commands that will be introduced, and (2) applying the Phaser commands you've already seen. ![](https://728828027-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDgX-RykK9XCDxfIhX_%2F-LDgX7Ifr9nc11ubI925%2F-LDgXB8iGNPZnZO2dse2%2Fasteroids-2084.png?generation=1527608044668728\&alt=media) ![](https://728828027-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDgX-RykK9XCDxfIhX_%2F-LDgX7Ifr9nc11ubI925%2F-LDgXB8kR4_c7qfHccyT%2Fasteroids.jpg?generation=1527608043499739\&alt=media) **PREVIEW VIDEO:** [Demo of Asteroids 2084](https://drive.google.com/open?id=0B8MTiM_lFG9TVmwzX25HcFhkNW8) ## PREP STEPS 1. Prepare a new [Phaser Game Template](/cxd/video-game/project-references/phaser-game-template.md). Be sure to place a copy of **phaser.min.js** into the same folder that has your HTML, CSS, and JS files. 2. Download this [assets.zip](https://drive.google.com/open?id=0B8MTiM_lFG9Tb0stWDkwQ21jQlk) file, and extract the file contents, which will be a folder named **assets** that has two subfolders containing 12 images and 7 sounds. (To extract the file on a Windows computer, right-click on the downloaded zip file, and select *Extract All*. On a Mac, double-click on the downloaded zip file.) 3. Place the **assets** folder into your game template folder. 4. Test your Phaser game template by previewing the HTML file online. If everything's ready to go, you should see a **solid black box** (your blank game canvas) on your webpage. ## CODING STEPS This second practice game will be coded in 15 steps, with the last step being an extra credit challenge. Some steps will involve coding that's similar to things you did previously. However, most of the steps will also introduce and explain new Phaser features. As a reminder, all your game coding is done in your JS file (**code.js**). The steps are outlined below. The instructions for Steps 1-5 start on the next page. ### Step 1: Add Player Sprite ### Step 2: Add Player Input ### Step 3: Add Physics and Player Movement ### Step 4: Add Tilesprite Background ### Step 5: Add Asteroids Group ### Step 6: Add Player Collision with Asteroids ### Step 7: Add Player Weapon ### Step 8: Add Particle Effect to Asteroids ### Step 9: Add Asteroid Spawning ### Step 10: Add Score ### Step 11: Add Player Shields (Health Bar) ### Step 12: Add Player Lives ### Step 13: Add Extra Life Reward ### Step 14: Add Game Start and Game Over ### Step 15: Add Enemy Ship (Extra Credit) --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation by asking a question. Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters: ``` GET https://docs.launchboard.app/cxd/video-game/project-outline/1-6-phaser-practice-2-top-down-game.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.