FOR THIS PROJECT YOU WILL NEED
- A computer running Windows or Mac OSX
- Access to the scratch.mit.edu website
Math is an interesting subject. We can use math to launch rockets to the moon and to calculate how many pizzas we need for a family meal, by the way the answer to the pizza problem is n + 1, where n is the number of pizzas you need, and the + 1 means you always have leftovers! For some of us, math is difficult and scary. So how can we learn a little math and still have fun? Using our Scratch 3 shape generator we will create a project that will draw a shape with any number of sides, in a pattern, and with colourful pens!
You will need to visit here to create a new project. If you would like to play the game first, head over to here and give it a try!
In this project we will learn
- How an iterative loop can be used.
- How a user input can be captured and used.
- How a variable can be used to store a value.
- How simple math can be used to calculate an angle.
Getting Started
We start the code by first going to Events and dragging the When Green Flag Clicked block into the coding area. This will start our project when the green flag is clicked.
From Motion we next drag the go to x: 0 y:0 block. This will force our sprite to move to the center of the screen when the project starts.
From Looks we now use the hide block to force our sprite to disappear when the project starts.
We next need to load a new extension which enables our code to draw on the screen. Click on the folder icon in the bottom left of the screen, and click on the Pen extension. In the code blocks area we now see the Pen section. From the Pen section drag erase all into the code sequence.
Our project depends on the user answering a question. “How many sides does the shape have?” and to ask a question we go to Sensing and use the ask ___ and wait block. Change the question to “How many sides does the shape have?” The answer to the question is saved as a variable called answer, which we shall use later.
From the Pen section drag the Set pen color to block to the sequence, and change the color to whatever you like.
From Control drag the repeat 10 block and place it in the sequence. Change the 10 to 24, but why do we do this? The answer is revealed later in this tutorial!
Inside the repeat 24 loop we add another repeat 10 loop, but this time instead of a number we go to Sensing and drag the answer block into the sequence, using it to replace the 10. This now means that the loop will iterate (go round) using the number given by the user, which is the number of sides the shape has.
To create a random thickness of pen, we need to insert two blocks inside the new loop. Look for set pen size to 1 found in Pen. We replace 1 with Pick random 1 to 10 found in Operators. Change the 10 to 4, otherwise the pen will be too thick.
After the pen thickness has been set we need to move the sprite so that they draw on the screen. Use the move 10 steps block from Motion and change the value to 40 steps.
So how do we work out how to draw a shape? For this we need the Turn < degrees block from Motion. The angle at which we need to turn is calculated by taking 360 degrees and dividing it by the number of sides our shape has, saved as the answer to the question that we asked the user earlier. We can find __ / __ in the Operators blocks. In the first blank type 360 and in the second place the answer block from Sensing.
To add a little fun to the code go to Pen and drag the change pen color by 10 block into the code. This will create a rainbow effect as our pen draws upon the screen.
So why do we repeat a loop 24 times? Well we want to draw a circular pattern using our shape on the screen. A circle has 360 degrees, and if we divide 360 by 24 we get 15 degrees, which is the exact amount in the turn > 15 degrees block found in Motion. Each time the loop iterates, the pen will move 15 degrees clockwise, before redrawing the shape on the screen.
The final block is from Motion and it is move 10 steps which will move the pen around the circular pattern. Now is a good time to check your code. Does it look like this?
Click on the Green Flag and when asked for the number of sides type in 4 to see a square, and then try again and type 3 to see a triangle.
So what have we learnt?
We’ve learnt to
- Use math to calculate the angle of turn to draw a shape.
- Capture user input and use it in a game.
- Import new extensions to add more features to Scratch 3.
- Use Pen blocks to draw upon the screen.
- Use loops with a fixed value to iterate a certain number of times.
Could you add more to this game?
- Draw shapes at different positions on the screen?
- Draw multiple shapes at once?
- Use microphone and webcam as input to trigger the code?
Learn More
How to make shapes in Scratch
https://scratch.mit.edu/projects/24226/
Coding shapes in Scratch
http://researchideas.ca/mc/article-1-title-recent-issue/try-this-fun-activity-1/
2D shapes in Scratch
https://www.edutopia.org/blog/scratch-programming-drawing-2d-shapes-dylan-ryder
Making Mathematical Art
https://blogs.scientificamerican.com/guest-blog/making-mathematical-art/
