Unit 6:   Asking the World

imageUnit 6Asking the World
Unit Overview

Students continue to combine their use of Ask and Data Structures, this time identifying ways in which the World structure might change without any user input.

Product Outcomes:
  • Students will use the random function to make game characters appear at different loations on the screen

Standards and Evidence Statements:

Standards with prefix BS are specific to Bootstrap; others are from the Common Core. Mouse over each standard to see its corresponding evidence statements. Our Standards Document shows which units cover each standard.

    Length: 70 minutes
    Glossary:
    • contract: a statement of the name, domain, and range of a function

    • data type: A way of classifying values, such as: Number, String, Image, or Boolean

    • piecewise function: a function that computes different expressions based on its input

    Materials:
    • Pens/pencils for the students, fresh whiteboard markers for teachers

    • Class poster (List of rules, design recipe, course calendar)

    • Editing environment (Pyret Editor)

    • Student workbooks

    • Language Table

    • The Ninja World file from the previous unit preloaded on students’ machines

    Preparation:
    • Seating arrangements: ideally clusters of desks/tables

    Types

    Functions

    Number

    + - * / num-sqr num-sqrt num-expt

    String

    string-append string-length

    Image

    rectangle circle triangle ellipse star text scale rotate put-image


    Review

    Overview

    Learning Objectives

      Evidence Statements

        Product Outcomes

          Materials

          • Pens/pencils for the students, fresh whiteboard markers for teachers

          • Class poster (List of rules, design recipe, course calendar)

          • Editing environment (Pyret Editor)

          • Student workbooks

          • Language Table

          Preparation

          • Seating arrangements: ideally clusters of desks/tables

          Review (Time 10 minutes)

          • In the last lesson you saw how piecewise functions work in Bootstrap:2, and learned about ask blocks, the Pyret syntax for writing them. To review, let’s go through the Design Recipe for a piecewise function.
            • Turn to Page 22 in your workbooks.

            • With your partner, fill out the Design Recipe for the function red-shape.

            Optional: If you finish early, turn the page to Page 23 and fill out the Design Recipe for the strong-password function.

            Remind students that each ask statement must have a test and a result, and each function must contain an otherwise: statement, which will execute if every other test returns false.

          Protecting the Boundaries

          Overview

          Learning Objectives

          • Add detail to their understanding of the next-world function

          • Identify possible sub-domains which require different behavior of the function

          Evidence Statements

            Product Outcomes

              Materials

              • The Ninja World file from the previous unit preloaded on students’ machines

              Preparation

                Protecting the Boundaries (Time 40 minutes)

                  • Open your Ninja World file from the last lesson.

                  • What is in the world structure?

                  • What does the next-world function do?

                  • What is dogX when the dog is in the center of the screen? According to the code, what will the next dogX be?

                  • What is dogX when the dog is on the right-hand edge? What will the next dogX be? And the next? And the next?

                  • What happens when the dog reaches the edge of the screen? What SHOULD happen?

                  Right now the dog disappears off the side of the screen and never comes back. It’s time to fix that.

                  Be sure to give students lots of positive reinforcement at this point - the game is really taking shape!

                • Just as in Bootstrap:1, we need to write a function that checks whether the danger, the dog, has gone off the right side of the screen. First, let’s review a few things:
                  • true and false are examples of what Data Type?

                  • What function takes two numbers and checks if the first number is greater than the second?

                  • What function checks if a number is less than another?

                  • What function checks if two numbers are equal?

                  Here is the contract for the greater than function:  

                  Copy this into your Contracts page and write down the contracts for < and =

                  Review Booleans and Boolean functions, including >, <, =, and, and or. Make sure students copy the contracts into their workbook.

                • To make testing and writing code much easier, programmers will often write seperate functions to test various game possibilities. In our Ninja World game, we’re going to write a function is-off-right to test whether the dog has gone off the right side of the screen.
                  • Turn to Page 24 in your workbook.

                  • What is the name of the first function on this page?

                  • is-off-right will return true if our dog goes off the right side of the screen. How large can the x-coordinate be before a character goes off the screen? (Remember that a character’s coordinates are measured from the center of the image, so it’s best to give a buffer so that the character dissappears completely before it is considered "off the screen".)

                  • Write the Contract for this function.

                    Now let’s pick a few examples of coordinates to write our test cases:
                  • What x-coordinate would put a character at the center of the screen?

                  • How do you check whether it’s off the right hand side?

                  • Any x-coordinate greater than 640 is off the right side of the screen, but we want to consider a slightly higher x-coordinate "off the screen," to account for the width of the character image. So how would you determine whether or not the example number is greater than 690?

                   

                  Write another example for a coordinate that is off the screen on the right side, circle what changes, and write your function definition.

                  Remind students about Sam the butterfly from Bootstrap:1. This function does the same thing as safe-right?, to determine whether the character has gone off the screen based on its x-coordinate. Ensure that students are using the full name of is-off-right.

                • You now have a function to check whether an object has run off the right side of the screen. But think about Ninja World: if the coin is moving to the left, do you care whether the coin goes off the right side?
                  • Complete the design recipe for is-off-left on Page 24. Instead of checking if a number is greater than 640, what will you need to check?

                  • When finished, copy your functions into your Ninja World file, underneath your keypress function.

                • Now we have a way to check whether something has gone off the right OR the left of the screen, but we still haven’t told the game what to do when it does. In Ninja World, after the dog goes off the right side of the screen, he should reappear on the left-hand side.

                  In this situation, what would the next dogX be after 690?

                  We want to change next-world so that it sets dogX to zero when dogX is greater than 690. Thankfully, next-world is already a piecewise function, so we just need to add some more conditions!

                  Remind students that each ask branch will contain a test and a result, which is evaluated if its test returns true.

                • Think about the first condition. What is the test that tells you if a number is greater than 690?

                  You could use the greater than function(>) and compare two numbers like you did to figure out if the cat was standing on the ground, but you’ve already written a function that takes in only one number and tells you whether or not it is greater than 690! is-off-right does the work for you. But how would you determine whether or not the dog is off the right? You’ll need to pull the dog’s x-coordinate out of the world...
                  • What accessor do we use for that?

                  • So what will the input to is-off-right be?

                  • Add this to your next-world function:

                   

                • The first clause tests whether the dog’s x-coordinate is off the right side of the screen. If the test returns true, what should the result be? We know that we need to return a World, since the Range of next-world is a World. That means we can immediately write world(...):   How should dogX change in this condition? We said we want to move the dog back to the left side of the screen.
                  • What will the new value of dogX be, if it, moves back to the left side of the screen?

                  • Does coinX change if the dog goes off the screen? How about catX? catY?

                   

                • Now it’s time to think about the coin...
                  • Instead of checking if coinX was off the right side of the screen, what do we need to check?

                  • What function have you already written that checks if a number is less than 0?

                  • How does next-world need to change? What will the second ask branch look like?

                  • Finish the code for next-world so that it also checks whether the coin has gone off the left-hand side of the screen.

                   

                  This can be an opportunity to discuss abstraction and the usefulness of reusing code with your students. The ask tests in next-world could be written as: current-world.dogX > 690, or current-world.coinX < 0, but this is more work than neccessary if the is-off-right and is-off-left functions have been written, and could be confusing for someone else looking at the code, who doesn’t know why dogX is being compared to 690. Additionally, from a programming point of view, it makes sense to use the specific screen boundaries in as few functions as possible: If a programmer wants his or her game to be playable on a larger screen (such as a tablet), they will have to go through their code and change every function that tests boundaries based on the old screen size, 640x480. If only the is-off-right and is-off-left functions use the screen size, the programmer can make a few quick changes to the numbers, instead of searching through ask branches such as in the second example.

                • Optional: Armed with the knowledge of abstraction, write a new function is-in-air to determine whether a given number is greater than 75. Then, re-write your third condition in next-world to use this function to determine if the cat is off the ground. This will make your code more readable, and you can easily edit the boundaries if the image of the cat changes to a smaller or larger image.

                Randomizing Ninja World

                Overview

                Learning Objectives

                  Evidence Statements

                    Product Outcomes

                    • Students will use the random function to make game characters appear at different loations on the screen

                    Materials

                      Preparation

                      Randomizing Ninja World (Time 15 minutes)

                      • Right now the coin and dog appear at the same part of the screen every time, making this a really easy game.

                        What will the y-coordinate of the dog always be? What about the coin?

                        Instead of appearing at the top of the screen every time, what if you could make the dog show up at a random y-coordinate whenever it goes off the screen? Pyret already has a function to give you a random number, which could represent a character’s y-coordinate: num-random. num-random takes in one number as its domain, and returns a random number between 0 and that number. So if a game contains num-random(480) in the code, it will return any number between 1 and 480.

                        Copy the contract for num-random onto your contracts page. num-random: Number -> Number

                      • If you want the y-coordinate of the dog to change, you’ll have to add it to the World structure.

                        Go back to the top of the page where the World is defined and add in a dogY. Don’t forget to redefine your worldA and worldB worlds, to account for the extra item in the World struct.

                          Right now the draw-world function draws the dog at its current x-coordinate, and a pre-set y-coordinate.
                        • At what y-coordinate is the dog drawn right now?

                        • Now that dogY has been added to the world structure, how do you get the dogY out of the world?

                        • Change the draw-world function so that it draws the dog at the current y-coordinate instead of 400.

                      • The dog’s y-coordinate should change when it leaves the screen.
                        • What function changes the game state depending on the game’s conditions?

                        • What does the first ask branch in next-world test?

                        • If this test returns true, what happens?

                        • Change the first ask branch in next-world so that if the dog goes off the right side of the screen, his y-coordinate is resent to a random number between 0 and 480.

                         

                      • Be sure to go through your code carefully- since you changed the World structure to include a dogY, you’ll need to make sure it’s included every time you call world, and every time a function takes in the y-coordinate of the dog. Once the dog is reappearing randomly when it leaves the screen, you can make the same changes to the coin’s y-coordinate to make it appear randomly as well.

                      Closing

                      Overview

                      Learning Objectives

                        Evidence Statements

                          Product Outcomes

                            Materials

                              Preparation

                              Closing (Time 5 minutes)

                              • Take a minute and admire your handiwork: You’ve put a lot of time and effort into this game during this course, and it’s coming together nicely with complex data structures and advanced movement. It’s already much more sophisticated than your Bootstrap:1 game! By creating a Ninja Cat game from scratch, you’ll have a lot of experience to build on when you start brainstorming your own game... in the very next unit! But something is still missing: in this Ninja Cat game, nothing happens when the cat collides with the dog, or coin. In the next unit we’ll change that: you’ll be able to handle collisions, similar to what you learned in Bootstrap:1.

                                Remind students how far they have come since Bootstrap:1 and the beginning of Bootstrap:2. They’ve expanded their knowledge of Pyret and programming, learned about a brand new data type and created their own version of Ninja Cat!