Wednesday, May 31, 2017

Byte: Raspberry Pi - Animation in Scratch student workbook



Student Workbook: Animation in Scratch

In this lesson, we are going to use Scratch to introduce the basics of programming by creating an animation of the first scene of the Shakespeare play Macbeth. First, we need to create a new project in Scratch.

Start > Programming > Scratch

These menu commands will start a new session of the Scratch editor. Maximise the window and give your project a name:

File > Save As
New Filename: Macbeth [yourname][date]

Now that you have saved your project file, it’s time to get familiar with the Scratch interface. Underneath the menu bar are three columns, split into several panes. The left-most column allows you to choose code blocks for your scripts. These can be dragged and dropped into the scripting window (the large, central pane of the interface). The code blocks all have colours to help you find different categories of commands. Dark blue blocks control the motion of sprites, Purple blocks change the appearance of sprites and allow you to show the user text, Orange blocks allow you to start and stop scripts or insert loops, and so one. When we start writing our animation, the colour of the text will show you what kind of block it is and which category it belongs to. Finally, the two panes in the right-most colour are the preview area, which allows you to test the output of your code, and the object pane, which allows you to select the stage and any sprites used by the project.

Where to get started, then? No play would be complete without a suitable stage, so click on the Stage icon in the object pane. You should see the central scripting pane refresh to show that the Stage is the object in focus. Click the Backgrounds tab and you should see that background1 is the only image file in the list of backgrounds for the stage. Since plain white is a bit dull as a background for a play, let’s find something rather more colourful and interesting

New background: Import

This command button will open up a pop-up window: Import Background
You can select any image you like from one of the sub-directories, but the woods background is appropriately spooky.

Nature > woods > OK

Click on the cross icon button on the list beneath background1 to delete it, and the stage is set!


Act I Scene 1 of Macbeth features three witches, so we need two more sprites. Scratch the Cat is also not terribly mystic, so we’ll need to change the costume of Sprite1. Select Sprite1 on the object pane to refresh the scripting window, and click the Costumes tab.

New costume: Import

This will allow you to choose a new look for Sprite1 in the Import Costume window.

Fantasy > witch1 > OK

Click the cross icon buttons next to costume1 and costume2 to delete them.

Now we can add two new sprites to represent the other two witches. Since there is only one witch costume available, we’ll have to pick something different for our other two sprites, otherwise the scene’s dialogue might get a bit confusing. The central button between the preview area and the object  will allow us to select a premade sprite. It looks like a star with a file folder sitting on top.

New sprite: (Import Sprite from File)
Fantasy > fairy > OK
New sprite: (Import Sprite from File)
Fantasy > unicorn1 > OK

Hurrah! Our three ‘witches’ are on the stage! Now we need to tell them what do, and the drama can begin! Select Sprite1 in the object pane and the Scripts tab on the coding area.

Each sprite will need two scripts. One will reset the animation and the other will execute when the green flag is clicked, to play out the scene. At the moment, all the sprites are clustered together in the middle of the stage, so the reset script will have to move the sprites to the edge, so that they can make a grand entrance from Stage Left.

Control

In the left hand column, you should now see all the code blocks for the control functions and commands. Scratch is a visual programming language that allows users who are new to programming to build scripts like a LEGO kit, by slotting together functions one at a time. We’ll start by coding the reset script. Drag and drop the when space key pressed block into the coding area. Note that I’ve highlighted space in pink because this is a value that can be changed by the user – some user-configurable values can be selected by drop-down list, or be entered as free text. Whenever you may have to change a value in a code block, I’ll highlight it this way in the instructions. Now whenever the space key is pressed, Scratch will execute any of the functions or instructions attached to this code block.

Motion

The dark blue Motion functions allow you to move sprites around the stage. Set the starting position for Sprite1 by attaching the following blocks to the script.

go to x: -500 y: 10                             (x is the horizontal coordinate, y is the vertical coordinate)
point in direction 90                       (this resets the sprite to face to the right)

The reset script can be triggered at any time, so we need to add a final command from the Control category to stop any scripts that are running in the background, otherwise things might get horribly out of sync.

stop all

Notice that the bottom of the stop all block is flat. This means that no further commands or functions can be added to this script. We need a separate script to tell Sprite1 what to do when our scene starts.

when GreenFlag clicked

The green flag is used as the starting trigger for all of the main scripts for the three ‘witches’, and is used this way for the majority of Scratch projects. In our multi-sprite animation, it will be very important to pay attention to the time delays between lines of dialogue, otherwise the whole scene will become disjointed and not make sense. To allow our characters to speak, we will need to use the say function from the Looks category. Add the following code to your new script.

glide 2 secs to x: 150 y: -14                           (enter, Stage Left!)
say When shall we three meet again? In thunder, lightning or in rain? for 4 secs               (1st line)
wait 8 secs                          (pause to let the other two witches speak)
say Where the place? for 2 secs                 (2nd line)
wait 6 secs                          (pause to let the other two witches say their next lines)
say I come, Graymalkin. for 2 secs           (3rd line)
wait 1 secs                          (dramatic pause!)
say Paddock calls anon: Fair is foul, and foul is fair, Hover through the fog and filthy air. for 6 secs                                       (final line of scene, said by all)
turn Clockwise 45 degrees          (get ready to leave the stage)
wait 0.3 secs                      (short pause)
glide 2 secs to x: 1500 y: 500                        (flounce out, Stage Right!)

The scripts for the other two sprites are broadly similar in function, they just have different stage directions and their own lines of dialogue. They also have slightly different timings to fit their dialogue into the overall sequence of the scene. Select Sprite2 on the objects pane, click on the Scripts tab and add its reset and main scripts, starting with the reset script, as below:

when space key pressed                               (start of reset script)
go to x: -500 y: 100
point in direction 90
stop all                                                                 (end of reset script)

when GreenFlag clicked                                                 (start of main script)
glide 2 secs to x: -130 y: 111                         (enter, Stage Left!)
wait 4 secs                                                          (wait for first line)
say When the hurly-burly’s done, when the battle’s lost and won. for 4 secs        (1st line)
wait 6 secs                          (pause to let the other two witches say their next lines)
say Upon the Heath. for 2 secs (2nd line)
wait 7 secs                          (pause to let the other two witches say their next lines)
say Paddock calls anon: Fair is foul, and foul is fair, Hover through the fog and filthy air. for 6 secs                                       (final line of scene, said by all)
turn Clockwise -45 degrees         (get ready to leave the stage)
wait 0.3 secs                      (short pause)
glide 2 secs to x: -500 y: -200                       (flounce out, Stage Left!)

Finally, select Sprite3 on the objects pane, click on the Scripts tab and add its reset and main scripts, to complete our scene!

when space key pressed                               (start of reset script)
go to x: -500 y: -50
point in direction 90
stop all                                                                 (end of reset script)

when GreenFlag clicked                                                 (start of main script)
glide 2 secs to x: -150 y: -96                         (enter, Stage Left!)
wait 8 secs                                                          (wait for first line)
say That will be ere the set of sun. for 4 secs        (1st line)
wait 4 secs                          (pause to let the other two witches say their next lines)
say There to meet with Macbeth. for 2 secs         (2nd line)
wait 3 secs                          (pause to let the other two witches say their next lines)
say Paddock calls anon: Fair is foul, and foul is fair, Hover through the fog and filthy air. for 6 secs                                       (final line of scene, said by all)
turn Clockwise -180 degrees      (get ready to leave the stage)
wait 0.3 secs                      (short pause)
glide 2 secs to x: 500 y: 500                          (flounce out, Stage Right!)

Save your project and click on the icon on the far right of the task bar to enable the Full Screen viewing mode (the icon looks like a projection screen). Press the space key to prepare your actors for their big moment, and when you’re ready, break out the popcorn (are you even allowed to eat popcorn at the theatre?), click the green flag and sit back to enjoy your Shakespearean masterpiece!


Congratulations! You’ve just made a Scratch animation! But how could you make it better? Here are some things that you could try…

·         Can you add dramatic sound effects to your scene?
·         Can you make the scene more interactive by having each line of dialogue bound to a separate key, so that you can control the timing of the scene?
·         Can you make the witches creepier by having them change costume after they speak a line of dialogue?
·         Can you add randomly moving ghosts to the background of the scene?
·         Can you script a longer scene, such as Act IV Scene 1 or Act V Scene 4 from Macbeth (or another play) with more speaking parts?
Post a Comment