プログラミング初心者のためのScratch（スクラッチ）入門-ペン編（１）

2024年5月12日

プログラミング初心者の子供に何を教えたらいいの？とお悩みの保護者のためのScratch（スクラッチ）の入門講座。Scratchで猫の動かし方はわかったけど・・・次にどんなことをしたらいいの？という疑問にお答えするシリーズです。
今回はScratchの「ペン」の基礎編をお届けします。

対象は小学校高学年のお子さん向けになっています。小学校低学年のお子さんは、保護者がまず作り、お子さんがプログラムを改造するという方法がおすすめです。

1. Scratchのペンをマスターしよう

Scratchには「ペン」という機能があります。この機能を使うと、スプライトが動いた「あと」（軌跡）を線で描くことができます。
「ペン」をつかうことで、多角形を描いたりすることもできるので、算数（図形）の勉強にもなるということで、学校の授業でも使われていることが多いようです。

というわけで、学校でよく使われそうなScratchのペンの基本的な使い方をまずは覚えていきましょう。

1-1. ペンを下ろす、ペンを上げる

Scratchの話をする前に、紙にペンで字を書くときのことを思い浮かべてみてください。
ペン先を紙の上に下ろして線を書いたら、またペン先を上げて別の場所まで移動して・・・という動きをしていますよね？

Scratchでもペンを上げたり、下げたりを行います。その動きに対応するブロックが「ペンを下ろす」「ペンを上げる」です。

ではこのようなプログラムを作ってみます。

「ペンを下ろす」と「ペンを上げる」の間に挟まれた赤枠の部分だけに線が引かれるはずです。

緑の旗を押して、プログラムを実行してみましょう。
プログラムを実行すると、このようになりました。

青い点線の上も猫は動いていますが、「ペンを上げる」の後なので線は引かれません。

Scratchでは、ペンで線を引きたい動きを「ペンを下ろす」と「ペンを上げる」のブロックで挟む

1-2. 正三角形を描く

では、Scratchを使った算数の時間です。
一辺が100ピクセル（Scratchの座標100）の正三角形を描いて見ましょう。

正三角形の内角は60度です。だから「60度曲がればいいんだ！」と次のようなプログラムを作るお子さんが多いです。

ところが結果はこうなります。

あれれ？三角形になりません。スクラッチで図形を描くときは「外角」を指定しないといけないんですね。
内角60度の正三角形の外角は120度なので、プログラムを直しましょう。

プログラムを実行すると・・・

はい。正三角形が描けましたね。

多角形を描くときは外角を指定する

1-3. ペンの色を変える方法

ペンの色を変えるには三つの方法があります。

　・使いたい色をクリックして選択する方法
　・使いたい色を0から200の数値で指定する方法
　・使いたい色をRBGで指定する方法

ここでは「使いたい色を数値で指定する方法」について説明します。

コンピューターでは光の三原色の「赤 Red」「緑 Green」「青 Blue」の色の組み合わせで色を表現します。
この色の表現方法のことを、RBGといいます。

「赤 Red」「緑 Green」「青 Blue」の各色には明るさ（輝度）があり、0-255の数値の範囲で指定します。
各色ごとに輝度を設定して組み合わせるといろいろな色が表現できます。
どんな風に組み合わせるのか、実際の例は、下の表を見てくださいね。

この表は横に見てください。
例えば、黄色を使いたいときはR（赤）を255、G（緑）を255にすれば黄色になります。

では、このRBGを使って、色を自在に作れるプログラムを作ってみましょう。
まずはR、G、Bの三つの変数を用意します。

そして、ペン色を次のように設定するプログラムを作ります。

！注意：このように数値で色を指定するときは、こちらのブロックを使います。

以下のブロックを使うと、うまく動作しないので気をつけてください。

これで、RGBに数値を入れることで好きな色が作れます。

RGBの数値で色を指定する方法を使ってこんなプログラムを作ってみました。

https://scratch.mit.edu/projects/211394112/

RGBの輝度をスライダーで設定してください。
その後、緑の旗を押すと、指定された色でねこが三角形を描きます。

やってみよう

・インターネットで「RGB 色見本」というキーワードで検索し、色々な色のRGBの値を調べよう。
・調べたRGB値を上のプログラムに入力して、同じ色が作れるかやったみよう。
・三角形を六角形に変えてみよう。

1-3. ペンの色を16進数で指定する方法

ここからはもうちょっと詳しく知りたい人向けです。
HTMLをちょっと触ったことがある人なら色の指定を「#ffb6c1」と数字と英語の組み合わせで使ったこと、ありませんか？

「ffb6c1」は「R:255 G:182 B:193」を16進数で表記したものなのです。

Scratchで16進数で色を指定するには次のようにします。

！注意：このように数値で色を指定するときは、こちらのブロックを使います。このブロックの色付きの部分に16進数を入れてください。

思わず以下の数値を入れるブロックを使いそうになりますが・・・以下のブロックではうまく動作しません。気をつけて