Coding a volcanic eruption in Scratch

Share this!

Last week during online school, Liam’s class were learning about volcanic eruptions and the different parts of a volcano. As well as drawing a volcano and labelling the components, Liam decided to show the process of a volcanic eruption in a step-by-step video he coded using Scratch.

We’ve been using Scratch on and off for a while, testing things out, but haven’t really settled down to creating something with a bit of structure to it. This was the first full animation Liam created in Scratch, so there was a lot of learning to make each component work.

Planning the animation

We’re trying to set up a process to help Liam plan the components he needs before getting started. His enthusiasm means he has a tendency to skip ahead, and miss key steps.

The first step for him was to figure out what layers he would need in order to achieve the desired end result. Planning the layers wasn’t too complex for this project, more a matter of listing out the various components he would need to show.

Creating the backdrop

There are several different ways to create backdrops in Scratch. The quickest and easiest is to select a backdrop from the default Scratch library. Another way is to upload an image of your own. We’ll talk more about these options in future posts. Liam used a third option for this project – he drew his own backdrop. It’s very simple, green ground and blue sky, but it doesn’t distract from the volcano, which was his main priority.

Simple background drawn using Scratch
Volcano background

The perimeter is messy and uneven, but the great thing with Scratch is that it doesn’t matter. The white rectangle in the image above shows the boundaries of the display, so colouring outside the lines means there’s no accidental blank space at the edge. When the volcano is placed on top, it actually looks pretty good!

Volcano image on blue and green background
Volcano sprite on background

Using Sprites to show the parts of a volcano

The default range of Sprites in Scratch doesn’t include a volcano, so Liam needed to draw his own. Having studied the parts of a volcano for school, he knew he needed to create several different components. Instead of drawing these all as one image, he split them up so that each one could have its own code. Five Sprites were created in total:

  1. Layers of ash and lava to form the cone shape
  2. Magma chamber, with main and secondary vents
  3. Projectiles
  4. Ash cloud
  5. Labels for each component

Scratch allows for drawing one Sprite over the top of another. This feature made it easy to get the sizes and placement of each Sprite correct, relative to the others. It was particularly beneficial for the lava, because the lava needed to spill down the sides of the volcano at the right angles.

Developing the Sprites using costumes

In order to show the progression of lava, ash and projectiles during a volcanic eruption, Liam needed these to elements to expand and develop throughout the animation. We’ll use the lava as an example.

Liam wanted the lava to start by rising through the main vent, then adding a secondary vent. Following that, the lava needed to spill down the sides of the volcano. To do this, he created multiple costumes for the lava.

To create each new Sprite, Liam copied the previous Sprite and then added to it. It’s a lot easier than trying to draw it new each time, and kept it looking consistent.

Coding the Sprites

Coding the volcanic cone

Thinking through the animation logically meant coding the Sprites in the order they would appear, starting with the cone. The cone had the most simple code. The coordinates give the cone its position on the screen, shown by the blue line in the screenshot below. (The volcano project was meant for science class, but Liam learned a lot of useful maths in this part of the coding.)

The purple line underneath, “go to back layer” ensures that the cone remains as the rearmost Sprite, even when other Sprites are added. This was important, because we had some trouble at first where later Sprites were hidden behind earlier layers.

Once the volcanic cone is in position, it’s instructed to “show”, which makes it appear on screen.

Scratch coding showing coordinates for a sprite
Code for placement of the cone Sprite

Coding the lava with multiple costume changes

The lava Sprite was coded to appear at the same time as the cone, i.e. with no delay, and appear as costume 1. Coordinates were set in the same way as the cone, to ensure the right placement of the Sprite. The next costumes were set to appear at 1 second intervals, on a loop that repeated four times. With each round of the loop, the costume switched to the next one in the sequence, which gave the effect of the lava growing.

Coding in Scratch telling the sprite to change costume
Code for the lava Sprite

Coding the ash cloud with a delay

The ash cloud Sprite needed a delay before starting so that it matched the timing of the eruption. A line telling it to wait 3 seconds was added at the start of the code sequence. The small cloud, costume 1 was set to appear first, and then change to the big cloud.

Code for the ash cloud Sprite, with a delay instruction
Code for the ash cloud Sprite, with a delay instruction

We’ve written more here about how to add timing and delays to your coding in Scratch.

Coding the projectiles with coordinated timing

The projectiles that explode from the volcano needed to follow slightly later than the ash cloud, so a 4-second delay was placed at the start of the code. Similar to the lava and the ash cloud, the projectiles had a couple of costumes, so that the placement and size could change during the animation.

Code for the projectiles Sprite, with multiple delays
Code for the projectiles Sprite, with multiple delays

Liam did a fantastic job of creating his first animation, and learned a huge amount in the process. Timing, costumes and hand-drawn Sprites were all completely new at the start of this project. Check back in soon for some animated stories, or sign up below to see the latest projects as soon as they’re live.

Also check out:

Share this!

Similar Posts

2 Comments

  1. Hi t᧐ all, how is eѵerything, Ӏ think every one is getting more from this website,
    and your views are good in favor of new users.

Leave a Reply

Your email address will not be published. Required fields are marked *