Drawing with Scratch

Les Pounder shows how we can use simple maths to draw patterns and shapes, just like a classic childhood toy.

Les Pounder shows how we can use simple maths to draw patterns and shapes.

As a child I had Spirograph, and it was fascinating how coloured pencils and a rotating cog could create such wonderful patterns. Little did we know that years later we would be reproducing those same patterns with code. In this tutorial we shall use a little maths to generate coloured patterns in Scratch 3.

Scratch 3 should come pre-installed on your Raspberry Pi OS image, but just in case it is missing it can be installed from the main menu, under Preferences > Recommended Software. Scratch 3 is found in the Programming category; tick the box and click Apply to install. Once installed, Scratch 3 can be found in the main menu under Programming.

Open Scratch 3. On first start Scratch may take a little while to open. We’re going to assume that you have an understanding of how to code with Scratch, but if not we covered the basics in previous issues. Before we write any new code we need to click the blue folder icon at the bottom left of the screen to load the Extensions menu. From there select Pen and a palette of new blocks is added to our code.

Draw a square

Next we need to go to My Blocks and click Make a Block . With this we can create our own Scratch blocks which will run a series of steps when the block is used. It works in a similar manner to Python’s functions. Call the block ‘Square’ and click OK. A new red block define Square will appear in the coding area, and we will now write the code that will draw a square on the stage. Go to Pen and connect pen down to the define Square block. From Control, drag a repeat 10 and connect it to the previous block. From Operators drag a _ / __ block and drop it on top of the 10 of repeat 10 .

A square has four sides, all of equal length and each corner has a 90 degree turn. If we use a little maths we can determine that we need to divide 360 by 90 degrees, giving us the four times that the loop will iterate. Add the equation 360 / 90 to the blank spaces. Inside the loop, drag change pen color by 10 to change the pen colour each time the loop iterates, creating a rainbow effect. Then drag set pen size to 1 and connect it to the previous block. From Operators drag pick random 1 to 10 and drop it on top of the 1 in set pen size to 1 . This will randomly change the pen thickness as the loop iterates. From Motion drag move 10 steps and place it under the previous block, change the 10 to 50 so that we have a large square. Next drag turn 15 degrees from Motion and place it under the previous block. From Operators drag a _ / __ block and drop it on top of the turn 15 degrees block. This time we need to turn the 360 / 4 degrees, 90 degrees. Type 360 / 4 into the operator block.

Create a circle

Create another new block via My Blocks and this time call your block Circle and click OK to create. A new red block define Circle will appear in the coding area, and our task now is to create a sequence of code that will draw a circle when we use the Circle block. From the Pen palette drag pen down and attach it to the Circle block. This will place the pen on the screen and enable us to draw. From Control drag a repeat 10 and connect it to the previous block. From Operators drag a _ / __ block and drop it on top of the 10 of repeat 10 .

To draw a circle we need to do a little maths. A circle has 360 degrees, and to draw one circle we need to make a loop that iterates 36 times, each time rotating 10 degrees. To get 36 loops we need to divide 360 by 10 and the output of the equation will drive our loop to iterate. Inside the loop, drag change pen color by 10 to

change the pen colour each time the loop iterates, creating a rainbow effect. From Motion drag move 10 steps and place it under the previous block. Next drag turn 15 degrees from Motion and place it under the previous block. From Operators drag a _ / __ block and drop it on top of the turn 15 degrees block. This time we need to turn the 360 / 36 degrees, 10 degrees. Type 360 / 36 into the operator block.

Draw a triangle

This is the trickiest of them all. In maths we are told that the internal angles of a triangle add up to 180 degrees, and that is still correct. But for Scratch we need to use external angles to draw the shape.

Create another new block via My Blocks and this time call your block Triangle and click OK to create. A new red block define Triangle will appear in the coding area. From the Pen palette drag pen down and attach it to the Triangle block. From Control drag a repeat 10 and connect it to the previous block. From Operators drag a _ / __ block and drop it on top of the 10 of repeat 10 .

The maths this time is to work out the external angle. A triangle has three sides, so if we divide 360 / 3 we get 120 degrees. But remember this loop is the number of times it iterates to draw the sides, so our equation will be 360 / 120.

Inside the loop, drag change pen color by 10 to change the pen colour each time the loop iterates, creating a rainbow effect. From Motion drag move 10 steps and place it under the previous block, change the 10 to a 50 for a larger triangle. Next drag turn 15 degrees from Motion and place it under the previous block. From Operators drag a _ / __ block and drop it on top of the turn 15 degrees block. This time we need to turn the 360 / 3 degrees, 120 degrees. Type 360 / 3 into the operator block.

The sequence will use each of the shape blocks in a forever loop. From Events drag When Green Flag Clicked and place it in the coding area. From Pen connect erase all to clear the screen. From Control drag a forever loop and connect to the previous block. Inside the loop, from Pen drag set pen size to 1 and then from Looks drag hide to hide the cat sprite. From Pen drag pen up and then from Motion drag glide 1 secs to random position , change the 1 to 0.1 . Now our invisible sprite will move around the stage without leaving any marks.

From Control drag repeat 10 and change 10 to 24 . Inside this new loop, from motion drag turn 15 degrees and move 10 steps to move the sprite 24 times in a slow rotation. From My Blocks drag Triangle and connect it to the previous.

Lastly outside the repeat 24 loop, but inside the main loop, drag pen up from Pen, and another glide 0.1 secs to random position . Click the green flag and watch as a spiral of triangles appears on the screen.

Your next challenge is to try and have your Circle and Square blocks repeat the same sequence.

You too can create a psychedelic masterpiece with just a few blocks of Scratch code.

The code to create a forever sequence is rather simple, but there is quite a lot of it so make sure you visit our Scratch project to see it all.

The red Triangle block is a function that we can use to run all of the code within it.