Getting Started with Scratch 1.4 (Part 2)

Exclusive offer: get 50% off this eBook here
Scratch 1.4: Beginner’s Guide

Scratch 1.4: Beginner’s Guide — Save 50%

Learn to program while creating interactive stories, games, and multimedia projects using Scratch

$23.99    $12.00
by | July 2009 | Open Source

In this two-part article by Michael Badger, we will get comfortable working with Scratch by covering some basic concepts. Each Scratch project contains sprites with costumes, scripts, blocks, and a stage with backgrounds. In the first part, we built a couple of sample scripts to demonstrate how we can control the sprites in a project. For example, we used motion to move the sprites and forever loops to keep the sprite moving.

In this part of the article, we will use broadcast messages to coordinate the actions of multiple sprites. We will conclude this article by sampling and remixing projects from Scratch's sample projects and from the Scratch web site.

Add sprites to the stage

In the first part we learned that if we want something done in Scratch, we tell a sprite by using blocks in the scripts area. A single sprite can't be responsible for carrying out all our actions, which means we'll often need to add sprites to accomplish our goals.

We can add sprites to the stage in one of the following four ways: paint new sprite, choose new sprite from file, get a surprise sprite, or by duplicating a sprite. Duplicating a sprite is not in the scope of this article. The buttons to insert a new sprite using the other three methods are directly above the sprites list.

Let's be surprised. Click on get surprise sprite (the button with the "?" on it.). If the second sprite covers up the first sprite, grab one of them with your mouse and drag it around the screen to reposition it.

Getting Started with Scratch 1.4 (Part 2)

If you don't like the sprite that popped up, delete it by selecting the scissors from the tool bar and clicking on the sprite. Then click on get surprise sprite again.

Each sprite has a name that displays beneath the icon. See the previous screenshot for an example. Right now, our sprites are cleverly named Sprite1 and Sprite2.

Get new sprites

The create new sprite option allows you to draw a sprite using the Paint Editor when you need a sprite that you can't find anywhere else. You can also create sprites using third-party graphics programs, such as Adobe Photoshop, GIMP, and Tux Paint.

If you create a sprite in a different program, then you need to import the sprite using the choose new sprite from file option. Scratch also bundles many sprites with the installation, and the choose new sprite from file option will allow you to select one of the included files.

The bundled sprites are categorized into Animals, Fantasy, Letters, People, Things, and Transportation, as seen in the following screenshot:

Getting Started with Scratch 1.4 (Part 2)

If you look at the screenshot carefully, you'll notice the folder path lists Costumes, not sprites. A costume is really a sprite.

If you want to be surprised, then use the get surprise sprite option to add a sprite to the project. This option picks a random entry from the gallery of bundled sprites.

We can also add a new sprite by duplicating a sprite that's already in the project by right-clicking on the sprite in the sprites list and choosing duplicate (command C on Mac). As the name implies, this creates a clone of the sprite.

The method we use to add a new sprite depends on what we are trying to do and what we need for our project.

Time for action – spin sprite spin

  1. Let's get our sprites spinning.
  2. To start, click on Sprite1 from the sprites list. This will let us edit the script for Sprite1.
  3. From the Motion palette, drag the turn clockwise 15 degrees block into the script for Sprite1 and snap it in place after the if on edge, bounce block.
  4. Change the value on the turn block to 5.

    Getting Started with Scratch 1.4 (Part 2)

  5. From the sprites list, click on Sprite2.
  6. From the Motion palette, drag the turn clockwise 15 degrees block into the scripts area.
  7. Find the repeat 10 block from the Control palette and snap it around the turn clockwise 15 degrees block.
  8. Wrap the script in the forever block.
  9. Place the when space key pressed block on top of the entire stack of blocks.
  10. From the Looks palette, snap the say hello for 2 secs block onto the bottom of the repeat block and above the forever block.
  11. Change the value on the repeat block to 100. Change the value on the turn clockwise 15 degrees block to 270. Change the value on the say block to I'm getting dizzy!
  12. Press the Space bar and watch the second sprite spin. Click the flag and set the second sprite on a trip around the stage.

    Getting Started with Scratch 1.4 (Part 2)

What just happened?

We have two sprites on the screen acting independently of each other. It seems simple enough, but let's step through our script.

Our cat got bored bouncing in a straight line across the stage, so we introduced some rotation. Now as the cat walked, it turned five degrees each time the blocks in the forever loop ran. This caused the cat to walk in an arc. As the cat bounced off the stage, it got a new trajectory.

We told Sprite2 to turn 270 degrees for 100 consecutive times. Then the sprite stopped for two seconds and displayed a message, "I'm getting dizzy!" Because the script was wrapped in a forever block, Sprite2 started tumbling again.

We used the space bar as the control to set Sprite2 in motion. However, you noticed that Sprite1 did not start until we clicked the flag. That's because we programmed Sprite1 to start when the flag was clicked.

Have a go hero

Make Sprite2 less spastic. Instead of turning 270 degrees, try a smaller value, such as 5.

Sometimes we need inspiration

So far, we've had a cursory introduction to Scratch, and we've created a few animations to illustrate some basic concepts. However, now is a good time to pause and talk about inspiration.

Sometimes we learn by examining the work of other people and adapting that work to create something new that leads to creative solutions.

When we want to see what other people are doing with Scratch, we have two places to turn. First, our Scratch installation contains dozens of sample projects. Second, the Scratch web site at http://scratch.mit.edu maintains a thriving community of Scratchers.

Browse Scratch's projects

Scratch includes several categories of projects for Animation, Games, Greetings, Interactive Art, Lists, Music and Dance, Names, Simulations, Speak up, and Stories.

Time for action – spinner

Let's dive right in.

From the Scratch interface, click the Open button to display the Open Project dialog box, as seen in the following screenshot.

Getting Started with Scratch 1.4 (Part 2)

  1. Click on the Examples button.
  2. Select Simulations and click OK.
  3. Select Spinner and click OK to load the Spinner project.
  4. Follow the instructions on the screen and spin the arrow by clicking on the arrow.
  5. We're going to edit the spinner wheel. From the sprites list, click on Stage. From the scripts area, click the Backgrounds tab. Click Edit on background number 1 to open the Paint Editor.
  6. Select a unique color from the color palette, such as purple.
  7. Click on the paint bucket from the toolbar, then click on one of the triangles in the circle to change its color. The paint bucket is highlighted in the following screenshot.
  8. Click OK to return to our project.

Getting Started with Scratch 1.4 (Part 2)

What just happened?

We opened a community project called Spinner that came bundled with Scratch. When we clicked on the arrow, it spun and randomly selected a color from the wheel. We got our first look at a project that uses a background for the stage and modified the background using Scratch's built-in image editor.

The Paint Editor in Scratch provides a basic but functional image editing environment. Using the Paint Editor, we can create a new sprite/background and modify a sprite/background. This can be useful if we are working with a sprite or background that someone else has created.

Costume versus background

A costume defines the look of a sprite while a background defines the look of the stage. A sprite may have multiple costumes just as the stage can have multiple backgrounds.

When we want to work with the backgrounds on the stage, we use the switch to background and next background blocks. We use the switch to costume and next costume blocks when we want to manipulate a sprite's costume.

Actually, if you look closely at the available looks blocks when you're working with a sprite, you'll realize that you can't select the backgrounds. Likewise, if you're working with the stage, you can't select costumes.

Scratch 1.4: Beginner’s Guide Learn to program while creating interactive stories, games, and multimedia projects using Scratch
Published: July 2009
eBook Price: $23.99
Book Price: $39.99
See more
Select your format and quantity:

 

Time for action – broadcast a message

We're going to continue spinning. Let's make the color wheel strobe as the arrow spins:

  1. We need to duplicate the existing background. Select the Stage sprite and click on the Backgrounds tab in the script area. Click the Copy button to duplicate background1.
  2. Now, let's flip the second background. For background2, click the Edit button to open the Paint Editor. Click the Flip Horizontally button that is located above the editor window and click OK to exit the Paint Editor.

    Getting Started with Scratch 1.4 (Part 2)

  3. Select the Spinner sprite from the list of sprites.
  4. We're going to program the sprite to send a message. From the Control palette, add the broadcast block to the script before the turn 5 degrees block. Click on the message drop-down list of the broadcast block and choose New.

    Getting Started with Scratch 1.4 (Part 2)

  5. Type spin in the message name dialog box and click OK.
  6. We're going to tell the stage to listen for the broadcast message. Select Stage from the list of sprites.
  7. From the Control palette, add the when I receive block to the script area. Select spin from the message drop-down list.

    Getting Started with Scratch 1.4 (Part 2)

  8. From the Looks palette, add the next background block to the script.
  9. Click on the arrow.

What just happened?

Now we're programming in Scratch!

Our first step was to duplicate the existing background so we could flip it horizontally. We could have flipped the background vertically instead. Or, we could have flipped it both horizontally or vertically—it's a matter of whimsical choice.

We used a broadcast block on the Spinner sprite to let the stage know when we clicked the arrow. The arrow sent the message spin, which told the stage to switch to the next background, and this produced a strobe effect.

The stage knew how many times to switch backgrounds because when we clicked on the arrow, the script selected a random number between 25 and 200. In the original project, the random number controlled how many times the arrow spun around the circle.

In our new project, if the script selected a random number of 30, the following set of commands repeated 30 times in sequence: broadcast the message spin and turn to the right 5 degrees. For each spin, the background switched.

Broadcast messages coordinate sprites

When a sprite broadcasts a message, it's a clue to the other sprites that something should happen. In order for another sprite to react to the message, it needs to be told to listen for the broadcast message by using a when I receive block. Multiple sprites can be controlled with a single broadcast. If a sprite is not instructed to listen for a broadcast message, then it ignores the message.

You can think of broadcasts as a conversation starter. Conversations require two or more participants to engage. If I pass you on the street, I might say, "Hi, reader." Depending on the circumstances you might respond in one of three ways. First, you might say, "Hi, Mike." Second, you might wave. Third, you might ignore my message and continue on your path.

Browse the Scratch community

Learning by doing is a great way to figure things out, but interacting with the code of other Scratch programmers provides an insight and an inspiration that you might not find on your own. If you visit the Scratch web site at http://scratch.mit.edu, you can browse community projects by Newest Projects, Featured Projects, Top Remixed Lately, Surprise Projects, Top Loved Lately, Top Downloaded Lately, and Top Viewed Lately.

To view the Scratch projects on a web page, you need a Java Runtime environment installed.

Take some time and click through several projects so you get a broad sampling. As you view the work of others, stop thinking like a user and start thinking like a designer and a programmer. When you find something you like, ask yourself, "How does that work?" Then try to visualize how you might build the same thing. This exercise gets easier as you gain more experience.

Time for action – create an account

In order to download projects to our local computer, we need to create an account.

  1. From the Scratch home page, click the Signup link to create an account or go to http://scratch.mit.edu/signup.
  2. Enter all required information in the Create an account form.
  3. Click the sign up button to create the account.
  4. Read the terms of use at http://scratch.wik.is/Terms_of_use. It's a link in the page footer.
  5. Welcome to the Scratch community.

What just happened?

We created an account at the Scratch web site. We can share our projects, but for now, we need an account so that we can download a project.

Abide by the terms of use

It's important that we take a few moments to read the terms of use policy so that we know what the community expects from us. Directly from Scratch's terms of use, the major points are:

  • Be respectful
  • Offer constructive comments
  • Give credit
  • Help keep the site friendly

Time for action – download a project

Without further hesitation, find a project you like and download it:

  1. Click the link to download the project.
  2. When prompted by your web browser, save the project to your computer.
  3. Next, open the project in Scratch. From the Scratch interface, click on the Open button.
  4. In the Open Project dialog box, navigate your filesystem and open the project you just downloaded.

What just happened?

We found a project we liked, we downloaded it, and then we opened it. As you review the project code in the Scratch interface, you can begin to answer the question, "How does it work?" You did remember to think like a designer and not a user, right?

Now that you saw the code, are you surprised by what you saw? Don't worry about whether or not you understand what it all means. You will.

Our mothers taught us to share, which brings us to the other implicit concept in this exercise. The Scratch community also encourages us to share, and each project on the Scratch web site is available under a Creative Commons Attribution-Share Alike License.

Creative Commons

The Attribution-Share Alike license is simple in concept and practice. When you find an interesting project, feel free to download it and remix it to create something new. Then credit the original author. The project notes make a great place to credit the work of others. We can make several projects to share with the Scratch community, and hope that our work inspires someone else to create something new and unexpected.

For more information about Creative Commons licensing, visit www.creativecommons.org.

Have a go hero

Modify the project you just created in some way. If you're not sure where to begin, try inputting different values into the blocks to see what happens.

There is no right way, just exploration.

Summary

This two-part article helped us feel comfortable working with Scratch by covering some basic concepts. Each Scratch project contains sprites with costumes, scripts, blocks, and a stage with backgrounds.

In this article, we built a couple of sample scripts to demonstrate how we can control the sprites in a project. For example, we used motion to move the sprites, forever loops to keep the sprite moving, and broadcast messages to coordinate the actions of multiple sprites.

We finished the article by sampling and remixing projects from Scratch's sample projects and from the Scratch web site. We also discovered that Scratch promotes sharing as a way to learn and encourage ideas.

If you have read this article you may be interested to view :

Scratch 1.4: Beginner’s Guide Learn to program while creating interactive stories, games, and multimedia projects using Scratch
Published: July 2009
eBook Price: $23.99
Book Price: $39.99
See more
Select your format and quantity:

About the Author :


Books From Packt

Spring Web Flow 2 Web Development
Spring Web Flow 2 Web Development

WordPress Plugin Development: Beginner's Guide
WordPress Plugin Development: Beginner's Guide

Seam 2.x Web Development
Seam 2.x Web Development

Magento: Beginner's Guide
Magento: Beginner's Guide

Pentaho Reporting 1.0 for Java Developers
Pentaho Reporting 1.0 for Java Developers

Grails 1.1 Web Application Development
Grails 1.1 Web Application Development

Moodle Course Conversion: Beginner's Guide
Moodle Course Conversion: Beginner's Guide

C# 2008 and 2005 Threaded Programming: Beginner's Guide
C# 2008 and 2005 Threaded Programming: Beginner's Guide

Code Download and Errata
Packt Anytime, Anywhere
Register Books
Print Upgrades
eBook Downloads
Video Support
Contact Us
Awards Voting Nominations Previous Winners
Judges Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
Resources
Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software