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. Fill the Stage with Color


In this screencast, you will use a repeat loop to fill the blank stage with different colored circles. Watch the screencast demonstration to learn what to do first, then you’ll get to try it on your own. Your starter project already has a sprite with several colored circles that will be used to fill the stage. First, you'll click on this sprite to add code blocks that will give the sprite instructions.

This sprite should move around the screen, stamping copies of itself onto the stage until the stage is full. To make that happen, click the motion menu and choose a "go to" block, which will move your sprite to a location on the stage when you click the block.

The sprite needs to go all over the screen, and you don't want to enter in all of those values to make that happen. To save time, click on the Operators menu and drag the “Pick random” block into the "go to X" value. If you click the block now, you'll see that the sprite moves just a little every time you click it. The value in X indicates the position of the sprite on the horizontal, or left-right, plane of the stage. The entire width of the stage is negative 240 to positive 240, so you'll add those values to the “pick random" block.

Now, the computer can pick a random number for you anywhere from the left to the right of the stage. You'll do the same thing for the Y value, which is the up-down plane of the stage, and “pick random” between negative 180 and positive 180, which is the height of the stage.

When the block is clicked multiple times, the sprite moves all over the stage.

Next, you need to make it copy itself. To do that, go to the Pen menu and add the stamp block to your stack.

It's always a good idea to test your code at every step along the way to make sure it is doing what you like. Go ahead and click on this stack to make sure the sprite is moving and stamping.

Great! Of course, you don't want to click the stack yourself to fill the screen, so under the control menu, grab the “repeat 10” block and put it around your block stack.

If you click the stack now, you'll see the block stack runs 10 times, moving and stamping itself across the screen.

The person who will use your project should be able to start it easily, so add the “When Flag clicked” block to the top of your stack. This will start the code running as soon as someone clicks the flag.

You'll also want each run of the project to start with a blank screen. Click on the “Pen menu” and use the “clear” block to make that happen.

You'll want to clear the screen as soon as the project is started, so place that block right under the “When Flag Clicked” block. Looking good! Each time the flag is clicked, the screen clears and a new set of colorful dots is stamped. But, you might want more dots to fill up all the space on the screen, so you can tinker with the value in the “repeat” block until you find one you like. Changing the repeat number will change the number of times the blocks inside the repeat loop are run and the number of times your sprite is stamped. Remember that tinkering with, or playing around with, the code, testing the values, then tinkering some more, are some of the best ways a computer scientist creates a project that he or she likes. Never be afraid to try out your ideas!

Now it's your turn. Be sure to click on the sprite with all the circles before adding your code. Then, make the sprite move using the goto block and pick random blocks. Make the sprite stamp itself and use a repeat loop to run the code many times. Use the “When flag clicked” block and clear block to start the project.

Once you’ve finished this step, return to this CS First page and click the green arrow to move on to the next screencast.

arrow_backward Back
Next arrow_forward
  1. Use the "go to" block to make the sprite go to a specific spot.
  2. Make the sprite go to a random spot.
  3. Make the sprite leave a stamp of itself.
  4. Make the sprite repeat going to a random spot and stamping itself.
  5. Start with a clear screen when the green flag is clicked.