GETTING STARTED - A MODULE FOR TEACHERS

This module covers the following:

✔ The Integrated Development Environment of
(IDE) of Scratch
✔ Basic Programming Blocks
1
GETTING STARTED - A MODULE FOR TEACHERS

This module covers the following:

✔ The Integrated Development Environment of
(IDE) of Scratch
✔ Basic Programming Blocks
2
MODULE FOR TEACHERS
This module is a quick starter guide for teachers
with/without experience in programming.
Explanations were simplified and brief to help the
readers understand the concepts faster.

Scratch MT1 3
CONCEPTS of game making
In order to create a game, you must
remember the 3 P’s

PLAN – Conceptualizing your game

Program – Coding your game

PLAY – Play the game that you built and look for
rooms for
improvement.
Scratch MT1 4
USEFUL TERMS TO REMEMBER
PROGRAMMING
In order to turn your imaginations into life, you
must create a program/code for your game.

PROGRAM
It is a collection of rules and instructions that a
game maker can use to tell the computer on how
his/her game should work. A program is a
representation of an algorithm.
Scratch MT1 5
WHAT IS AN ALGORITHM?
An algorithm is a “list of steps” to follow
in order to solve a problem
A recipe is a good example of an
algorithm because it tells you what you
need to do step by step. It takes inputs
(ingredients) and produces an output
There is usually (the
morecompleted
than onedish).
way to solve a problem.
There may be many different recipes to make a certain dish
which looks different but ends up tasting the same when all
Get and done. The same is true for algorithms.
is said
ingredie Mix Bake
nts
The “bake” process cannot be ahead of the “mix” process.
A cake can only be produced if the step by step process is
followed.
Scratch MT1 7
INTRODUCTION TO SCRATCH
Scratch is a visual programming language that we
can use to animate characters, set the rules of our
games, and provide players the ability to play the
games that we have created.

Scratch MT1 7
The ide of scratch

8
IDE OF SCRATCH
Menu Bar

Stage
Blocks Palette

Script Area

Sprite List

Scratch MT1 9
IDE OF SCRATCH
CHOOSE THE GROUP OF COMMANDS YOU NEED HERE

Scratch MT1 10
IDE OF SCRATCH
THE BLOCKS FOUND ON PANELS ARE CALLED PROGRAMMING BLOCKS

PRO TIP: In Scratch, you can guess the function of a

programming block by its name or by reading the text written on
it

Scratch MT1 11
IDE OF SCRATCH
SPRITE
The cat below is a sprite. It will do anything you
program it to do.

Scratch MT1 12
IDE OF SCRATCH
SCRIPTS AREA
This is where you drag the programming blocks to
create a program.

Scratch MT1 13
IDE OF SCRATCH
STAGE
This is where you see the effect of your codes.

Scratch MT1 14
IDE OF SCRATCH
In this section, you can
apply these following
changes to your sprites:

• Direction
• Name
• Position (x and y) in
the Stage
• Size
• Visibility (Show) in the
Stage

Scratch MT1 15
IDE OF SCRATCH
Change the direction of the sprite where it is facing!

2 3 4

1.) Click the 2.) This should appear on

highlighted area. your screen.

Scratch MT1 16
IDE OF SCRATCH
FOR SETTING THE SPRITE’S
DIRECTION
FUNCTIONS
1. Alternative way of changing the
value by rotating the arrow
around the dial. You can use
this instead of typing.

2. Sets the rotation style to “all

around”

3. Sets the rotation style to “left-

right”
NOTE: By setting a rotation style, except “all
around”, it makes the sprite appear as if it is
4. able
only Setstothe rotation
face/point style
specific to “don’t
directions, but in
reality, it is pointing depending on the value that
rotate”
you have typed or where you have rotated the
arrow on the dial..
Scratch MT1 17
IDE OF SCRATCH

3.) Choose between 2, 3, 4.) Use the dial or type a 5.) Observe what happens.
and 4 new value for your sprites
direction.

Scratch MT1 18
IDE OF SCRATCH
You can change the name of your sprite by clicking the name
after “Sprite” and then typing a new name.

Scratch MT1 19
IDE OF SCRATCH
You can reposition your sprite by changing its coordinates. Click
the values beside the letters “x” and “y” in the highlighted area
and then change them. Kindly observe what happens to the
sprite.

This topic will be further discussed in the following modules.

Scratch MT1 20
IDE OF SCRATCH
You can also move your sprites in the Stage by simply
dragging them with your cursor!

The value of the

coordinates will also
change if you drag the
sprite to a new position.

Scratch MT1 21
IDE OF SCRATCH
Let’s now resize your sprite! You can make it smaller or
bigger by changing the value in the highlighted area. You can
do this by clicking the value beside “Size”, then typing a new
value.

Scratch MT1 22
IDE OF SCRATCH
Let’s try to make your sprite appear and hide it on your
Stage! Just click any of the two buttons from the
highlighted area and observe what happens.

Scratch MT1 23
IDE OF SCRATCH

There are three buttons

above the Stage which
can help you in making
your own game!

Scratch MT1 24
IDE OF SCRATCH
This allows the sprite’s resizing and positioning
settings to be shown on your screen.

Scratch MT1 25
IDE OF SCRATCH
This minimizes the settings (except for the x and
y coordinates and the sprite’s name) and
enlarges the scripts area.

Scratch MT1 26
IDE OF SCRATCH
This allows you to view the stage in full screen.

Scratch MT1 27
PROGRAMMING BLOCKS

28
EVENT BLOCKS
These programming blocks are commonly used as “triggers” to
execute a set of commands. They may also be used to create
events by broadcasting messages which will be discussed on
the future modules.

Scratch MT1 29
MOTION BLOCKS
These programming blocks are used for putting a sprite in
motion and for positioning it. There are various motion
programming blocks; some are used for making the sprite
move forward and backward, some are used for making a
sprite turn, some are used for making the sprite point towards
a specific direction, and many more. In short, everything that
has to do with MOTION can be found in the palette of MOTION
BLOCKS.

Scratch MT1 30
A VERY BASIC PROGRAM
Click the cat sprite to program it. Copy the program below,
then click the green flag on the stage area.

When the green flag has been

clicked…

move the sprite 10 steps

Scratch MT1 31
ANOTHER VERY BASIC PROGRAM
Click the cat sprite to program it. Copy the program below,
then press the a key on your keyboard.

When the a key has been pressed…

move the sprite 10 steps

Scratch MT1 32
motion BLOCKS
POSITIVE & NEGATIVE STEPS

You may change the number of steps that the

sprite will perform once an event happens. By
putting positive values, the sprite will head
towards the current direction that it’s facing,
and will go to the opposite direction, when the
value is negative.
Scratch MT1 33
ASSIGNMENT
1. Attach the remaining motion blocks to the
event block that we tried earlier. Take note of
their functions.

2. Try the event blocks that we did not try earlier.

3. Try putting negative values on the move block.

Scratch MT1 34
Additional information
Inputting positive values in the move block will not always
make a sprite move to the right. In the same way, inputting
negative values will not always make your sprite move to
the left.

Positive values in a move block make a sprite move

FORWARD towards the direction where the sprite is
currently pointing/facing.
On the other hand, negative values make a sprite move
BACKWARD towards the opposite direction where the sprite
is currently pointing/facing.

Therefore, both positive and negative values may make a

sprite move towards the same direction depending on
which direction the sprite is pointing at.
Scratch MT1 35
Additional information
There are some programming blocks that have a dropdown
menu so, if you can’t find the exact programming blocks
that will be used in the future lessons, try referring to the
“New Programming Blocks” or “Recall” section of the Peonz
Scratch modules, and read the functions of the
programming blocks carefully. If you notice that a
programming block has a dropdown arrow or has multiple
functions, that may be the one that you are looking for.

Scratch MT1 36
LOOPING/REPEATING A PROGRAM
We can repeat a set of commands for a specific number of
iterations using the REPEAT block, or we can also loop it using
the FOREVER block.

Scratch MT1 37
Try this!

Scratch MT1 38
WAIT BLOCK
This is used for putting a delay in between other programming
blocks.

TRY THIS!

Scratch MT1 39
SENSING BLOCKS
Used for sensing things that can be used as a condition for
“decision making” of a sprite.

Scratch MT1 40
If-else PROGRAMMING BLOCK
Put the condition
here

Put here
what you Put here
want the what you
sprite to want the
do when sprite to
the do when
condition the
is NOT condition
met. is met.
Scratch MT1 41
TRY THIS!
Is the sprite touching the mouse-
pointer?

If yes, it will stop from moving

Otherwise, the sprite will

continue on moving

NOTE: You may put another if-else block inside an if-else block.
Scratch MT1 42
INSERTING SPRITES

43
Inserting sprites

Hover your mouse over

the “Choose a Sprite”
button to view other
options.

Scratch MT1 44
Inserting sprites
U p l o a d - This allows you to
upload a sprite

S U R P R I S E - This allows you to

insert a mystery or SURPRISE sprite
in your project.
P A I N T - This allows you to draw
and color your own sprite.

C H O O S E - This allows you to

browse for sprites.

Scratch MT1 45
Inserting sprites
PaIntIng your own sprIte

1) Click the paint button.

2) You will be directed to
“costume” section
3) Paint your sprite.

Scratch MT1 46
Inserting sprites
The drawIng sectIon

Scratch MT1 47
Inserting sprites
The drawIng sectIon

Used for selecting objects

Used for reshaping

Used for painting/drawing

This panel is used for changing colors,
outlines, and size of your creations.
Eraser

Fill color

Used for inserting text

Line

Circle
Square

Scratch MT1 48
Inserting sprites
Once your done with your painting, click on “Code” to
create a program for your new sprite.

Scratch MT1 49
INSERTING BACKDROPS

50
INSERTING A BACKDROP
Backdrops add life to our game. They can make
your game more realistic or more fantastic. In
scratch, you may draw your own backdrop, but
you can also import an existing image from your
computer and set is as a backdrop for your
game.

Scratch MT1 51
PAINTING A BACKDROP
1. Click the “Stage” section.

Scratch MT1 52
PAINTING A BACKDROP
2. Click “Backdrops” located beside the “Code”
section.

Scratch MT1 53
PAINTING A BACKDROP
3. Paint a backdrop the same way that you paint a
sprite.

Scratch MT1 54
IMPORTING A BACKDROP
1. Point your mouse pointer to “Choose a backdrop
button”

Scratch MT1 55
IMPORTING A BACKDROP
2. Click the “Upload Backdrop button”

Scratch MT1 56
IMPORTING A BACKDROP
3. A window will appear. Locate your image and
select it.

Scratch MT1 57
IMPORTING A BACKDROP
DONE!!!

Scratch MT1 58
ACTIVITY: CREATING A GAME

59
HUNGRY MONKEY

Create a game where the

Monkey will follow the
mouse cursor. If it
touches one of the
Bananas, the touched
PRO TIP: You may try to do this on your own
sprite should disappear. before looking at the steps on the next
Finally, if it touches the pages.
Scratch MT1 60
ACTIVITY – creating the design
For the first step, create your own backdrop with a
forest theme. You may use the backdrop below as
reference.

Where are
the
bananas?

Scratch MT1 61
ACTIVITY – creating the design
Insert the monkey and banana sprites!

Just insert
sprites

Scratch MT1 62
ACTIVITY - output
As for the result of this activity, you should have an
output similar to the picture below.

Scratch MT1 63
CHALLENGE ACTIVITY - programming
Let’s start making the program! Click the Monkey
sprite and copy the program below.

This program will allow

the monkey to go
around the Stage.

This is an
easy task
to do

Scratch MT1 64
CHALLENGE ACTIVITY - programming
For the next one, click the Bananas sprite and copy the
program below.
This program will make
the banana disappear if
the monkey touches it.

Bananas
please

Scratch MT1 65
CHALLENGE ACTIVITY - PROGRAMMING
It seems like the monkey is not happy with few
bananas. So let’s multiply the bananas!

Click or place the Right click the

pointer on the sprite and click
banana. duplicate.

More There you have it!

bananas You now have two
please :( Bananas sprites.

Fact: It’s not just the sprite that’s been copied, but
also its program.
Scratch MT1 66
CHALLENGE ACTIVITY - PROGRAMMING
To spice up the game, add two more Bananas sprites to
your game!

PRO TIP: Try to use the

duplication process
in the previous
page so you can
easily add new
ones. The more,
the
merrier!

Scratch MT1 67
CHALLENGE ACTIVITY - PROGRAMMING
If your sprites are positioned randomly, kindly reposition
them according to the picture below:

Arrange
them so
we can
play easily!

NOTE: You may resize your s

Scratch MT1 68
CHALLENGE ACTIVITY - PROGRAMMING
Let’s now play your created game! Click the for a full
screen experience and then click the green flag ( ) to
start the game!

Use your
mouse to move
and help the
monkey collect
the bananas.

Scratch MT1 69
CHALLENGE ACTIVITY– program analysis - MONKEY

Starts the program when the green

flag is clicked.

Loops the program.

Makes the sprite point at

the cursor.

Moves the sprite with every movement of

the mouse.
Makes the sprite bounce when
it touches the edge of the
playing field. I see now

Scratch MT1 70
CHALLENGE ACTIVITY– program analysis - BANANA

Starts the program when the green

flag is clicked.

Shows the sprite when the

program starts.
Runs the blocks inside it
forever.
Is it touching the
Monkey?
If yes, hide the sprite.

So that’s
why it’s
like
magic!

Scratch MT1 71
Saving & Loading a program

SAVING A PROGRAM: LOADING A PROGRAM:

1. Click ”File” 1. Click ”File”
2. Click “Save to your computer” 2. Click “Load from your computer”
3. Select a destination 3. Select the destination where you
4. Click the save button. saved your program
4. Select your program to load it

Scratch MT1 72
Image sources
• https://www.pngkit.com/view/u2e6a9o0u2e6o0u2_logo-scratch-scratch-cat/
• https://play.google.com/store/apps/details?id=com.mojang.minecraftpe&hl=en_
US
• https://www.stickpng.com/img/games/angry-birds/angry-bird-icon
• https://pngimage.net/arquera-png-1/
• https://pvzcc.fandom.com/wiki/Mini_Peashooter(PvZ:TLC)
• https://www.freepngimg.com/png/35034-adventure-time
• https://pngimage.net/imagenes-png-tumblr-flechas-6/
• https://www.seekpng.com/ipng/u2w7y3q8w7w7y3u2_medium-image-girl-with-l
aptop-clipart/
• https://clipartart.com/categories/left-and-right-arrow-clipart.html
• https://lakers.newssurge.com/gallery/v/kobe-bryant/Kobe+Bryant+hunkers+do
wn+on+defense+vs+the+Thunder.JPG.html
• https://www.clipart.email/clipart/one-more-clipart-86163.html
• https://imgbin.com/png/bgjyeUY1/creativity-concept-illustration-png

Scratch MT1 73