Skip to content

Please update your browser

Your browser version is not supported by this site. CS First may not work properly. Learn more

2. Time to Dance


All animations are made up of individual pictures, called frames. Frames could be drawings in a flipbook or photographs in a stop motion animation. In this video, you’ll learn how to animate the frames in your project to make your character dance!

Your project starts with 4 frames. To view these frames, click on the “costumes” tab. If you click through the frames, the character looks like it is moving!

However, it’s no fun to click on each frame to make your character dance, so you’ll use computer science and loops to let the computer do the hard work for you.

First, click on the “scripts” tab. To animate your sprite, you’ll need to change the way it looks. Click on the “looks” menu.

Here are many different blocks that change how your sprite looks. To find out what each block does, simply click on it.

The computer can change the sprite’s costumes automatically using the “next costume” block. Drag this block into the scripts area to add it to your program.

Click the “next costume” block to cycle through all the sprite’s costumes. That’s great, but there is an easier way to change the costume repeatedly. You can program the computer to do it for you! An important part of a computer scientist’s job is figuring out easier ways to do things. For example, programming a computer to repeat an action automatically is much easier than clicking over and over again.

To switch the sprite’s costume over and over again, use a loop. You can find loop blocks under the “control” menu. Drag out a “forever” block, and add it to your program.

Notice that clicking the “forever” block doesn’t do anything. That’s because the “forever” block repeats the instructions inside it over and over again forever, and there isn’t anything inside the block yet. Place the “forever” block around the “next costume” block. Now, click this block stack to test it.

Wow! Look at that sprite go! The computer is switching costumes forever and ever really fast!

You can slow down the animation by telling the computer to wait a little while before switching to the next costume.

To do this, open the “control” menu, and drag a “wait 1 second” block into your forever loop.

That’s better! You can change the value in the white bubble to any number you like.

If you think 1 second is too long, for example, change the value to something smaller, like 0.2 seconds. Experiment with the wait value until you’re happy with your animation. Computer scientists like you experiment with their code all the time! This animation works great, but the only way to play it is to click the code.

In full screen mode, users can’t access the code, so they won’t be able to play the animation.

Most programs and animations have a "play" button, so users never have to interact with the code. In Scratch, the green flag can act like your play button.

Open the “events” menu, find the “when green flag clicked” block, and snap it to the top of your block stack.

Time to test! Click the green flag. The sprite should start dancing.

Now, it’s your turn! Animate your sprite using: a “next costume” block, a “forever” block, and a “wait” block. Experiment with the value in the “wait” block until you’re happy with your animation. And finally, add a “when green flag clicked” block to the top of your block stack.

After you finish these steps, click the green arrow to move on to the next video, which will show you how to add your own frames to your animation.

arrow_backward Back
Next arrow_forward
  1. Use a forever loop to animate the sprite.
  2. Control the speed of the animation.