instagram

(Also available in WeScheme)

Students discover that inequalities have an important application in video games: keeping game characters on the screen! Students apply their understanding to edit code so that it will keep Sam the Butterfly safely in view.

Lesson Goals

Students will be able to:

  • apply their understanding of inequalities to keep a game character on the screen

Student-Facing Lesson Goals

  • Let’s use what we know about inequalities to define the boundaries that will keep a game character on the screen.

Materials

Supplemental Materials

Key Points for the Facilitator

  • To connect students with prior knowledge of inequalities, Circles of Evaluation, and code, have them complete Warmup: Coding Compound Inequalities in advance of the lesson or at the end of the first section.

  • Unlike our lessons on Simple Inequalities and Compound Inequalities: Solutions & Non-Solutions, this lesson does not explicitly discuss solution sets of inequalities or how to represent them on number-lines.

  • The focus of this lesson is on applying inequalities and Booleans to solve a programming challenge. Using inequalities to set boundaries for a character will change some students' relationship with inequalities from abstract symbols to useful tools.

🔗Introducing Sam 15 minutes

Overview

Students are introduced to Sam the Butterfly, a simple activity in which they must write simple inequalities to detect when Sam has gone too far in one dimension.

Launch

As you explore the program, notice that Sam’s coordinates are displayed at the top of the screen! When Sam is at (0,0), we only see a part of Sam’s wing because their position is based on the center of the butterfly image.

Students should observe that Sam can go up to, but not beyond, an x of -50. Students can represent this algebraically as x > - 50, or (for students who notice that Sam only moves in increments of 10) x ≥ - 40.

Eagle-eyed students might also notice that the butterfly image is defined at the top of the file, as IMG! Changing this definition will allow them to customize the way Sam looks.

Every time Sam moves, we want to check and see if Sam is safe.

  • What three functions do you see defined in this file?

  • What should our left-checking function do?

    • Check to see if x is greater than -50.

  • What should our right-checking function do?

    • Check to see if x is less than 690.

  • What should is-onscreen​(​​) do?

    • Answers may vary. Let students drive the discussion, and don’t give away the answer!

Investigate

  • Complete Left and Right with your partner.

  • Once finished, fix the corresponding functions in your Sam the Butterfly file, and test them out.

Students will notice that fixing is-safe-left keeps Sam from disappearing off the left side, but fixing is-safe-right doesn’t seem to keep Sam from disappearing off the right side! When students encounter this, encourage them to look through the code to try and figure out why.

"False" doesn’t mean "Wrong"!

A lot of students - especially confident ones - may struggle to come up with an example where is-safe-left returns false:

# Students hate writing the second one! examples: is-safe-left​(​189​) is 189 > -50 is-safe-left​(​-65​) is -65 > -50 end

This misconception comes from confusing a statement that is "false" with a program that is "wrong". In the second example, above, the result of is-safe-left​(​-65​) is false, because "65 is greater than -50" is a false statement. Remind your students that you want one example that’s true, and a second that’s false!

Pyret includes some functionality that makes this more explicit, and can help resolve the misconception:

examples:
  is-safe-left( 89) is true  because  89 > -50
  is-safe-left(-65) is false because -65 > -50
end

By writing the answer first ( is-safe-left(-65) is false ), it reduces anxiety about code being "wrong". Students can think of the because as an explanation of why the answer is false.

The only way to know if is-safe-right works is to test it by itself. Did you write examples for that function…​?

If a car starts up when you turn the key, does that mean we know the sunroof works? Of course not! You can’t trust the behavior of a complex system, just because one part of it works! The only way to see if the sunroof works is to test it.

Synthesize

  • Does is-safe-left work correctly? How do you know?

  • Does is-safe-right work correctly? How do you know?

🔗Protecting Sam on Both Sides 30 minutes

Overview

Students solve a word problem involving compound inequalities, using and to compose the simpler Boundary-checking functions from the previous lesson.

Launch

  • We need three volunteers to roleplay the functions is-safe-left, is-safe-right, and is-onscreen!

  • Take 1 minute to read the Contract and code for your function, as written in the program.

Ask the volunteers what their name, Domain and Range are. Explain that you, the facilitator, will be providing a coordinate input. The functions is-safe-left and is-safe-right will respond with either "true" or "false".

The function is-onscreen, will call the is-safe-left function, giving them a number representing Sam’s x-coordinate. The student roleplaying is-onscreen should turn to is-safe-left and give the input to them.

For example:

  • Facilitator: "is-onscreen 70"

  • is-onscreen (turns to is-safe-left): "is-safe-left 70"

  • is-safe-left: "true"

  • is-onscreen (turns back to facilitator): "true"

  • What is the problem with is-onscreen?

    • It’s only talking to is-safe-left, it’s not checking with is-safe-right

  • What should is-onscreen be doing?

    • It needs to talk to is-safe-left AND is-safe-right

Investigate

  • Complete Word Problem: is-onscreen.

  • When this function is entered into the editor, students should now see that Sam is protected on both sides of the screen.

Extension Option

What if we wanted to keep Sam safe on the top and bottom edges of the screen as well?

  • What additional functions would we need?

  • What functions would need to change?

Note: In the context of Sam the Butterfly, there’s a clear reason why we want to stop Sam from going off the top and bottom of the screen! But when we add the is-onscreen function to our Game Starter File, we might want to let the player go above and below the screen. It will be important that the is-onscreen function we use in the game only checks the x-coordinate.

We recommend that students tackling this challenge define a new function is-onscreen2 so that their initial is-onscreen code remains ready for them to use in the next section of this lesson.

Let’s have our three student volunteers roleplay those functions again, with the is-onscreen function working properly. Be sure to test out values where Sam is off one edge, off the other, and on the screen!

Repeat the back-and-forth that happened earlier, making sure that the onscreen function calls both the left-checking and right-checking functions and that those functions work correctly!

Synthesize

  • How did it feel when you clicked Run, and saw Sam hit both walls for the first time?

  • Are there multiple solutions for is-onscreen?

  • Is this Top-Down or Bottom-Up design?

🔗Boundary Detection in the Game 10 minutes

Overview

Students identify common patterns between two-dimensional Boundary detection and detecting whether a player is onscreen. They apply the same problem-solving and narrow mathematical concept from the previous lesson to a more general problem.

Launch

Open your in-progress game file and click "Run".

  • How are the TARGET and DANGER behaving right now?

    • They move across the screen.

  • What happens when they go off the edge of the screen?

    • They just keep going!

  • What do we want to change?

    • We want them to come back after they leave one side of the screen.

  • Is this similar to a problem we’ve already solved somewhere else?

    • This is the same problem we solved with Sam!

Investigate

Apply what you learned from Sam the Butterfly to fix the is-safe-left, is-safe-right, and is-onscreen functions in your own code.

Since the screen dimensions for their game are 640x480 - just like Sam - we can use our code from Sam with virtually no changes!

Students who tackled the optional is-safe-top and is-safe-bottom challenges should be sure NOT to add this to their game code! There are some exciting challenges in later lessons that rely on characters being able to go off the top or bottom edge of the screen!

Common Misconceptions

  • Students will need to test their code with their images to see if the boundaries are correct for them. Students with large images may need to use slightly wider boundaries, or vice versa for small images. In some cases, students may have to go back and rescale their images if they are too large or too small for the game.

  • Students may be surprised that the same code that "traps Sam" also "resets the DANGER and TARGET ". It’s critical to explain that these functions do neither of those things! All they do is test if a coordinate is within a certain range on the x-axis. There is other code (hidden in the teachpack) that determines what to do if the coordinate is offscreen. The ability to re-use function is one of the most powerful features of mathematics - and programming!

Synthesize

The same code that "trapped" Sam also "resets" the DANGER and the TARGET. What is actually going on?

🔗Additional Exercises

These materials were developed partly through support of the National Science Foundation, (awards 1042210, 1535276, 1648684, 1738598, 2031479, and 1501927). CCbadge Bootstrap by the Bootstrap Community is licensed under a Creative Commons 4.0 Unported License. This license does not grant permission to run training or professional development. Offering training or professional development with materials substantially derived from Bootstrap must be approved in writing by a Bootstrap Director. Permissions beyond the scope of this license, such as to run training, may be available by contacting contact@BootstrapWorld.org.