Students: do this first!
  1. Open a web browser and go to www.cca.ac
  2. Login with your codeCampus username and password
  3. Choose 6.1.1 - Ratio Animations for the lesson and starter project
Overview

This project will let us animate ratio word problems. We will arrange our code in the correct sequence to make the animation flow exactly how it needs to.

Planning

  1. How many sprites are in this project?
  2. How many backdrops?
  3. What is the functionality, i.e., what happens?

Step 1: Initialize (start) the project

  1. Time to start coding our animation!
  2. Click on the Scripts tab.
  3. Click on the Events tab.
  4. Drag out a “When Green Flag Clicked” block.

Recap: when green flag clicked

  1. This block waits for the green flag above the stage to be clicked. When it is, then it will allow all the code we attach beneath it to run.

Step 2: Set the starting backdrop

  1. Since there are two backdrops in our project, we need to make sure we start on the correct one.
  2. Click on the Looks tab.
  3. Bring out a “switch backdrop to underwater” block.
  4. Attach it to the "when green flag clicked" block.

Step 3: Set the starting costume

  1. Since there are two costumes in our sprite, we need to make sure we start on the correct one.
  2. Click on the Looks tab.
  3. Bring out a “switch costume to puppy sit" block.
  4. Attach it to bottom of the code.
  5. Click the dropdown arrow, then select "fish3" from the menu.

Test your work

Click on the green flag. What happens? Why?

Step 4: Set the starting position

  1. We want the fish to glide across the screen, starting from the left.
  2. Click on the Motion tab.
  3. Bring out a “go to x:0 y:0" block.
  4. Attach it to bottom of the code.
  5. Change the x value to -200.

Step 5: Glide from the left to the center

  1. Click on the Motion tab.
  2. Bring out a “glide 1 sec to x:0 y:0" block.
  3. Attach it to bottom of the code.
  4. Make sure the values are x:0 y:0.

Step 6: Set up the first word problem

  1. Click on the Sensing tab.
  2. Bring out a “ask, 'What's your name?' and wait" block.
  3. Attach it to bottom of the code.
  4. This block will ask our user a question, and gives them a text box to type an answer into.

Step 7: Setup the first word problem

  1. Delete the text in the "ask" block.
  2. Change the text to "In a tide pool, there are 26 spotted fish and 12 plain fish. What is the ratio of spotted fish to plain fish?".

Test your work

  1. Make sure your code is correct.
  2. Click on the green flag.
  3. What happens?
  4. Why?

Step 8: Display the answer

  1. Now, let's display the answer.
  2. Click on the Looks tab.
  3. Bring out a "say 'Hello!' for 2 secs" block.
  4. Attach it to the bottom of your code.
  5. Change the text to "If you said 13:6, you're correct.".

Test your work

  1. Make sure your code is correct.
  2. Click on the green flag.
  3. What happens?
  4. Why?

Step 9: Glide out

  1. Now that the user has answered the question and seen the correct answer, let's have the fish glide off.
  2. Click on the Motion tab.
  3. Bring out a "glide 1 sec to x:0 y:0" block.
  4. Attach it to the bottom of your code.
  5. Change the x value to 200.

Step 10: Set the stage for the 2nd word problem

  1. Now, it's time to setup our second word problem.
  2. From the Looks tab, bring out the "switch costume to 'dog puppy sit'.
  3. From the Looks tab, bring out the "switch backdrop to 'flower bed'.

Test your work

  1. Make sure your code is correct.
  2. Click on the green flag.
  3. What happens?
  4. Why?

Step 12: Set the starting position

  1. We'll have our puppies glide in from the bottom of the screen this time.
  2. Click on the Motion tab and bring out a "go to x: y:" block.
  3. Change the x value to 0, and the y value to -200.
  4. Now bring out a "glide 1 sec" block.
  5. Change the y value to -50.

Step 13: Setup the second word problem

  1. Click on the Sensing tab.
  2. Bring out a “ask, 'What's your name?' and wait" block.
  3. Attach it to bottom of the code.

Step 14: Setup the second word problem

  1. Delete the text in the "ask" block.
  2. Change the text to "What is the ratio of ears to noses?".

Step 15: Display the answer

  1. Click on the Looks tab.
  2. Bring out a "say 'Hello!' for 2 secs" block.
  3. Attach it to the bottom of your code.
  4. Change the text to "If you said 2:1, you're correct."

Test your work / Discussion

  1. Make sure your code is correct.
  2. Click on the green flag.
  3. What happens?
  4. Why?
  5. Is the order that this code is in important?
  6. What would happen if we switched the order of any of the blocks?

Challenge

  1. If time allows, try adding another word problem to your animation.
  2. Study the code you've already written carefully.
  3. Feel free to copy code that you've already written.
  4. Experiment to create different animations.

Good job! Time to submit your work.

  1. Click "remix", then click "share"
  2. Copy the Scratch project link
  3. Go back to your student dashboard
  4. Make sure you have selected the correct lesson name
  5. Paste the Scratch project link in the last box
  6. Click "Submit to teacher"