Module 2 - Introducing Scratch


Scratch is a great, free, introduction to programming, mainly aimed at children. It's from MIT and is designed to make it easy for anyone to program a computer, it's especially good for simple games and music.

There are other alternatives worth checking out, I've got a list of kids programming environments on the site home page.

I wrote this introduction after teaching a class of 9 year old kids how to program at a local school.  Obviously you should familiarize yourself with Scratch before attempting to teach it!

There's a new, web based, version out and these instructions were written for the older version, but I believe they still mostly apply.

I suggest you start by show a demo of one of the games from the Scratch installation to show what can be achieved (if you select Open... from a new install of Scratch you'll find a bunch of projects to show).
 
Then show a quick demo of the basic game they are going to develop this session.
 
Now open Scratch and go through the various bits of the UI, it's helpful to name the various areas so that they know what you're talking about (especially the stage and the blocks palette).

Then demonstrate some of the features:
  1. Dragging and moving the cat using the mouse (pun intended).
  2. Making the cat bigger, smaller and duplicating.
  3. Note the 4 main areas of the screen:
    1. The Blocks Palette with Motion, Looks etc: going to cover that in a mo.
    2. The Scripts area: this is where your scripts will run and where you can control the costumes of the sprits, top you can rename (show changing name to cat).
    3. The Stage (top right): this is where your project runs, note little TV bottom this runs it full screen.
    4. The Sprint List (bottom right): Lets you pick which sprite you want to work on, or the stage.
  4. Go through the Blocks Palette tabs one by one; quite quickly as we are going to let them experiment:
    1. Motion: show you can double click an action to affect the cat.
    2. Looks: show changing costumes with double click
    3. Sound: Note that some things don't work just on double click they need to be in a script
    4. Pen: Leave for now, we're not going to use the pen much.
    5. Control, Sensing, Numbers and Variables: Leave for a bit.
  5. Back to the Motion tab for some more details:
    1. Note that each sprite has a direction, it starts off pointing right.
    2. Double click on the Move 10 steps.  Note that the cat only moved a little bit, that's because the 'stage' is divided into tiny squares (pixels) there are 480 squares left-to-right and 360 top-to-bottom, try changing the 10 to 100 steps and double click, see how it moves about 1/4 of the screen.
    3. Note that white areas within blocks are places you can type or choose from a list, basically stuff you can change.
    4. Now turn to 0 (up) and do some steps.
    5. Also show turning 15 degrees to show it doesn't have to be just right angle turns.
  6. Show how you can combine blocks by dragging them on top of each other, make the cat dance with something like:  
                     
 
Now get them to open up Scratch and let them play around for a few minutes with the Motion, Looks and Sound tabs; tell them no harm can come, go wild!
 
Starting their first game
Now we write a script, I run through this with the whole class step by step.

I'm going to write this out in excruciating detail, but after this I'll assume you can put a script together and just show pictures of the finished scripts unless there's a point I'm trying to get across.
  1. Click New... to create a new project.
  2. Click on Sprite 1
  3. Rename it cat.
  4. Go to the Control tab.
  5. Note that so far nothing happens unless we double click on the block, now we are going to make stuff happen automatically.
  6. Note that the yellow 'hats' are always where scripts will start and each sprite can have many scripts.
  7. Drag the When <space> clicked  hat onto scripts [Note Concept: Events]
  8. Choose right arrow from drop-down.
  9. Change to Motion tab
  10. Drag point in direction 90 and snap onto hat.
  11. Drag move 10 steps and snap onto point in direction.
  12. Show clicking the green flag to run the scripts.
  13. Press right a few times.
  14. Note: Cat gets stuck at the edge.
  15. Click Duplicate tool
  16. Drag on the when right arrow pressed hat  to create a copy.
  17. Change right arrow to left arrow.
  18. Change 90 to -90 (right).
  19. Click green flag to go.
  20. Notice cat flips upside down when you go left.
  21. Use the <-> icon at top of central area to constrain to left/right only.
  22. Without showing them get them to add up and down arrows.

Changing the background (stage)

That's a bit boring, let's change the background:
  1. Click 'stage'
  2. Choose backgrounds tab
  3. Choose outdoors, brick-wall-1.

Adding an opponent

It's not a very fun game so far, let's add an opponent:
  1. On bottom right choose the import sprite icon
  2. Choose animals then bat1-a.
  3. Rename it to bat.
  4. Shrink it down a few times with the shrink tool.
Add a script: When (flag) clicked, forever, move 10 steps, if on edge bounce.

Show it working, bit dull it just goes side to side, show the little blue line on the sprite in the middle section, drag it so that it's at some jaunty angle, then the bat will bounce around all over the stage.

Changing costumes

Bat looks odd, it's not moving its wings.
  1. Go to Costumes tab and import the bat1-b costume.
  2. Show how clicking from one to the other changes the look.
  3. Back to Scripts
  4. From Looks drag in next costume block below move 10 steps.
  5. Try it
  6. Hmm, wings moving too quickly, from Control tab drag in a wait block and set to 0.05 seconds.
Get the kids to get the cat to walk properly by adding in next costume blocks for each direction (when I did it the cat already had the second costume). 
 
Comments