Skip to content

Please update your browser

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

3. Adding More Frames


Remember, all animations are made up of frames. “Frames” are individual pictures that, when strung together and flipped through very fast, make a character or scene look like it’s moving. In this video, you will learn how to create more frames for your animation, so the character adds more moves to its dance. Watch this video to learn how to do it, then try it on your own. First, click on the “costumes” tab.

You are now in the Scratch paint editor. You can use the paint editor to change how your sprite looks.

Now, create a copy of a costume to change. You’re going to “edit,” or change, the sprite’s costume so it looks like it’s dancing. To do that, right click on the costume, and select “duplicate.” You now have a copy of the costume to work with. In this example, the last costume was duplicated in order to continue the animation.

Next, you’ll learn about the cool stuff you can do to edit sprites! Use the “select” tool, and click on the sprite. You’ll know that you’ve selected the sprite when you see a box around it. With the sprite selected, you can move it by clicking and dragging, rotate it by dragging the circle on top of the sprite, or change its size by dragging the squares on the corners and sides. If you make a mistake while editing the sprite, that’s okay! Computer scientists make mistakes all the time, and they use those mistakes to learn what they should do differently next time.

You can use the “undo” button to undo your last action. Then, try again until you have something you like. Now you can move, rotate, and resize your sprite. But, a dancing sprite needs to be able to move its arms and legs.

To make that happen, select the sprite, then click the “ungroup” button. The sprite now splits into many parts that you can move, rotate, or resize individually. Move the arms and legs a tiny bit to create your first animation frame.

Remember to test your animation often! Computer scientists always test their projects to make sure everything is working.

To test your new frame, click back and forth between the original costume and your new costume. You can also click the green flag to play the entire animation with your new frame in place. Wow! The sprite performs the dance move that was just added. There is one more drawing tool to try: the “reshape” tool. Use this tool to edit points and lines. For example, click on the “reshape” tool, then on your sprite’s mouth. Drag the points and lines on the sprite’s mouth to make it look like it is smiling! Once you are happy with your new frame, duplicate the costume you just created, then make further changes to it to create your second frame.

Repeat this process until you have three new animation frames. Remember, every frame in an animation changes just a tiny bit from the one that came before. Make small changes to your sprite’s pose and expression so it looks like it is dancing.

Finally, give your masterpiece animation a descriptive title so you and your friends can easily find your project later. This example is called “The Awesome Penguin Dance.”

Now it’s your turn! Create three new frames for your dance animation, and test your work often.

Try the following tools: Select, Undo, Ungroup, Reshape.

It’s important to create without the fear of making mistakes. Try something new.

Make something awesome!

After you finish creating your dance animation, click the green arrow to move on to the add ons, where you’ll spice up your animation with even more cool features!

arrow_backward Back
Next arrow_forward
Use the "costumes" editor to create new frames for the animation.