Marty'S Groovy Graphing

Use Marty's distance sensor to create displacement-time graphs of a moving object

Introduction

Using Scratch 3 and a distance sensor, you will write code to move a sprite on-screen in real time to sketch a displacement-time graph of the motion of an object (or person!) moving towards and away from Marty.

Using information from Marty's distance sensor, an on-screen sprite will move in real-time to sketch a displacement-time graph of the motion of an object moving towards and away from the distance sensor.

what you will need

What will you learn about?

  • How to use the distance sensor to control an on-screen sprite
  • How to use lists, variables, operator and control blocks
  • How to add pen blocks

extra information for educators

This cross-circular activity can be linked to the Responding to Our Environment and Programming Concepts 2 lesson packs.

As this activity uses concepts from Physics often investigated when studying forces and motion, the activity also partially addresses benchmarks in the following curriculum areas:

  • Curriculum for Excellence (Sciences)
  • National Curriculum (Science)
  • F-10 Curriculum (Science)

Using the distance sensor

You can find a helpful guide to the distance sensor in the distance sensor introduction activity. This also gives you instructions for connecting the distance sensor to Marty.

When the distance sensor is connected, you are ready to start. Remember not to cover the distance sensor! The distance sensor sends out infrared light which hits the object in front of the sensor. Some infrared light bounces off the object back to the receiver in the sensor. This light is used to estimate far away the object is from the sensor.

 In your project, the distance sensor will appear as proximity sensor in the Scratch 3 interface. If you click on the tick box next to proximity sensor (as shown below) then the sensor measurements will appear on your screen. If you want to hide the sensor readings, then click on the box again

The proximity sensor readings will change as an object is moved towards and away from Marty.

Hint: Try moving an object (or even just your hand) in front of the sensor - look at the sensor readings on screen. What happens to the readings when the object is close to the sensor? What about when the object is far away?

What is a DISplacement-time graph?

A displacement-time graph shows how the displacement of an object changes with time. It is an idea often used in Physics or Engineering when we want to study the motion of an object. The displacement of an object is how far it has moved and in what direction.

Our graph will be a sketch graph because we are not going to plot actual displacement measurements on the y-axis. This is because the proximity sensor gets its information from light signals as explained above. Our graph will show how the motion of the object changes with time though.

The proximity sensor can only get information about an object directly in front of it so the direction of motion of the object needs to be towards and/or away along a straight line in front of Marty.

Here is an example displacement-time graph made earlier:

Displacement is shown on the y-axis and time is along the x-axis.  

If the line on the graph is horizontal, then the object is at rest or stationary. This means that it is not moving either towards or away from Marty so its displacement is not changing with time. The gradient (slope) here is zero.

If the slope of the graph is downwards, then the displacement of the object from Marty is decreasing and it is getting closer.

If the slope of the graph is upwards, then the displacement of the object from Marty is increasing and it is getting further away.

When an object moves faster, the gradient of the graph gets steeper. We can use the gradient of the graph to tell us about the object's velocity. This is because velocity is the change in displacement in a certain time interval. Velocity tells us how fast an object is moving and in what direction.

Challenge ONE:

You can find out a lot about an object's motion from looking at a graph. Can you play detective and use the information about displacement-time graphs to describe, in detail, the journey of the object that produced the graph shown in the example?

Here are some things to think about for each part of the graph:

  • Is the object moving or at rest? Look out for horizontal sections on the graph! 
  • Is the displacement of the object increasing or decreasing? Is the slope upwards on downwards on the graph?
  • How quickly is object moving? How steep is the slope of the graph? 

I need some help!

This graph shows that the object's motion is:

  • a at rest
  • b moving very quickly towards Marty
  • c at rest for a short time
  • d moving slowly away from Marty but not all the way back to the starting point
  • e at rest for a short time again
  • f moving even more slowly even closer to Marty
  • g at rest for a short time again
  • h moving away from Marty and slowly down a little bit
  • i moving very quickly away from Marty until just beyond the starting point
  • j at rest until the end

Phew! I bet you didn't realise quite how much information a simple sketch graph can show us! This is why they are so useful.

CODING TIME...Making Lists!

The first stage of this process will be making lists to record information about the motion of the object.

Create a new Scratch 3 project with the Marty the Robot extension added.

Time to get programming! Start with a when green flag clicked event block and then tell Marty to get ready

A list (sometimes called an array in other programming languages) can be used to store lots of pieces of information at once. We use lists everyday in real life too... to-do lists, shopping lists, homework lists (sorry!)... information is stored so that it can be looked up and used when we need it.

list consists of numbers paired with items. The number is just the position in the list. The item is the information stored at that position. If my shopping list was "baked-beans, apples, bread and chocolate", I could write it in list form as:

  1. baked-beans
  2. apples
  3. bread
  4. chocolate

My shopping list has four pairs of numbers and items so the total length of my shopping list is "4".

To make a new list, select the Variables option in the code blocks drawer followed by the Make a List button. You will be asked what you want to call your list.

We are going to make a displacement-time graph. We want a list to store the displacement information so you need to make a list called proximity.

We also want to store the time at which each proximity sensor reading is taken so you need to make a second list and call it time.

Making these two lists is like making a results table in a Science lesson ready to write in your experimental results.

When you have you code running, your lists will fill up with proximity sensor and time data like this screenshot shows:

We can look up information stored in lists. For example, in the time list above the 4th pair is the number "4" paired with the item "0.75". In the proximity list above, the 4th pair is the number "4" paired with the item "288". From comparing our two lists and matching up the information stored each list position number 4, we know that when the time was "0.75", the proximity sensor reading was then "288".

The length of the list tells us how many number-item pairs are stored in it. The lists in the example above have a length of "80" so there are 80 paired pieces of information stored in each.

If we want to show or hide any list from the screen, we can use the show list or hide list blocks from the Variables code blocks.

Ready...MAKING FUNCTIONS!

Getting ready is an important part of this activity. We need to set up all of the readings that we need to take for our displacement-time graph and we need to get the graph axes ready.

To make things easier, let's make a function for each of these getting ready parts of this activity. This makes it simple to make overall changes to the way we want to record our readings or the way our graph looks on screen.

Making a function is similar to making a new list. Select My Blocks from the code blocks drawer followed by Make a Block. You will get asked to name your new function.

You need to make two functions. We have named our functions set up readings and make graph so that we can remember easily what they do!

Ready...MAKING VARIABLES!

A variable is a quantity that can be measured and its value can be changed. We are going to need 9 variables! We are going to use these variables to set up the way the readings of displacement (proximity) and time will recorded and to help us set up our displacement-time graph axes using a sprite on screen.

Firstly, we need to make the "readings" variables. These set up the way that the displacement (proximity) and time readings are recorded.

To make a new variable, select the Variable option in the code blocks drawer followed by the Make a Variable button. You will be asked what you want to call your variable. We used the following variable names to help remember what each variable does! Make the 5 variables listed below:

The reading number variable is the number of the current reading. For example, the reading number of the 1st reading is "1" and so on.

The total readings variables is used to set the total number of readings recorded.

The proximity variable stores the reading from the proximity sensor.

The time variable stores the time at which each proximity sensor reading was recorded.

The gap variable sets the time interval between readings.

Secondly, we need to make the "graphing" variables. These set up the axes of our graph using a sprite on screen. Make 4 more variables as listed below:

The x position variable is the position of the sprite on the screen where the x-axis will start on the screen. The y position variable is the position of the sprite on the screen where the y-axis start will  on the screen. Together, the x position and the y position coordinates determine the origin of the displacement-time graph.

So that our graph doesn't end up too super small or super big to see on the screen, we need two more variables to scale the numbers that we get for proximity and time to fit on our graph axes. The x scale variable will multiply values plotted on the x-axis to scale them to fit. The y scale variable will multiply values plotted on the y-axis to scale them to fit.

READY...SETTING THE "READINGS" VAriables

We are going to define the set up readings function that we made earlier and we are going to set values for the "readings" variables that we have just created.

The set up readings function will be the first bit of code that we run.

Start off by setting the total readings to 80 and set the gap to 0.25.

If the total readings variable is the total number of readings recorded and the gap variable is the time between readings, the total length of time that our code will run for can be worked by multiplying these variables together.

In our example here, the total run time will be 20 seconds (80 readings x 0.25 seconds). You can make your total run time longer or shorter by changing these variables.

Set the reading number to 0 (zero) and set the time to 0 (zero).

Hint: Try experimenting with different gap times and see what happens to smoothness of the line on your graph! 

We get to sound like the villain from a sci-fi superhero movie with our next two commands. We are going to remove previous readings from the time list by delete all of time. We also need to remove any previous readings from the proximity (distance) list by delete all of proximity.

(Fingers crossed that we don't really have epic powers and that our Universe and good old space-time continuum is still here after that...but don't say we didn't warn you!).

Your complete set up readings function should like like this:

Ready... SETTING THE GRAPHING VARIABLES

We are going to define the make graph function that we made earlier and we are going to set values for the "graphing" variables that we have just created.

The make graph function will be the next bit of code that we run.

The screen is a 480 by 360 rectangle. The x position can be any value from -240 (sprite as far left as possible) to 240 (sprite as far right as possible). The y position can be any value from -180 (sprite as far down as possible) to 180 (sprite as far up as possible). Set the x position to -220 and set the y position to -160. This is near the bottom left of the screen.

You may need to adjust the values of x scale and y scale when you have done a test run of the code with a moving object but start by setting x scale to 20 and y scale to 0.5. If you make the value bigger than 1 then you are enlarging the scale; if you make the value smaller than 1 then you are shrinking the scale.

READY...DRAWING THE GRAPH AXES

We are going to use pen blocks along with our "graphing" variables to get the graph ready by drawing the graph axes.

If the pen blocks are not already showing then click on the blue add extension icon at the lower left of the screen as shown below to open the choose an extension screen. Click on Pen to add the blocks.

You are going to use the pen up, pen down, erase all and set pen color blocks.

We want to remove any previous graph so we start by using erase all to get rid of any pen marks. We also want to make sure that the pen does not make any marks while it is moved into position so add a pen up block

Tell our sprite to go the top of the y axis using a motion block:

Choose a pen colour. We used set pen color to make the pen draw in black and then pen down.

Telling the sprite to move to the origin of the graph (the point with coordinates set by the values of the x position and y position variables) will draw a vertical line for the y axis. Then telling the sprite to move horizontally to x position + 400 will draw a line for the x axis.

Next lift the pen up again.

Hint:  If you have trouble remembering which way round x and y are, think y is up in the sky!

Your complete make graph function should look like this:

STEADY...

Back to our main code to put the initial values into our lists...

Add the two functions, set up readings and make graph, after get ready in your code.

Use an insert block from the list blocks to put the value of the time variable from set up readings into position number 1 in the time list.

The proximity variable should be should be set to store the reading from the proximity sensor.

Use another insert block from the list blocks to put the value of the proximity sensor into position number 1 in the proximity list.

We need to move the sprite to the point that it is going to draw the first displacement point on our graph for the first time reading in the list.

As it is a displacement-time graph, the y coordinate is given by moving the sprite up from y position at the origin by an amount equal to the value of the proximity variable (scaled to fit by multiplying proximity by y scale). The x coordinate is just the x position at the origin.

Choose a different pen colour. We used set pen color to make the pen draw in blue and then pen down again.

Your main code should look like this so far:

GO...

Now we need to get going! We want to record proximity sensor readings at regular intervals and draw each point on the graph.

In the code above, we filled the items at position number 1 in the proximity and time lists with our initial values. We now need to fill the rest of the list... Use a change variable block to increase the reading number by 1.

Then we want to wait for the time interval fixed by the gap variable.

Set the value of the time variable to be equal to the reading number multiplied by the time gap.

Then insert this time value into the next item position (given by the reading number plus 1) in the time list.

Set the value of the time variable to be equal to the reading number multiplied by the time gap.

Insert the reading from the proximity sensor into the next item position (given by the reading number plus 1) in the proximity list.

We need to move the sprite to the point that it is going to draw the next displacement point on our graph for the next time reading in the list.

As before, the y coordinate is given by moving the sprite up from y position at the origin by an amount equal to the value of the proximity variable (scaled to fit by multiplying proximity by y scale). The x coordinate is given by moving the sprite along from x position at the origin by an amount equal to the value of time (scaled to fit by multiplying time by x scale).

This section of the main code should look like this so far:

We want to repeat the steps above until our lists are full. We set the total number of readings that we want to take in the set up readings function and we put values into the first items in each list. In our example, we set the total readings to be equal to 80. This means we want to take 79 more readings! So the number of times we want to repeat the code is given by:

To do this easily, we can make use of a repeat block, also known as a loop, to keep taking readings. Put a minus operator block into the repeat block to make it run for total readings minus 1 times.

Then insert the code you programmed into the loop:

COMPLETE CODE

 You are now ready to get your data. Find a suitable object or speak nicely to a helpful person if you want them to be your object! Remember your object needs to be big enough for the light from Marty's distance sensor to bounce off it and return to the sensor. Marty also needs to be at a suitable height for the light to reach the object so it might be handy to put Marty safely on a table if you are trying to record the motion of a person.

 Make sure you have set your variables. You might need to adjust the value of x scale and y scale depending how far your object is from Marty.  A few test runs will be helpful!

When you are ready, click to start your code and have fun creating some groovy graphs!

Challenge TWO:

To make analysing the motion of the object easier, it might be helpful if the line on the graph changed colour when the object was at rest. This means we can quickly identify sections on our displacement-time graph when the object is not moving towards or away from Marty.

Add a few extra blocks to your program so that the pen colour changes when the object has stayed at the same displacement from Marty from one reading to the next.

Here are a few things you will need to think about,

  • How will you know when the displacement has stayed the same? You want to compare items stored in your promixity list! An Operator block would also be useful!
  • You only want to change the colour of the line if the displacement has stayed the same otherwise you want to keep the same pen colour as before. You will need a Control block!
  • How will you make the changes stand out on your graph? Choose a contrasting colour for the pen!
  • Where will you add the extra blocks in your code? You want to make sure that every reading is compared to the one before...

I need some help!

To find the value of the proximity sensor stored in a particular item in our proximity list, we want to use a reporter Item of List block found in the Variables code blocks drawer. This reports what text is contained in an item at a particular position number. For example, the block below reports on the information stored in item number 1.

We want to compare the value of the proximity sensor that we have just stored in the proximity list for the current reading number with the value stored for the previous reading number. We need two item blocks so that we can go on to compare items. Set one item block to report on the information stored at the current reading number and the other to report on the previous reading number.

If the displacement of the object has stayed the same, then the proximity sensor reading stored for the current reading number and previous reading number will be equal to each other.  We will want to use another Operator block to help us identify when these two items are equal to each other.

In programming, we can use something called if statements to help us make decisions. We want to identify when the object is at rest and if it is at rest then we want to set pen colour to a different colour (we have used pink) otherwise (else) we just want to keep the same pen colour as before.

Select the If Then, Else block from the Control option in the code blocks drawer.

Add the equal block to the If Then, Else block and add a block to set pen colour to a different colour for if the proximity sensor readings have stayed the same. Otherwise we want to keep the same pen colour as before so put a duplicate of your previously made set pen colour block in the else part of the Control block.

Lastly, you need to position your extra blocks in the correct part of the code so every time the reading number increases, the latest proximity sensor reading is compared with the previous reading. We want to make the decision about what colour pen to use just before the point on the graph is drawn so the extra blocks are inserted inside the Repeat block just before the Motion block moves the sprite to the correct position on screen.

 

What Next?

You have now just created and programmed Marty to make some very groovy graphs. If you want to continue to explore graphing with Marty's distance sensor... here are a few ideas!

  • Try walking towards and away from Marty at different rates to see what happens to the line on your graph. Remember the gradient of the graph shows how quickly you are moving!
  • Set up a game where you sketch a graph then friends have to try to work out how to move to make the same graph on screen! You could see who gets closest to the right answer! How would you change your code so that the lines are not deleted each time?
  • Extend the second challenge to make the colour of the pen different for objects getting closer to Marty compared to objects moving further away. You will want to use pen, control and operator blocks!