Supplemental Lessons
Overview
Students learn how to add a scoring system and levels to their game
Learning Objectives
Evidence Statements
Product Outcomes
Materials
Computers with students’ complete Ninja Cat games preloaded
Preparation
Your version of Ninja Cat is just as complex as the original game, but there’s not a lot of variety. The player avoids the dog and gets the coin over and over again. We should mix things up a bit: how about adding new levels? Typically a game would progress to a new level if the player has reached a certain goal: Collected a certain number of coins, destroyed a certain number of zombies, or reached a certain score. Let’s start by adding a scoring system to the Ninja World game.
Both the scoring system and randomizing the y-coordinates of the target and danger were part of the included teachpack in Bootstrap:1, code which ran "under the hood" in students’ first Bootstrap game. Let them know that in Bootstrap:2, they no longer need this hidden code, because they’ve learned enough to program the entire game (and more!) themselves.
- The score is something that will be changing in the game, so you can be sure that it has to be added to the World structure.
What data type is the score? Number, String, Image, or Boolean?
What will be the score in the worldA (the starting world)?
Change the World structure of your Ninja Cat game so it includes a score.
Remember: Since the World structure is changing, you now have to go through your game code- every time you make a world, the score must be included in that world.How do you get the score out of the world?
- Now that the game has a score, it needs to be able to increase or decrease. For Ninja Cat, we’ll say that the score should go up by 30 points when Ninja Cat collides with the coin, and down by 20 points when colliding with the dog.
Which of the ask branches in next-world checks these conditions?
How would you decrease the score by 20 if the player collides with the dog?
On the next ask branch, make the score increase by 30 points when the cat collides with the coin.
- The scoring system is in place, but how will the player know what their score is? You’ll need to display the score on the game screen.
Which function handles how the world is drawn?
In draw-world, images are placed onto the background using put-image to draw the game. But the score is represented by a Number: we need a way to represent it as an Image. Thankfully, Pyret has some built-in functions that can help with this: the function num-to-string takes in a Number for its domain and returns a String representation of that number. This string can then be passed to the text function to return an Image that can then be used in draw-world.Copy the following contracts into your workbook:
num-to-string : Number -> String
text : String, Number, String -> Image
How would you use the num-to-string and text functions together to draw the score into the world?
How do you get the score out of the world?
How large should the text of the score be? Where should it be placed on your game scene?
The expression: will place the score (drawn in size 30 purple text) onto the center of the BACKGROUND-IMG. - Ninja World has a visible scoring system: Now it’s time to add some levels. For this example, you’ll make the game have a different background image when the player progresses to the next level. We’ll say that the player will reach level two when his or her score is greater than 250.
Where do you define the BACKGROUND-IMG image? Keep the original background for the first level, but define a new variable, BACKGROUND2-IMG, that will be used for level 2. For the best results, use an image that is the same size as your original background.
Now that you have another background image, it needs to be drawn into the game- but only when a certain condition is met.What must be true for the player to progress to level 2 in the game?
Which function handles the way the game looks?
What is the only thing different in level 2 of Ninja Cat?
- The only thing that changes at level 2 is the way the game looks: specifically, the background image. Because the background only changes when a certain condition is met, you’ll need to change the draw-world function so that it uses ask. Leave the current code alone for now and start right under fun draw-world(current-world):.
What is the first thing to write, to let the computer know that this will be a function with different conditions?
What is the first condition to check? (Hint: is the score large enough to progress to level 2?)
If this test evaluates to true, the result will look very similar to the code you already have for draw-world, starting with put-image.What is the one thing that needs to change?
Instead of putting all your images on top of BACKGROUND-IMG, you’ll put them over BACKGROUND2-IMG, your new background image: Don’t forget to add an otherwise clause before your original code, right underneath what you just wrote. If the score is not greater than 250, the world will be drawn with the images on the original background.
Now your Ninja Cat game has a level 2! You can use the same process to add more levels when the score gets even higher. Maybe instead of the background changing, you want the player to transform, or make the game more difficult by making the dog move faster.
Some more options for students who finish early:
Change the next-world function so that the dog and coin move faster if the score is greater than 500.
Use the text function to display a game over message on the screen when the score drops below 0.
Change the images of all the game characters when the player progresses to the next level.
Challenge: Instead of writing similar code in draw-world over and over for each level, use abstraction: write a function that takes in the background image, and returns the game images placed on top of the given background. This function can then be called within draw-world with the appropriate background image when the player reaches each level.
