Chapter 03

Scratch
Advanced
 3-1

Programming using the teachable machine

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

• You can collect, train, and evaluate data on the teachable

machine.
Learning • You can use artificial intelligence models made by
Objectives teacherable machine in scratch.
• You can develop using the teacherable machine extension
function in Scratch.

• To experience learning artificial intelligence models with

a teachable machine.
–– Using saved images.
Learning
–– Using webcam.
Activities
• To Use the teacherable machine extension function in
Scratch.
–– Image Project

• Webcam (required if there is no internal/external camera

Material
device)
70 Chapter 03 Scratch Advanced

Unit
Experience
01 the Teachable Machine

Let’s learn about Teachable Machine

Teachable Machine is a web-based machine learning tool created by Google. In
the Teachable Machine, you can create machine learning model quickly and easily
by using three types of training data: image, audio (sound), and pose (motion,
movement). The teachable machine creates machine learning model through three
steps.

Data Collection Training Evaluation

The data collection stage We train machine learning You can use the preview
is t he most basic and model based on the collected window to evaluate whether
important stage of creating ▶ data. On a teachable machine, ▶ the machine learning model
an machine learning model. you can train the model you works properly.
want to create without any
special programming.

Go to https://teachablemachine.withgoogle.com

You can use the teachable machine

without registering as a member. Projects can create Image projects,
[Click] ‘Get Started’, you can start Audio projects, and Pose projects.
the project
 3-1 Programming using the teachable machine 71

Create an Image project with the teachable machine

Let’s create a project by clicking on the image project.

In most cases, standard images are

CHAPTER
used.
[Click] ‘Standard image model’ 01

02

03

04

❶ [Click] Icon( ) or class 05

1
name(Class 1), you can
change the class name. 06
2 ❷ [Click] Video, you can
check the tutorial. 07

08

09
What kind of program should we make?
Let’s create a program that helps separate collection by recognizing cans, glass 10
bottles, and paper on the webcam.
11

12

13

14

15

[Click] Icon( ) or class name If you want to add a class,

(Class 1) - [Enter] the class name [Click] ‘Add a Class’
(The first class name is ‘Can’, The
second class name is ‘Bottle’.)
72 Chapter 03 Scratch Advanced

[Click] Icon( ) or class name

(Class 1) - [Enter] the class name If you want to add a default class
(The third class name is ‘Paper’.) with nothing, add the nothing class.

Webcam : You can take pictures of Let’s see how to register an image
things yourself. using a webcam.
Upload : You can upload a file on
your computer, or you can get an [Click] ‘Webcam’
image on the web and upload it.

TIP Image sample shooting

You can take pictures of data while pressing the Hold to Record
button briefly. You can take pictures of various things. When
entering an image, it is good to provide various images for
accurate learning. It is recommended to take pictures from
various angles such as front, side, and top. It is also helpful to
take it from a distance or up close. Let’s think about what else
is there.
If you want to delete the data, click the
shape of the trash can generated when
mouseover the image to delete the image
data.
 3-1 Programming using the teachable machine 73

Show things in front of webcam - [Press] ‘Hold

to Record’ button for a few seconds.(about
5~7 seconds)

CHAPTER

01

02

03

04
Let’s add data in the same way for Bottle, Paper,
05
and Nothing classes.
06

07

08

09

10

11

12

13

14

15

[Click] ‘Train Model’ to train artificial intelligence

74 Chapter 03 Scratch Advanced

❶ When the machine learning model ​is training, moving to another window will
stop training, which means keep the screen on.
❷ Shows the status of training in progress.

When the training is completed, the above screen appears. It is possible to check
the accuracy of model by using a webcam or uploading an image.
 3-1 Programming using the teachable machine 75

Let’s see if the training went well. You can check it through webcam or upload.

CHAPTER

01

02

03

04

05

06

07

08

09

10
If you take something with a webcam, so it distinguishes between cans, bottles and
paper. If the envelope was filmed on a webcam, 78% of the envelopes were recognized 11
as paper! Let’s take a picture of various objects and test what they are recognized as.
12

13
TIP Training data and Test data 14
Training data
In the field of artificial intelligence, the terms training and learning are used in combination. 15
Therefore, the data used for model training is called ‘training data’ and ‘learning data’.
Test data
Test data is used to ‘evaluate’ the model. The evaluation is to judge whether the model’s
performance is good or bad. Usually, accuracy is measured to know the performance. (95%
accuracy is very good). 80% accuracy is low performance - relative figures) Test data and
training data must be independent of each other. Training data should not be used to test.
76 Chapter 03 Scratch Advanced

❶ [Select] File - Image upload settings saved

in the computer. Let’s check the accuracy
❷ [Drag-and-drop] Image file - Drag and of model by testing it with
move image files from on your computer. an image file.

TIP I can see my AI model on my phone

The AI model created by the teachable machine can be delivered as a link.

[Click] Export Model ❶ [Choose] ‘Upload(shareable link)’ - [Click] ‘Update

my cloud model’
❷ [Click] ‘Copy’
 3-1 Programming using the teachable machine 77

Unit
Using Teachable Machine
02 in Scratch
CHAPTER

01

02
Adding Teachable Machine Extensions in Scratch
03
Let’s make a scratch program using the learning model made with the teachable
machine. We will use the link created on the teachable machine for scratch coding. 04
However, the teachable machine extension function is not on the official Scratch site.
05
Go to https://stretch3.github.io/
(The teachable machine extension function is not an extension function officially
06
provided by Scratch, so it is impossible to share it.)
07
If the language is not set to your
1
native language, 08
[Click] Icon ❶ - [Choose]
language 09
❷ [Click] ‘Add Extension’ in the
10
lower left corner
11

12
2
13

14

[Click] ‘TM2Scratch’ 15
TM2Scratch is an extension function block that
changes the teachable machine to scratch coding.

[Click] ‘Text to Speech’

Text to Speech is an extension block that converts text
into speech sounds.
78 Chapter 03 Scratch Advanced

Using Teaching Machine Learning Models in Scratch

Let’s create a program to distinguish cans, bottles, and paper. When there are no
objects, let’s make no sound. The following is a storyline for program.

Action Reaction
Execution result
You Sprite

Sound It’s a glass bottle.

Make things visible to webcams.
Speech balloons It’s a glass bottle.

Sound -
Don’t recognize anything.
Save the earth.
Speech balloons
Thank you!

In palette, [Choose] ‘Text to Speech’

[Drag-and-drop] ’set language to’
if you change the language, [Click]
‘English’ (Default language is ‘English’)

In palette, [Choose]
‘TM2 Scratch’
[Drag-and-drop]
‘turn video’ - [Click]
‘off ‘(Default state is
‘off ’) - [Choose] ‘on’
[Drag-and-drop] ‘Image classification model URL’ - [Click] blank - [Enter] the
link to the learning model created by the teacherable machine
[Drag-and-drop] ‘turn classification’ - [Click] ‘off ’(Default state is ‘off ’) - [Choose]
‘on’
 3-1 Programming using the teachable machine 79

Coding image label to respond based on

received value.

The “Class” of the Teachable Machine

CHAPTER
appears as a “label” in Scratch.
01

02
Let’s turn on the computer’s speakers and run Scratch.
03
However, if there is no sound, the classification result cannot be known on the
04
screen. You can move sprites on the screen and display speech balloons.
05

06

07

08

09

10

11
In palette, [Choose] ’Look’ 12
[Drag-and-drop] ‘say’ - [Enter] ‘It’s a
Can’ (Let’s type in the text that fits each 13
label.) When you run the completed
scratch program, it appears 14
that the Sprite recognizes
objects reflected on the screen 15
and separates them as follows.

Since we have created a program that recognizes things, can’t we create a program
that recognizes people? Let’s think about a variety of machine learning programs that
can recognize images.
 3-2

Programming using Machine Learning for Kids

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

• You can use Machine Learning For Kids to create an

artificial intelligence model that distinguishes texts.
• You can create an artificial intelligence model that
Learning
distinguishes sounds by using Machine Learning For
Objectives
Kids.
• You can develop programs in Scratch by using the
Machine Learning for Kids extension.

• To create artificial intelligence models with Machine

Learning for Kids
Learning
–– Text, image, sound
Activities
• To coding scratch using machine learning for Kids
–– text project

• Webcam (required if there is no internal/external camera

Material
device)
82 Chapter 03 Scratch Advanced

Unit
Creating AI models with
01 Machine Learning for Kids

Machine Learning For Kids was created by IBM software developer Dale Lane. He
created this site to make it easier for children to understand and develop artificial
intelligence. However, Machine Learning for Kids makes it easy for children as well as
those new to AI to create AI programs.

Go to https://machinelearningforkids.co.uk/

Data Collection Training Evaluation

‘Train’ in Machine Learn­ ▶ The learning stage can ▶ When learning is complete,
ing For Kids is the same be said to be the process you can experiment with
as the data collection stage of automatically learning the learning results. You can
in Teachable Machine. In the collected data with a consider adding or modifying
this step, we collect data machine learning algorithm data to a specific label by
for machine learning and and creating a knowledge inserting test data and
classify labels. A label is base. The learning process viewing the analysis results
the same as a ‘Class’ in the may have different learning of machine learning.
Teaching Machine. times depending on the
type and size of data.
 3-2 Programming using Machine Learning for Kids 83

Text Project

CHAPTER

01

02

[Click] ‘Get started’ [Click] ‘Try it now’ 03

04

05

06

07

08
[Click] ‘Add a new project’
09

10

1
11

12
2
13
3
14
4
15
❶ [Enter] Project name ‘emotions in words’
❷ [Choose] Recognising (You can choose between text, number, sound, and
image.)
❸ [Choose] Language
❹ [Click] ‘CREATE’
84 Chapter 03 Scratch Advanced

[Click] the project name [Click] ‘Train’

[Click] ‘Add new label’

You can add as many labels
as you want, so let’s create
two labels to differentiate between good and bad words.

[Enter] label name ‘Good’ - [Click] Now, let’s add data to the label.
‘ADD’ To add data to the Good label,
Let’s add the Bad label in the same [Click] ‘Add example’ inside the
way. Good label.

[Enter] a sentence or word that feels

positive or good - [Click] ‘Add’
(Repeat this process several times)
 3-2 Programming using Machine Learning for Kids 85

In the same way, [Enter] the words you

think are bad on the Bad label -
[Click] ‘Back to project’

CHAPTER

01

02

03

04

05

06

07
[Click] ‘Learn & Test’ [Click] ‘Train new machine
08
learning model’
09

10

11

After training the machine learning ​model, you can test it. Completion of training 12
means that it is ready for evaluation.
13

14

15

Using what you didn’t use as training data as test data is enough to get an idea of
the accuracy.
86 Chapter 03 Scratch Advanced

Image Project
Let’s create an artificial intelligence model that can distinguish images.

Create an Image project.

[Click] ‘Train’ [Click] ‘Add new label’

[Enter] ‘Car’, ‘Bus’, ‘Bicycle’ (label name) -

[Click] ‘ADD’

There are ways to copy and input

a link to an Internet image, take a
picture with a webcam, or draw it
yourself.
 3-2 Programming using Machine Learning for Kids 87

: ways to copy and input a link to an Internet image

CHAPTER

01

02

03

04
google image search [Right click] on the [Click] button( ) - [Press]
05
image - [Click] ‘Copy ‘Ctrl’ + ‘V’ in keyboard (paste
image address’ address) - [Click] ‘ADD’ 06

07

08
: take a picture with
: draw it yourself 09
a webcam
10

11

12

13

14

15
[Click] button( ) - Place [Click] button( ) - [Click] ‘Draw’, you
an object in front of the webcam - can draw while holding down the mouse in
[Click] ‘ADD’ the space on the left. - [Click] ‘Erase’, you can
erase what you drew. - When the drawing is
complete, [Click] ‘ADD’
88 Chapter 03 Scratch Advanced

Appropriately add image data to each label.

The above training data was added by searching Google images.
After adding enough data to each label, [Click] ‘Back to project’

[Click] ‘Learn & Test’ [Click] ‘Train new machine

learning model’

TIP Minimum and maximum number of image training data

The number of data that can be input for training in Machine Learning For Kids depends on
the data format.
Image training requires at least 10 training data per label, and can store up to 100.
 3-2 Programming using Machine Learning for Kids 89

Wait for a while for the machine

When learning is complete, you can CHAPTER
learning model to finish training.
test it. 01
Get an image web address from the
Internet and test it. 02

03

04

05
1

06

07

2 08

09
❶ On one side, search for images through the Internet window, and on the other
10
side, keep the test window on. - [Drag-and-drop] the image to move it
❷ The image web address is entered in the input field. - [Click] the Test with www 11
button
12

13

14

15

It can be seen that the input bus image is recognized as a bus image at 99%.
90 Chapter 03 Scratch Advanced

Sound Project
Start a new project.

[Enter] the project name

- [Choose] Recognizing
as ‘Sounds’ - [Click] the
‘CREATE’ button

[Click] on the project name [Click] ‘Train’

Background noise labels are basically created because external noises need to be
learned to increase accuracy.
[Click] ‘Add new label’ - [Enter] label name - [Click] ‘ADD’
(In the book, Red, Yellow, and Blue were added as labels.)
 3-2 Programming using Machine Learning for Kids 91

CHAPTER

01

02

03

04
[Click] ‘Add example’
05

06

07

08

09
[Click] on the Speaking Finished recording
10
microphone Icon (Recording) -[Click] ‘ADD’
11

12

13

14

15

Add 8-10 pieces of data to each label. Record various speed, voice size, height, etc.
92 Chapter 03 Scratch Advanced

[Click] ‘back to project’

[Click] ‘Train new machine

[Click] ‘Learn & Test’
learning model’

[Click] ‘Start Listening’ - TEST(Speaking) - [Click] ‘Stop Listening’

Let’s look at the results and see if the learning went well.
 3-2 Programming using Machine Learning for Kids 93

Unit
Scratch Coding Using Machine
02 Learning For Kids
CHAPTER

01

02
Using machine learning models for scratches (Text Project)
03
[Click] ‘Make’ 04

05

06

07
[Click] ‘Scratch 3’
(Machine learning for kids 08
can create programs using
09
machine learning models
trained as Scratch, Python, 10
and App Inventor.)
11

12
[Click] ‘Open
in Scratch 3’ 13

14

15
94 Chapter 03 Scratch Advanced

Let’s make a Scratch program with a text project

A student is looking for a restaurant to visit with family or friends. Please tell us
about the last restaurant you visited. Recognize whether it is positive or negative, and
responds accordingly. The following is a storyline for program.

Sprite 1 Sprite 2
(Abby) (Devin=User)
Case Execution result

[Ask]
(ex. “How was the
Code -
restaurant you
A visited?”)

Costume [Waiting] -

Code - User Input

Costume [Waiting] -

[Say]
Code (Reaction according -

C to user input value)

Costume [Good] or [Bad] -

Case A is a coded state where Sprite 1 (Abby) has asked and waiting for a response
from Sprite 2. Sprite 2 is the user. Case B shows the case where the user inputs. When
the user types something into the input field and presses enter, it is handled in some
way. In case C, Sprite 1 responds positively or negatively depending on the user input,
and the costume changes.
 3-2 Programming using Machine Learning for Kids 95

Sprites and backdrop

CHAPTER

01

02

[Mouseover] to the original sprite - [Click] on the sprite you want to 03

[Click] the Trash can Icon (Delete add
04
Sprite) - [Click] ‘Choose a sprite’ in (Choose Devin and Abby from this
the sprite control window textbook.) 05

06

07

08

09

If you want to change the direction, 10

[Click] ‘Flip Horizontal’
11
[Click] on the Sprite ‘Costumes’ tab
12
Abby’s reaction varies depending on whether the user’s input value is positive or
13
negative. Let’s change Costume as well as speech balloons.
14
[Click] ‘Costumes’ tab
Delete the unnecessary costume and rename the 15
costume appropriately.
[Click] costume name - [Enter] ‘waiting’ (In the
textbook, it is divided into waiting, good, and bad.)
96 Chapter 03 Scratch Advanced

[Waiting] [Good] [Bad]

Abby’s appearance in Bad costume is a drawing of the shape of her mouth and the
embarrassing figure next to her. Try decorating the costume more interestingly.

You can change or decorate the backdrop if you wish.

[Click] ‘Choose a Backdrop’ - [Click] on the backdrop you want to add

Place the sprite in the appropriate

location.
 3-2 Programming using Machine Learning for Kids 97

Scratch Coding

CHAPTER

01

02

03

04

05

06

07

08
[Drag-and-drop] ‘when (Flag) clicked’
09
[Drag-and-drop] ‘forever’
[Drag-and-drop] two ‘if ’ blocks inside 10
[Drag-and-drop] ‘recognise text (label)’ block into the Operator(‘=’) blocks
[Drag-and-drop] ‘Good’ in the first ‘if ’ block, [Drag-and-drop] ‘Bad’ in the second 11
‘if ’ block
12

13

14

15

[Right click] on my
variable in the Variables block palette -
[Click] ‘Rename variable’ [Enter] ‘review’ - [Click] ‘OK’
98 Chapter 03 Scratch Advanced

[Drag-and-drop] ‘answer’
block into the ‘recognise
text(label)’ block

[Drag-and-drop] ‘ask ~ and wait’ -

[Enter] ‘How was the restaurant you
visited?’
[Drag-and-drop] ‘set review to’ -
[Drag-and-drop] ‘answer’ block into
the ‘set review to’ block

TIP The types of blocks in Machine Learning For Kids are as follows.
❶ Returns a label for text.
1 ❷ Returns the type of text.
2
❸ Name of the label created in the project.
3 ❹ Add training data.
4 ❺ Train a new machine learning model.
5 ❻ Machine learning models take about a minute to be
ready to use, and must use a wail until block.
6
 3-2 Programming using Machine Learning for Kids 99

CHAPTER

01

02

03
The ‘ask ~ and wait’ block creates a speech balloons like the result screen on the
right. ‘answer’ makes the input window under Devin appear, and it receives the 04
value entered by the user and sets it in ‘review’.
05

06
In palette, [Choose] ’Look’
[Drag-and-drop] ‘switch costume to ~’ - [Click] ‘▼’ 07
- [Choose] ‘waiting’ (When Abby does nothing,
costume is waiting. Choose costume from other 08
‘switch costume to ~’ blocks according to the
09
conditions.)
10

11

12

13
In palette, [Choose] ’Look’
[Drag-and-drop] ‘say ~ for ~ seconds’ - [Enter] 14
what Abby has to say when the machine learning
model receives a positive input. - [Enter] ‘5’ (This is 15
to float the speech balloons for five seconds.)

Let’s do the same when we receive a negative input.

100 Chapter 03 Scratch Advanced