Chapter 02

Scratch Basics
 2-1

Understanding and using scratches

A.M P.M
Sessions 1~3/6 sessions in total Time
O

Learning • You can install and use scratch programs on PCs.

Objectives • You can program planned content using scratches.

• To learn about Scratch screen composition (using web

editor)
–– Scratch basic components (stage, sprite, script, shape,
sound, etc.)
• To sign up for Scratch (Using Scratch on the web)
Learning • To install offline editor
Activities • To creating and saving a Scratch project
• To coding using blocks in the Scratch palette
–– Utilizing motion and shape blocks
–– Utilizing event and sound blocks
–– Utilizing control and detection blocks
–– Utilizing operation and variable blocks

Material -
34 Chapter 02 Scratch Basics

Unit

01 Scratch UI components

Menu: You can change your language, save and upload

files. You can change the name of the scratch working
file and save it. By clicking ‘Tutorials’, you can follow
an easy and fun example.
9

Area tab : 8
2
[Code] Tab: You can code
by dragging the command Code Area: In Scratch,
block from the palette. code means finding
[Costumes] Tab: You can and putting together
edit the costumes to be blocks of instructions
used in sprite. to pass to the
[Sound] Tab: You can edit computer. The space
the sound to be used in where you create these
sprite. codes is called the
1 code area.

Block palette: You can

find various blocks such
as actions, sounds, events,
and operations. In addition
to the default block, you
can also add ex­tensions.
Block pallets are visible in 12
the Code Area tab.
Backpack: You can store block
combinations that are likely to
be reused.
 2-1 Understanding and using scratches 35

Scratch is a graphic-based educational programming environment developed by MIT

Media Research Institute and is used by all age groups in more than 150 countries.
Let’s learn about the Scratch screen and its components.

CHAPTER

Run( ) and stop( ) button: 01

[Run] Green flag (program run)
[Stop] Stop the running program. 02
UserName: You can check
My Stuff: You can check 03
your profile, my stuff,
the saved work project.
account settings, and log
04
out immediately.
10 11
05

6 7 Adjusting the stage size button:

06
It is a function that can adjust
the size of the stage screen. From 07
the left, you can see the stage on
the smallest, normal, and largest 08
screens.
09
3 Stage: A place to check the execution
of the program. The code created in 10
the script area is executed. It's the
same screen where the actual project 11
is running.
12

13
5 Stage control window: You can specify
the background of the stage. You can 14
also add the background provided by
Scratch or draw it yourself. 15
4

Sprite control window: You can modify the information

about sprite. Sprite means a Cat character that is the
subject of the stage area.
You can also change the sprite by clicking the button.( )
36 Chapter 02 Scratch Basics

Unit

02 Preparing for Scratch

Scratch on the Web

Go to https://scratch.mit.edu/ to start Scratch
1 2 3

❶ Create : You can create a scratch project.

❷ Explore : You can view and run projects that others have shared with you.
❸ Join Scratch : You can sign up for Scratch.(When signing up, you will need
personal information such as your date of birth, gender, and email.)
If you [Click] ‘Join Scratch’, you can proceed while checking the following screens in turn.

[Click] ‘Username’ blank - [Enter] [Click] Select country -

your name - [Click] ‘Password’ blank [Choose] your nationality
- [Enter] Password - [Click] ‘Type
password again’ blank - [Enter] your
Password - [Click] ‘Next’
 2-1 Understanding and using scratches 37

CHAPTER

In addition, you will need to [Choose] your date of birth and gender, and an email 01
is required. [Click] ‘Create Your Account’ to complete the registration.
02

You will be automatically connected to the Scratch website while logged in. 03

04

05
1

2
06

❶ If you want to share your project ❷ Now that you have verified your 07
and leave a comment on the mail, let’s go back to the Scratch
Scratch website, you will need 08
website. [Click] the ‘OK, Let’s
to check the verification email go’ button.
sent to the email address you 09
entered when you signed up
as a member. In your mailbox, 10
[Click] the English link in the
email sent by Scratch. 11

12

13

14

15

[Click] ‘Create’ menu at the top left A screen appears where you can
create code (assembled command
blocks) as shown above. The name
of this screen is Editor.
38 Chapter 02 Scratch Basics

Scratch in the Offline Editor

You can use Scratch even without an internet connection by downloading the Scratch app.

[Click] ‘Download’ at the bottom of [Choose] your computer’s operating

the Scratch homepage system

❶ [Click] your operating system (mostly Windows)

❷ [Click] ‘Download’

When the following screen appears, Installation is complete.

[Choose] ‘Anyone who uses this
computer (all users)’ - [Click] ‘Install’ [Click] ‘Finish’
 2-1 Understanding and using scratches 39

CHAPTER

01

02
When Scratch is executed, the The Scratch app (Scratch Offline
following screen is displayed. Editor) is running. Now, you can use 03
[Choose] ‘I agree’ - [Click] ‘Close’ the Scratch app without internet.
04

05

Creating and Saving a Scratch Project 06

First, let’s make something because we need to mark that it’s a file I created.
07

08

Block Palette Code areas 09

10

11

12

13

14

15

[Drag] a block from the Block Palette - [Drop] the block on the Code Area in the
middle. → We will refer to this process as [Drag-and-drop] from now on.
40 Chapter 02 Scratch Basics

❶ [Click] the ‘file name box’ (now, it’s n ‘test’.) - [Enter] the name of the file you
want to replace
❷ [Click] the ‘File’ menu at the top left - [Choose] ‘Save now’

Then, you can check later even if you close the window you are working on or log
out.

account

[Click] ‘See inside’ to work again

[Click] ‘your account name’ area (The ‘My Stuff ’ page looks a little
box in the upper right corner - different from the menu bar.)
[Choose] ‘My Stuff ’

Or [Click] the Folder Icon ( ),

You can move the ‘My Stuff ’ page
right away.
 2-1 Understanding and using scratches 41

Unit

03 Coding with Scratch

CHAPTER

01

02
Planning a scratch program
03
Let’s make a program that moves cats and hedgehogs. When the cat approaches the
hedgehog, the cat makes a sound because of the thorns, and the hedgehog and the cat 04
go in different directions. Let’s take a closer look at each movement.
05
Cat Hedgehog
Execution result 06
Costume Code Costume Code

Move with keyboard 07

(You can adjust the
Walking Lying down - 08
direction with the
keyboard.)
09
When it touches a
hedgehog, 10
Surprised Lying down -
The reaction of
11
saying "Meow!"

12
A reaction that
Surprised Step back Cowering makes it think 13
Hmm...
14

Walking in 15
Move with
a different Lying down Move seats
keyboard
direction

If you look closely, you can see that the shape of the mouth changes when the cat
touches the hedgehog.
42 Chapter 02 Scratch Basics

Make the sprite move

[Click] ‘Choose the Sprite’ [Click] on the hedgehog sprite

Rename Sprite1 to ‘Cat’

So, let’s code in Scratch so that
when the cat touches the hedgehog,
it makes a sound because of its
[Click] on the sprites to place them thorns, and when the cat moves
in the proper place. away, the cat doesn’t make a sound
either.

TIP What is Sprite?

Programming language (Code) is a word that computers can understand. It is not difficult
to create a programming language in Scratch. You can fit the block in so that the computer
can understand it.
Scratch is a computer programming language that allows you to create your own games,
animations, etc. This programming language is used for 'Sprite', an object that moves on a
computer screen. In other words, the code of the scratch allows the sprite to move.
 2-1 Understanding and using scratches 43

Getting Started with Block Coding

Block explanation

Code runs always with an Event block ( ) CHAPTER

01
Whatever you put inside the ‘forever’ block repeats 02
itself forever. There’s no option to join anything at the
bottom, because a ‘forever’ loop never ends. 03

The ‘if ’ blocks use conditional expressions to decide 04

what to de next. To use them, put other blocks inside
their ‘jaws’. The blocks inside the ‘if ’ blocks will only 05
run if the answer to the conditional expression is true.
06

07
➊ [Click] on the Event
block palette 08
2
➋ [Drag-and-drop] a event
09
block ( )
1
10

11

12

13
[Click] on the Control block
14
palette - [Drag-and-drop] a
‘forever’ block 15
44 Chapter 02 Scratch Basics

[Drag-and-drop] a ‘if ~ then’ block in the ‘forever’ block

※ If you drag a block to the code area, a ‘shadow’ (or ‘white box line’ in case of a blank
space in the block) is created where the block can be inserted as shown above. If
you drop a block at this time, the block will be placed at that location.

Block explanation

This block checks if a key is being pressed. You can

choose which key to check for.

The ‘Motion’ blocks make sprites move.

Click the white window on the block and type in a
different number to change how far the cat moves.

[Click] on the Sensing block palette - [Drag-and-drop] a ‘key ~ pressed?’ block

※ If you drag a block to the code area, a while line is created where the block can be
inserted as shown above. At this time, if you drop it, the block is placed there.
 2-1 Understanding and using scratches 45

CHAPTER

01

02

03

[Click] the drop-down menu inside the ‘key~pressed?’ block - [Choose] ‘right 04
arrow’
05

06

07

08

09

10

[Click] on the Motion block palette - [Drag-and-drop] a ‘move 10 steps’ block in 11

the ‘if ’ block
12
※ If the conditional statement of the ‘if ~ then’ block is satisfied, the block in the ‘if ~
then’ block is executed. Now, when the right arrow is pressed, the cat moves 10 to 13
the right.
14
❶ [Click] the Run Icon ( )
15
❷ [Press] the right arrow key
1

∧ 2 Then, the cat moves to the

right.
< ∨ >
46 Chapter 02 Scratch Basics

So, how do I code it to make the cat go to the left?

[Drag-and-drop] a ‘if ~ then’ block - [Drag-and-

drop] a ‘key ~ pressed?’ block - [Click] the drop-
down menu inside the ‘key ~ pressed?’ block -
[Choose] ‘left arrow’ - [Drag-and-drop] a ‘move
10 steps’ block in the ‘if ’ block - [Click] the white
window - [Enter] ‘-10’

[Click] the Run Icon ( ) - [Press] the left

arrow key. It makes the cat go left.

By the way, when you press the left key,

the cat is looking to the right, so it looks
awkward.

TIP Making decisions

Tests of whether something is true or false can be used to tell the computer what to do
next. It will perform a different action depending on whether the answer is true or false.

‘if ~ then’ block ‘if ~ then ~ else’ block

If a conditional expression is ture, the blocks If the conditional expression is true, the first set
between the ‘if ~ then’ block’s jaws will run. of blocks runs. If not, the second set runs.
 2-1 Understanding and using scratches 47

Block explanation

You can choose to show a specific costume for your

sprite using the ‘switch costume to ~’ block.

CHAPTER

01

02

03

04

05
[Click] the ‘Costums’ tab in the
upper left corner 06
[Right click] - [Click] ‘duplicate’
07

08

09

10

11

12

13

[Click] ‘Flip Horizonal’ to change 14

[Click] on the Looks block palette -
duplicated comtum3 to the left
[Drag-and-drop] a ‘switch costume
15
to ~’ block in the ‘if ’ block
When the right arrow is pressed,
it changes to costume2, when the
left arrow is pressed, it changes to
costume3. (You can change the
costume name.)
48 Chapter 02 Scratch Basics

Right now you can only move left and right. Let’s add some blocks so we can move
up and down. How can I make it move up and down?
Block explanation
Coordinates are used to move a sprite to a particular spot on the
stage. It doesn’t matter how near or far away the spot is. ‘change y
by 10’ block makes sprite’s posirion change y by 10.

[Click] on the Motion block palette

❶ [Drag-and-drop] a ‘change y by 10’

block in the ‘if ’ block
❷ [Drag-and-drop] a ‘change y by 10’
block in the ‘if ’ block - [Click] the
white window - [Enter] ‘-10’

When a cat approaches a hedgehog, it “meows” and tries to back away. Let’s use the ‘if
~ then ~ else’ block. In this code, whether the hedgehog is touched or not is treated as
a conditional expression.

It is separated by clicking and dragging

the upper left corner of the block
bundle with the mouse.
 2-1 Understanding and using scratches 49

Block explanation

‘Say’ blcks let your sprites talk using speech bubbles.

CHAPTER

01

02

03

04

[Click] on the Control block palette [Click] on the Sensing block palette 05
- [Drag-and-drop] a ‘if ~ then ~ - [Drag-and-drop] a ‘touching ~ ’
else’ block in the ‘forever’ block block in the ‘if ~ then ~ else’ block 06

07

08

09

10

11

[Drag-and-drop] the block bundle [Click] on the Looks block palette 12

placed in the lower jaws of the ‘if ~ - [Drag-and-drop] a ‘say ~ for ~
then ~ else’ block seconds’ block in the upper jaws of 13
the ‘if ~ then ~ else’ block
14

15
❶ [Click] on the Looks block palette - [Drag-and-drop] a
‘switch costume to left’ block in the ‘if ’ block
❷ [Click] on the Motion block palette - [Drag-and-drop] a
1
‘move 10 steps’ block in the ‘if ’ block - [Click] the white
2 window - [Enter] ‘-10’
 2-2

Storytelling project made with Scratch

A.M P.M
Sessions 4~6/6 sessions in total Time
O

• Learners can code sprites to move freely.

• Learners can develop scratch programs using multiple
Learning
sprites.
Objectives
• Learners can create their own storytelling projects using
scratches.

• Change the stage, sprite, shape, and sound

• Free movement of sprites
• Using multiple scripts
Learning
• Save files on your computer
Activities
• upload files from your computer
• Complete the 'Storytelling Project'
[Learn more] Share the scratch project

Material -
52 Chapter 02 Scratch Basics

Unit

01 Getting used to Coding

Let’s make the code we’ve made so far a little more diverse. Let’s make it even more fun
to express the cat’s surprise at the hedgehog’s thorns. You can also add the direction
the cat moves.

Changing a Sprite’s Costume

3
1

❶ [Right-click] on the costume1 - [Click] ‘duplicate’

(costume1 in the Costumes tab - costume4 is created)
❷ [Click] on the face part of Costume4
❸ [Click] Ungroup
 2-2 Storytelling project made with Scratch 53

[Click] the mouth of C

ostume4’s face to rotate 180
degrees

CHAPTER

01

02

03

04

05

06

07

08

09

[Click] the Brush Icon [Click] Fill - [Choose] color and adjust saturation - 10
[Enter] brush thickness size
11

TIP Have fun decorating your sprites 12

13

14

15

You can freely decorate the sprite as you like. In addition to the ones provided by Scratch,
you can draw and use them yourself.
54 Chapter 02 Scratch Basics

Decorate the sprite with the set [Enter] a name that suits the purpose
brush. according to the shape of the sprite

[Click] on the Looks

block palette
[Drag-and-drop] a
‘switch costume to ~’
block in the upper jaws
of the ‘if ~ then ~ else’
block
[Click] the drop-down
menu inside the ‘switch
costume to ~’ block
[Choose] 'meow'
 2-2 Storytelling project made with Scratch 55

[Click] the Run Icon ( )

CHAPTER
epteal
01

02

03
The cat approaches the hedgehog. It touches a hedgehog’s spines, makes a “meow”
sound and changes direction. However, the hedgehog does not respond. Now let’s 04
code the hedgehog to react to the cat.
05

Coding using multiple scripts 06

07
[Click] on the Looks
block palette
08
[Drag-and-drop] a
‘switch costume to ~’ 09
block in the upper jaws
of the ‘if ~ then ~ else’ 10
block
11

12

13

14

15
56 Chapter 02 Scratch Basics

[Click] the hedgehog sprite - [Click] the Costume tab - [Choose] the 4th
appearance that changes when it comes into contact with the cat among various
costumes

[Click] the hedgehog

sprite - [Click] on the
Looks block palette
- [Drag-and-drop] a
‘when I receive ~’ block

TIP Broadcasting
One type of broadcast block lets a sprite send a message. The other tells the sprite to
receive a message. Choose an existing message or create a new one.

This block starts a script when a sprite recives a message.

This ‘Events’ block lets a sprites send a message to all

the other sprites.
 2-2 Storytelling project made with Scratch 57

CHAPTER

01
[Drag-and-drop] a ‘think ~ for ~
[Click] on the Looks block palette seconds’ block - [Click] first blank 02
[Drag-and-drop] a ‘switch costume - [Enter] ‘Hmm...’ - [Click] second
03
to ~’ block (hedgehog-d) blank number ‘2’
04

05

06

07

08
[Drag-and-drop] a ‘switch costume [Click] on the Motion block palette - 09
to ~’ block (hedgehog-a) [Drag-and-drop] a ‘go to random
position’ block 10

11
[Click] the Run Icon ( )
12

13

14

15

The hedgehog also reacted and completed the code to run away to a random location.
58 Chapter 02 Scratch Basics

Let's check the completed code

You made a code for each of the two

sprites. Let’s check the code!

[Click] the Cat sprite

◀ You can check the cat sprite code.

[Click] the hedgehog sprite

▼ You can check the hedgehog sprite
code.
 2-2 Storytelling project made with Scratch 59

Save files on your computer

If you want to save the scratch file that you have worked on so far on your computer,
you can do the following.

CHAPTER

01

02

03

04
[Click] the File menu. - [Click] ‘Save [Click] the arrow on the right( )
to your computer’ - [Click] ‘Open Folder’ 05

06

You can check the downloaded 07

scratch job file in the download
folder. 08
Move this file to the desired
09
folder and manage it.
10

11

12

Upload files from your computer 13

When you want to load a scratch file saved 14

on your computer into the scratch editor,
15
[Click] the ‘File’ menu
[Click] ‘Load from your computer’
[Click] the file you saved
[Click] the ‘Open’ button
60 Chapter 02 Scratch Basics

Unit

02 Creating a Mini Game

Can you create a project based on what you have learned so far?
Now, create your own mini game project. If you can’t come up with an idea, you can
think about it while copying the following.

Setting up a Storyline
The ball will fall from the top random
location. If you catch the ball in the
bowl, your score goes up by one point.
If the ball does not fit into the bowl
and touches the red line, the ball
disappears.
If so, let’s prepare the necessary
sprites and stage backdrops.

Create a new project - [Mouseover] [Click] ‘Choose a sprite’ in the

to the original sprite - [Click] the sprite control window
Trash can Icon (Delete Sprite)
 2-2 Storytelling project made with Scratch 61

CHAPTER

01
[Click] on the ‘Ball’ sprite If you want to resize the sprite,
[Enter] a number in the ‘Size’ field. 02
[Click] on the ‘Bowl’ sprite too
The size of the bowl is 150.
03

04

05

06

07

08

09
[Click] ‘Choose a backdrop’ [Click] to select the appropriate
background 10

11

2 ❶ [Click] the Backdrops to 12

3 edit in the Stage control
4 window 13
❷ [Click] on the Backdrops
tab 14
❸ [Choose] color to Fill
15
1
❹ [Click] the Line icon
5 ❺ [Drag-and-drop] to draw
a line that disappears
when the ball touches the
background floor
62 Chapter 02 Scratch Basics

Coding the Ball sprite

Now, let’s code the Ball sprite. The Ball will fall from a random location on the top of
the stage. You can try changing the value of the block to make it a fun game, and you
can also change the block you are using.

The ball continues to move -10 at its starting position

in the Y-axis direction.

Think about how to control the speed of the ball.

What happens when you run it?

The ball only drops once and nothing happens

anymore.

To make the balls fall randomly, you need to add the

code shown on the left.

What happens when the ball goes into the bowl?

A new ball should appear, and you will need a record

of receiving the ball well.

Click the ball with your mouse to move it around.

You can check the x and y values ​​of the ball in the
sprite control window.

TIP Coding with multiple solutions

There is not only one way to code. For example, the code created above shows the same
result, but there is a code that appears differently. Where do you think it is it?

There will be a variety of creative ways to solve the problem.

 2-2 Storytelling project made with Scratch 63

Coding the Bowl sprite

First, click the sprite with the mouse to

move it on the Stage. You can see that
the x and y values of the sprite control CHAPTER
window change. 01

02

03

04
1
05
2
06

07
You have already learned to code to ❶ [Select] the variable ‘my valuable’
control a sprite with the keyboard from the ‘Valuables’ block palette 08
arrow keys. Let’s complete the code ❷ [Right click] - [Click] ‘Rename
09
that moves the bowl from side to variable’ (Change variable name
side. to ‘score’) 10

11

12

13

14

15

The Bowl sprite has a score variable, and each time the Ball sprite sends a message,
the score is incremented by 1. And, if you look at the code, you can see that the
score starts again from 0 when the game starts.
64 Chapter 02 Scratch Basics

How to quit the game

If you keep getting the ball into the bowl, the game won’t end. Let’s make the game end
when the goal is achieved.

[Click] on the backdrops tab - [Click] the Text icon – [Enter]

[Right click] on one stage backdrop ‘GAME OVER’ over the backdrop
- [Click] on duplicate

[Click] the Code tab

Let’s edit the Bowl stripe code.

End the game when the score reaches Just as the score always starts with 0
10. At this time, the backdrop is when the game starts, the backdrop
also changed. always makes the start screen.
 2-2 Storytelling project made with Scratch 65

Learn more Share the scratch project

CHAPTER

01
One of the advantages of Scratch is to share the project I made with my friends who
are learning with me. Sharing projects allows us to exchange feedback and improve the 02
quality of coding. And, you can get ideas for the next project. So this time, I’ll learn
how to share my project. 03

You can share it on the Create screen. 04

05

06

07

08

09

10

[Click] the Share button (orange square) on the Create Project screen 11

12
There is also a way to share it in my stuff.
13

14

15

[Choose] a project title in my studio [Click] on the ‘Share’ button at the

top right
66 Chapter 02 Scratch Basics

To make sure your project is shared,

When shared, the Share button enter your scratch account in the
disappears. Scratch main screen search window.

If you don’t want to share it

anymore,
[Check] that the project was shared [Click] Unshare on My Stuff

Alternatively, there is also a way to copy the address window link directly from the
Create screen and share it with others.