Lesson 21: Complex Sprite Movement

Overview

Question of the Day: How can previous blocks be combined in new patterns to make interesting movements?

Students learn to combine the velocity properties of sprites with the counter pattern to create more complex sprite movement. After reviewing the two concepts, they explore various scenarios in which velocity is used in the counter pattern, and observe the different types of movement that result. In particular, students learn how to simulate gravity. They then reflect on how they were able to get new behaviors by combining blocks and patterns that they already knew.

Purpose

This lesson does not introduce any new blocks and in fact only uses patterns students have seen in Chapter 1. Instead, it demonstrates how combining these tools, in particular the abstractions students learned in the previous two lessons, allows them to build new behaviors for their sprites. This highlights the broader point that abstractions not only simplify code, but also can themselves be used as building blocks of even more complex behavior.

Assessment Opportunities

  1. Use sprite velocity with the counter pattern to create different types of sprite movement

    See Level 7 in Code Studio.

  2. Explain how individual programming constructs can be combined to create more complex behavior

    In the wrap up discussions, check that students can explain how they are creating new types of movement without new blocks.

Agenda

Lesson Modifications

Warm Up (10 min)

Activity (30 min)

Wrap Up (10 min)

View on Code Studio

Objectives

Students will be able to:

  • Use sprite velocity with the counter pattern to create different types of sprite movement
  • Explain how individual programming constructs can be combined to create more complex behavior

Preparation

Links

Heads Up! Please make a copy of any documents you plan to share with students.

For the Teachers

Teaching Guide

Lesson Modifications

Attention, teachers! If you are teaching virtually or in a socially-distanced classroom, please see these modifications for Unit 3.

Warm Up (10 min)

Display: Show the two images of a frog jumping to the class.

Discussion Goal

It is unlikely that students will come up with the solution on their own, but encourage them to think of as many ideas as possible, and that they will keep working on the problem throughout the class.

Prompt: Here are two images of a frog jumping. The first is from the side scroller. Do you have any ideas for how to make the second type of jumping?

Think-Pair-Share Allow students to discuss their ideas with a classmate before sharing with the entire class.

Remarks

We've learned a lot of new blocks that have helped us create some fun animations. Today, we're going to look at how we can use the blocks that we already know in new ways to make more interesting types of movements. By the end of the class, you'll be able to code the new type of jumping with blocks that you already know.

Question of the Day: How can previous blocks be combined in new patterns to make interesting movements?

Activity (30 min)

Transition: Move students to Code Studio.

Wrap Up (10 min)

Share: Have students share with their classmates what additions they made to their final flyer game. Have students focus not just on how the game works, but on what the code to create that kind of functionality looks like.

Discussion Goal

Goal: This conversation should highlight that students did not learn any new blocks in today's lesson, they just learned new ways to combine blocks and patterns they had learned previously. The broader point here is that programming is not always about learning new blocks, but being creative about combining the tools you already know how to use.

Prompt: On your paper make two lists. First, make a list of new things you can program sprites to do after today's lesson. On the second list write down all the new blocks you learned today.

Discuss: Have students share their lists with classmates. Afterwards share lists as a class. They should hopefully have listed many new sprite movements but students haven't actually learned any new blocks in this lesson.

Assessment Opportunity

Check that students can explain the new programming structures and algorithms that they were able to use to get the new behaviors in the program.

Prompt: Today we built lots of new sprite movements like gravity and jumping, but none of this required us to learn new blocks. How were you able to do new things without learning any new blocks?

Discuss: Lead a quick follow-up to your initial discussion about this point.

Remarks

We're going to keep learning a few more tools in Game Lab, but as we do, remember what we saw today. To create new kinds of programs you don't always need to learn new blocks. Most of the time the creativity of programming comes from learning to combine things you already know in new and creative ways.

  • Lesson Overview
  • 1
  • (click tabs to see student view)
View on Code Studio

Teaching Tip

Velocity and the Counter Pattern - Map Level (PDF)

Student Instructions

  • Prediction
  • 2
  • (click tabs to see student view)
View on Code Studio

Teaching Tip

This level introduces the primary new programming pattern of this lesson, combing the counter pattern with sprites' velocity properties. Encourage students to take seriously their predictions before actually running the code.

Student Instructions

Velocity and the Counter Pattern

Using the counter pattern with a sprite's x and y property makes a sprite move smoothly across the screen. In this program the counter pattern is being used with the sprite.velocityX property instead.

Predict

What do you think will happen when the code is run? Why? Once you're ready you can run the code to find out.

  • Skill Building
  • 3
  • 4
  • 5
  • (click tabs to see student view)
View on Code Studio

Student Instructions

Velocity and the Counter Pattern

This program already makes a car move across the screen, but it's going very slowly. By using the sprite.velocityX property with the counter pattern, you can change the sprite's speed during the program.

Do This

  • Use the counter pattern with the sprite's velocityX property to make the car speed up. ( Show me where )
View on Code Studio

Student Instructions

Falling Rock

The rock should speed up as it falls down the screen.

Do This

  • Use the counter pattern with the sprite's y velocity to make the rock speed up as it falls. ( Show me where )
View on Code Studio

Student Instructions

Slowing Things Down

The car is going to run into the water! You'll need to use the counter pattern to slow it down.

Do This

  • Use the sprite.velocityX block with a counter pattern to slow the car down by 0.25 as it moves across the screen.
  • Discuss with your Partner: What do you think will happen when the car finally stops?
View on Code Studio

Student Instructions

Practice using the new ways to move sprites.


Choose from the following activities:
a
Rising Bubble

Make the bubble get faster as it moves higher.

b
Slow down and reverse

Help the mouse avoid the watchful cat.

View on Code Studio

Student Instructions

Rising Bubble

This program makes a bubble rise up the water. Can you make it get faster as it rises?

Do This

  • Use the counter pattern and the sprite's y velocity to make the bubble move up more quickly.
View on Code Studio

Student Instructions

Slow down and reverse

In this animation, a mouse runs past a cat. Let's change it so that the mouse slows down, stops before reaching the cat, then reverses direction like shown to the right.

Do This

  • Note the current x velocity of the mouse sprite.
  • Use the counter pattern to change the velocity so that it approaches 0 then changes direction.
  • Hint: Since the mouse starts with a negative velocity, you'll actually want to increase it to slow down.
  • Assessment
  • 7
  • (click tabs to see student view)
View on Code Studio

Assessment Opportunities

Key Concepts:

Model complex movement on a coordinate plane

Assessment Criteria:
Extensive Evidence

The rock sprite slows as it goes up the screen, then starts to fall back down, speeding up at is falls. The rock reaches a reasonable height, and there are no extra blocks of code.

Convincing Evidence

The rock sprite slows as it goes up the screen, then starts to fall back down, speeding up at is falls.

Limited Evidence

The rock starts to move up the screen, and its velocity continually changes in some way as the program is being run.

No Evidence

There is no change to the rock's velocity as the program is run.

Student Instructions

Looks like Gravity

The rock is thrown in the air but it never falls back down.

Do This

  • Use the code you've practiced to make the rock slow down and then fall.
  • Try different numbers in your counter pattern to see what you like the best.
View on Code Studio

Student Instructions

Try out these new blocks and challenges with collisions.


Choose from the following activities:
a
Curve

Make the plane curve to avoid the two spikes.

b
Deceleration

Make the car slow to a halt before it goes past the top of the screen.

c
Free Play

None

View on Code Studio

Student Instructions

Curve

The plane is going up to avoid the first spike, but it flies offscreen. In the draw loop, update its Y velocity so that it pulls down to avoid the second spike.

Do This

  • Update the Y velocity in the draw loop so that it moves the plane down.
  • Hint: The velocity starts as negative, going up. To go down, what direction should the velocity be?
  • You may change the initial X and Y velocity of the plane, but you don't have to.
View on Code Studio

Student Instructions

Deceleration

Make the car slow to a halt before it goes past the top of the screen.

Do This

  • In the draw loop, update the car's Y velocity so that it slows down.
  • Use a conditional to prevent the car from moving backwards after it stops.
View on Code Studio

Student Instructions

Free Play

Use what you've learned to create whatever you like. When you're finished, you can click to send your creation to a friend, or to send it to your Projects Gallery.

Standards Alignment

View full course alignment

CSTA K-12 Computer Science Standards (2017)

AP - Algorithms & Programming
  • 2-AP-11 - Create clearly named variables that represent different data types and perform operations on their values.
  • 2-AP-12 - Design and iteratively develop programs that combine control structures, including nested loops and compound conditionals.
  • 2-AP-13 - Decompose problems and subproblems into parts to facilitate the design, implementation, and review of programs.
  • 2-AP-16 - Incorporate existing code, media, and libraries into original programs, and give attribution.
  • 2-AP-17 - Systematically test and refine programs using a range of test cases.
  • 2-AP-19 - Document programs in order to make them easier to follow, test, and debug.