Skip to content

Please update your browser

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

arrow_back Sign my Scrapbook


In this add-on, you will create a sprite that allows friends to sign your scrapbook.

First, click paint new backdrop.

This example decorates the backdrop by making it green and writing “Sign my Scrapbook," but you can do whatever you like on your backdrop.

Next, add a new sprite for your friends to draw with.

Click choose new sprite from library and add the pencil sprite .

Begin by making the sprite follow the mouse pointer.

Drag out a “go to mouse-pointer” block, and place a “forever” loop around it.

From the events menu, add a “when this sprite clicked” event to start the code.

Test it by clicking on the sprite.

The sprite follows the mouse pointer.

Stop testing by clicking the stop sign.

Notice that the pencil is in the top right corner which will make it hard for your users to click.

Program the pencil to have a starting location by using the “go to x y” block.

First, drag the pencil to where you want it to start.

Then, from the motion menu, drag out the “go to x y” block.

Add a "when flag clicked" block to reset the pencil.

Test it by clicking on the flag. The pencil starts where you placed it.

Next, make the sprite draw. Go to the pen menu and pull out the “pen down” block. Add it to the forever loop. Test it out.

Now, the pencil draws, but it has two problems: The line is coming out of the middle of the pencil, not the point, and, once you start drawing you can’t stop!

First, fix where the line is coming from by adjusting the placement of the center of the pencil. Click on the the costumes tab. In the top right, click the “set costume center” button. Click a little below the pencil lead so that there is space between where you click and the tip of the pencil. The crosshairs will move to that location. This is where the pencil will draw from.

Test it out. The pencil now looks like it draws with the point.

Next, make the pencil sprite only draw when you hold the mouse down. To do this, you will use an “if/else” block. Pull it out, and add it to the forever loop.

From the sensing menu, pull out a “mouse down” block, and add it to the “if/else” block. This is the condition for when to draw. Move the “pen down” block into the “if” portion of the block, so the pencil will draw only when the mouse is pressed down.

Test it out. It still draws even when the mouse button is not pressed down. The pencil goes down, but it never comes back up!

Go to the pen menu, and pull out the “pen up” block. Place it in the else portion of the “if/else” block. This makes the pencil start out in the “up” position and go down to draw only when the mouse button is pressed. Clear the stage by clicking the “clear” block. Test your code!

Pull out the “clear” block, and attach it to a “when flag clicked” event to make the screen clear when you click the green flag.

Now, customize your project. For example, use the “set pen color to” block to change the ink color. Use the “set size to” block to change the width of the line you draw.

You may notice that the pencil never disappears when you hit next. Use the “show,” “hide,” and “when backdrop switches to” blocks to make the sprite only appear on this backdrop.

Learn more about these in the Pop in add-on. Lastly, add a “stop” block and select “other scripts in sprite” from the dropdown menu. This makes the sprite stop drawing when it is hidden or when the backdrop switches.

Now, it’s your turn.

Add a new backdrop and new sprite to the stage. Make a drawing function using blocks from the pen menu, and “go to,” “if/then,” and forever” blocks.

Choose an Add-On
Flashy Stuff
Create a colorful trail that follows the mouse pointer.
Sign my Scrapbook
Collect friends’ signatures in your scrapbook.
Inside Joke (Challenge)
Program something funny especially for your friend.
Add background music to your project.
Pop In
Make your sprites show and hide.
Memory Collector
Learn how to use the backpack, save images of your project, and present what you’ve built to the larger Scratch community.
arrow_backward Back
Next arrow_forward
  1. Choose an Add-On, and click "watch" to learn how to build it.
  2. Once you finish one Add-On, try another one below the video!