Time for action - paint the stage

Let's decorate our stage with a fresh coat of paint:

  1. Select Stage in the sprites list.
  2. Select the Backgrounds tab in the scripts area to show a list of backgrounds. Our project is new, so we see the default white background.
  3. Open the stage in the Paint Editor by clicking on the Edit button.
  4. Apply a fresh coat of paint by selecting the fill tool and then choosing a color. Click on the stage to fill it with the selected color.
  5. Now, remove the color from the stage by pressing the Clear button located above the stage in the top-right corner.
  6. Paint the stage with a gradient. With the fill tool and a color selected, choose a fill option from the options area.
  7. The options area is located beneath the toolbar. As seen in the following screenshot, we have four fill options: 1) Fill the entire space 2) horizontal gradient 3) vertical gradient and 4) circle gradient.
    Time for action - paint the stage

    Tip

    Use the flip horizontally and flip vertically buttons to change the orientation of the horizontal and vertical gradients.

  8. On second thought, let's go back to a solid color on the stage. Clear the stage and use the fill tool with the solid color box selected in the options area. I'm going to use yellow.
  9. Let's frame the stage in a second color. Click the Shrink button to make the current block of color smaller. An area of white space displays on the edge of the stage.
    Time for action - paint the stage
  10. Paint the stage trim by selecting a new color from the color palette. With the fill tool selected, click anywhere in the trim area to fill it with the second color.
  11. Click OK to save the background. Your stage should resemble the following screenshot:
Time for action - paint the stage

Don't like the current paint job? Feel free to redecorate. It is, after all, your card.

What just happened?

It took us a few tries to get the paint job and effect we wanted, but using the Clear tool made starting over a snap. We were able to try several fill colors including gradients with relative ease until we got the correct effect.

When we shrank the solid color of the stage, we created a white space that we filled with a second color. When we applied the second color, it filled only the white space because the original color formed a boundary that the fill wouldn't cross.

Were you thinking about design as you painted? If not, you may have been surprised by the result when you clicked OK to save the stage background. As we add sprites and designs to our projects, making sure everything integrates well will be one of our challenges.

You may need to change the color of the Happy Birthday sprite, which can be done by editing the sprite's costume, which can be found by clicking the Costumes tab.

Adding gradients

When we add a gradient with the Paint Editor, we create a gradual progression from a dark color to a light color. In Scratch, the horizontal gradient starts with the darkest shade at the left and progresses to the lightest shade at the right. With a vertical gradient, the darkest shade is on the right side. You can flip the gradients using the flip tool.

When you place a circle gradient, the center of the circle is where you clicked the mouse. The center is also the darkest shade in the gradient.

When working with gradients, the gradient will fill to a boundary. If the stage is empty, then the gradient will fill the entire space. If you draw a square in the middle of the stage and fill the square with a gradient, the gradient confines itself to the boundary of the square.

Have a go hero

Edit the stage background of your birthday card and apply a gradient to the center of the framed background. If you remove the framed background we created, use the Rectangle tool to draw a square. Then fill it with a gradient.

After you're done experimenting, you can cancel the Paint Editor to return to your previous design. Or, click OK to accept the new design.

Pop quiz

  1. If you want to create a text sprite with the Paint Editor, what tool do you use?
    • Fill tool
    • Text tool
    • Gradient tool
  2. The gradient tool produces what kind of graphical effect?
    • A block of color fades from light to dark shades
    • A block of color alternates from light to dark shades like zebra stripes
    • It draws a solid block of color with a dark center

Sprite costumes

So far, our project contains exactly one sprite that we created, but we do not want to create all of our sprites in the Paint Editor. Thankfully, Scratch bundles many sprites with the default installation that we can find in the Costumes folder.

Tip

On a typical Windows installation, you can find the sprites at C:Program FilesScratchMediaCostumes.

A costume gives the sprite its initial look. The default Costumes folder includes Animals, Fantasy, Letters, People, Things, and Transportation. In our next exercise, we use individual letters to display a message on the screen. This gives us more control over how we can display and animate the text.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.118.147.160