こんにちは。キノコードです。 この動画は、小学生からはじめるプログラミングとして、スクラッチについて説明します。
プログラミングを学んでいる小学生の皆さんだけでなく、プログラミングをはじめたばかりの人、これからはじめたい人にも、学習しやすい内容にしています。
1回目のレッスンでは、はじめての人や小学校1,2年生の皆さんができる内容を説明しました。
そこでは、スクラッチの基本的な操作を学んで、自分だけの水族館を作りましたね。
まだ見ていない人は、見ながらやってみてくださいね。
2回目のこのレッスンでは、特に小学校3,4年生の、中学年の皆さんにぴったりなテーマを用意しました。
キャラクターを作ったり、せりふや音をつけて、物語のアニメーションを作りますよ。 学校でやったことがある人は、思い出しながら取り組むと復習になりますよ。 やったことがない人は、是非チャレンジしてみてください。 きっととすぐできるようになりますよ。
さて、保護者の方へのお願いです。
Scratchは、インターネットに接続して使用します。また、サインインをすると、SNSのような機能を使用できます。
子供だけの使用によるトラブルも発生しております。
16歳未満のお子様がサインインして使用する場合は、保護者のメールアドレスを設定する、親子でガイドラインを作成して守る、などの対策をした上でご利用いただくようご注意ください。
ルールを守って、楽しんでプログラミングを学習いただけることを願っています。
キノコード では、スクラッチの動画をもっと配信していきます。
新着通知がいきますので、ぜひチャンネル登録をお願いしいます。 それでは早速、始めましょう。
この記事の執筆・監修
テクノロジーアンドデザインカンパニー合同会社のCEO。
日本最大級のプログラミング教育のYouTubeチャンネル「キノコード」や、プログラミング学習サービス「キノクエスト」を運営。
著書「あなたの仕事が一瞬で片付くPythonによる自動化仕事術」や、雑誌「日経ソフトウエア」や「シェルスクリプトマガジン」への寄稿など実績多数。
めあての確認
今回のめあては、「物語を切り取って動画にしよう」です。
皆さん「おおきなかぶ」というお話は知っていますか？
一年生の時に小学校の国語の授業で学習していませんか？
きょうは、「大きなかぶ」の中から、好きな場面を選んで、動画を作ってみましょう。
今日のレッスンが終わると、「オリジナルのキャラを作る」「動画に音を付ける」「動画にせりふを付ける」この３っつができるようになります。
このレッスンでは、スクラッチの基本の部分は、簡単な説明でどんどん進めます。
ちなみに、「低学年編」では基本を丁寧に説明しています。
まだ見ていない人や、ここから始めるのが心配な人は是非見てみてくださいね。
今日も楽しく頑張りましょう。
基本の部分を作る
さて、「大きなかぶ」のどの場面にしましょう。
そうですね、かぶがぬけずにネズミを呼ぶ場面にしましょう。
おじいさん、おばあさん、犬、猫が来て、それでもカブが抜けないところを作ろうと思います。
では、左下の動画を消して、まず、背景、つまり、後ろの絵を選びましょう。
大きなカブなので、緑がたくさんの背景がいいですね。
右下の「背景を選ぶ」をクリックします。
「Forest」にしましょう。
クリックします。
すると、ステージに背景が出てきました。
次に、スプライトを選びます。
「大きなかぶ」には、猫が出てくるので、一番初めに開いたときに出てくるこのスプライトは、消さずにおいておきましょう。
他にはどんな登場人物がいましたか？
おじいさん、おばあさん、いぬ・・・
それから、大きなかぶを登場させることも忘れないでくださいね。
では、猫の他に必要なスプライトを増やしましょう。
ほしいものがあるといいですね。
右下の「スプライトを選ぶ」をクリックします。
「動物」をクリックして、見てみましょう。
犬がいました。
今回はこちらを選びます。
次に、人をクリックします。
おじいさんとおばあさん・・・なさそうですね。
オリジナルの大きなかぶということで、スポーツ選手や魔法使いを登場させてもいいですが、せっかくなので、作ってみましょう。
おじいさんと、おばあさんはひとまずおいておきます。
かぶはあるでしょうか？
「食べ物」をクリックして見てみましょう。
無いですね。
でも、ん？似ている形がありますよ。
「strawberry」外国語活動で学習して知っている人は何かわかりますね。
この「イチゴ」を、色を変えてかぶにしてみましょう。
クリックします。
これで、背景、猫、犬、かぶの代わりのいちごがステージに出てきました。
見やすいようにドラッグして移動させて、離して置きましょう。
スプライトをカスタマイズして配置する
では、ここから選んだスプライトを工夫していきます。
まず、いちごです。
いちごをかぶに変身させますよ。
右下のいちごをクリックします。
そして、左上のコスチュームタブをクリックします。
１から５まで、コスチュームがありますが、今回は今のまま、１を使うのでここは触りません。
色を赤から白に変えます。
「塗りつぶし」をクリックします。
色・鮮やかさ・明るさと三つのつまみがあります。（やって見せる）
ここを調整します。
白くしたいので、鮮やかさを一番左にします。
これでオッケーです。
塗りつぶしボタンをクリックします。
マウスを持っていくと、「塗りつぶしたらこうなるよ」というのを見せてくれます。
白くしたい所でクリックしましょう。
つぶつぶが残ってしまいました。
これを一つずつ塗りつぶしてもよいですが、とても時間がかかるので、筆でぬります。
筆の太さを変えるとあっという間に塗れます。
「筆マーク」の隣にある数字を、大きくします。
三角をクリックしてかえても、
直接数字を入れてもいいです。
数字を打つ時は、大きなくらいから小さなくらいまでをドラッグして青色にします。
そして、数字を入れます。
50にしてみましょう。
塗りたい部分をクリックします。
繰り返すと、赤い粒粒がなくなってどうですか？
かぶに見えま・・・すよね？
・・・見えるということにしましょう。
さて、さっきおいておいた、おじいさんとおばあさんに戻りましょう。
今回はぴったりなスコスチュームが見つからなかったので、自分で作ってみましょう。
まず、おじいさんを作ります。
右下のスプライトを選ぶボタンの上にマウスを持ってくると、このように作業を選ぶことができます。
今回は、下から二番目の「描く」をクリックします。
すると、コスチュームタブに切り替わります。
大きく書きすぎると、このように見えません。
右のステージからもはみ出します。
でも、見えませんが、描けているのでスプライトをずらすと出てくることがあります。
後から困るので、見える範囲に描くようにしましょう。
間違えたら、この矢印ボタンで戻すことができます。
では、顔から書いてみましょう。
まず肌色を作ります。
輪郭を描きます。
中を塗るのはどのようにやるのでしたか？
そうですね、塗りつぶしボタンをクリックし、塗りたい部分をクリックします。
次は・・・帽子です。
茶色を作って帽子を書きます。
筆が太くて書きづらかったら、どうするのでしたか？
そうですね、数字を下げます。
次は、髪の毛です。
灰色にしましょう。
髪の毛を書くのに、帽子が邪魔なので少しずらしましょう。
「選択」をクリックして、移動するものをドラッグします。
少し間違っても、消したり、移動したりが簡単にできるので、思い切って書いてみましょう。
このように、前髪が帽子の上にはみ出ると変ですね。
その場合は、「選択」をクリックし、帽子を「クリック」して選択します。
そして、この矢印をクリックします。
「手前に出す」「奥に下げる」「最前面」「下げる」の四つがあります。
どれを押すと思った通りになるでしょうか。
今回は、一番前に帽子が来てほしいので、最前面をクリックします。
わからない時はクリックしてみて自分の思った通りのを選んでください。
（下げるの時に）おお、これは困りますね。
慣れてくると、すぐ選べるようになりますよ。（最前面に戻す）
次は、顔を完成させましょう。
目を付けて。
鼻を付けます。
さっきの肌色を元にして、鼻を作ってみましょう。
「塗りつぶし」をクリックします。
右下の「スポイト」をクリックします。
「理科」の学習で使ったことがある人もいますね。
さあ、このボタンを押すとどんなことができるんでしょうか。
作ったスプライトに近づけると、虫眼鏡のように大きくなって見えます。
虫眼鏡の真ん中に小さな四角が見えますか？
この四角の色と同じ色を作ることができます。
どういうことかというと、
四角の中が、茶色なら、茶色を
四角の中が、灰色なら、灰色を
スポイトで吸った時みたく、同じ色が作れます。
肌色が使いたかったので、四角の中が肌色になるようにして、クリックします。
同じ色で鼻を描くと、見えないので、少し鮮やかさを変えましょう。
耳と眉毛と髭と口も描きます。
これで顔は完成です。
ここで、技を一つ教えます。
いまは、書いたり塗ったりした物が、一つずつ動かせます。（見せる）
このようにです。
しかし、ちょっと間違って触ってしまうと形がずれます。
こういうの、いやですよね？
顔を上に動かした方が体が書きやすい時、眉毛と鼻とひげ、髪の毛、帽子、口、耳がぜ～んぶ一緒になって動いてくれたら楽だなと思いませんか？
そこで使うのが、「グループ化」です。
皆さんも「グループ」で実験したり、調べ物をしたり、発表をしたりしますよね？
バラバラにやるのではなくて、何人かで仲間になって一緒にやるときに「グループ」が使われていると思います。
スプライトでも同じです。
顔に乗っているものを「グループ」にしてみましょう。
キーボードの「Shift」ボタンを押しながら、グループにしたいものをクリックしていきます。
クリックし終わったら「Shift」ボタンを離して、「グループ化」をクリックします。
すると、このようにグループで動くようになりました。
元に戻したいときはこの「グループ解除」を押します。
便利ですので覚えておきましょう。
では、もう一度グループ化をして体をどんどん作っていきますよ。
背景が緑なので、見えやすいように色を使うといいですね。
靴も履かせましょう。
さて、おじいさんができました。
でも、ステージを見てください。
はみ出していますね。
こんなに大きいと困るので、小さくします。
ステージ下の「大きさ」の数字を小さくしましょう。
100より大きいと今より大きく、小さいと今より小さくなります。
とりあえず、45にしておきましょう。
さて、次はおばあさんです。
初めから作ると時間がかかるので、おじいさんから少し変えて作ろうと思います。
「おじいさん」のスプライトを右クリックします。
すると、「複製」と出ます。
漢字が難しいですがわかりますか？
一番上ですよ。
これをクリックします。
すると…ステージ上に増え、スプライトのボタンも増えました。
このスプライト３を使います。
コスチュームタブをクリックします。
まず、帽子を取りましょう。
「選択」を押して帽子をクリックします。
顔が全部選択されてしまいました。
ここで、一度グループ化を解除しましょう。
ゴミ箱のマークを押して、帽子を消します。
ひげもいらないですね。
さて、髪の毛を付けないと困ります。
同じ灰色を使って付け足したいです。
どうするのか覚えていますか？
そうですね、スポイトを使うんでした。
色ができたら描きましょう。
ズボンをスカートにします。
長靴の大きさも少し小さくしましょう。
選択して、四角をドラッグすると、大きさを変えられます。
首にスカーフを巻きましょう。
顔の表情を少し変えたいです。
「選択」をクリックして、眉毛をクリックすると、このように矢印が出てきます。
これをドラッグして動かすと、眉毛の形はそのままで方向を少し変えることもできます。
少し調整をして、これでおじいさんとおばあさんの完成です。
さて、ステージを見てください。
これだと全員入らなさそうです。
そこで、大きさを変えてみます。
おばあさんの大きさを少し変えます。
どうやるのでしたか？
思い出せますか。
答え合わせです。
見ていてくださいね。
合っていましたか？
続いて、犬と猫も小さくします。
かぶは、これだと小さいので大きくしましょう。
そして、かぶをおじいさんが引っ張れるように斜めに植えましょう。
「コード」タブの「動き」の中から、角度に完成するブロックを探します。
見つけられましたか？
これです。
押してみましょう。
これでいいですね。
最後に、かぶの根元を隠しましょう。
草をはやしたいですね。
スプライトの中に植物はあるでしょうか。
なさそうなので、描きましょう。
いま、私がやったみたいに、必要なものを描いて、ステージにどんどんおいていきます。
登場人物を決められたら、次は動きを付けてみますよ。
動きを付ける
さて、早速、かぶを引っ張る動きを付けてみましょう。
おじいさんを動かしながら考えてみましょう。
右下のおじいさんのスプライトをクリックします。
そして、「動き」タブをクリックして、「15度回す」の左に矢印が回っているブロックををドラッグしてコードエリアに移動します。
クリックしてみます。
おじいさんが左に傾きました。
この後元の場所に戻ってほしいので、右周りの「15度回す」ブロックをコードエリアにもってきて、先ほどのブロックとくっつけます。
一度、「90度に向ける」ブロックをクリックしておじいさんの角度を基に戻してから、コードエリアのブロックをクリックしてみましょう。
動きませんね。
「低学年編」でも説明しましたが、スクラッチは、途中の動きは見せてくれません。
15度左に回って、15度右に回った…つまり元に戻った後の状態を見せてくれるので、動かないのです。
途中の動きを見せるには、「制御」のなかの「１秒待つ」を使うとよいです。
「動き」の後に「１秒待つ」のブロックを置きます。
これで、引っ張っているように見えました。
３回引っ張らせたいので、同じ動きを３回させましょう。
「制御」の中の、「10回繰り返す」ブロックを使います。
繰り返させたい動きを囲むようにブロックを置きます。
10を３にします。
さて、クリックしてみましょう。
思った通りの動きをしてくれたら成功です。
これでいいですね。
さて、今のところ、おじいさんはブロックをクリックした時に動きます。
次は、ステージの上にある、緑の旗をクリックしたら動くようにします。
「イベント」の、「緑の旗が押された時」ボタンをドラッグして動きのブロックにくっつけます。
実際に動くかどうか、緑の旗を押してみます。
これでいいですね。
他の登場人物にも同じ動きをさせたいので、それぞれのスプライトのコードエリアにもブロックを置きます。
ここで、一つ一つ作ると時間がかかるので、おじいさんのブロックを使って簡単にしましょう。
動きのブロックをドラッグして、右下のスプライトの所に持っていきます。
すると、青くなって、マウスをもっていったコスチュームが少し揺れます。
揺れたのを確認してマウスから手を離すと・・・
同じものが違うスプライトのコードエリアにも作ることができました。
犬と猫も同じ動きができるようにしておきましょう。
これで、どのスプライトも動くはずです。
試しに、緑の旗を押してチェックしますよ。
これでいいですね。
せりふを付ける
では、引っ張るときに「うんとこしょ、どっこいしょ」と言わせます。
また、おじいさんのスプライトで試しながらやってみましょう。
「見た目」の中の「こんにちは！と２秒言う」ブロックをドラッグしてコードエリアに置きます。
「こんにちは！」の部分を、「うんとこしょ！どっこいしょ！」に変えます。
さっきの動きに合わせて３回言わせたいです。
さて、どのブロックを使えばいいかわかりますか？
そうですね、動きの時と同じブロックを使ってみましょう。
「10回繰り返す」ブロックをコードエリアに置き、10を３にします。
そしてさらに、「イベント」の「緑の旗をクリックしたら」もくっつけます。
緑の旗をクリックして、どのようになるか、見てみましょう。
さて、これだと、ずっと言いながら引っ張っていることになりますね。
どうしたらよいと思いますか。
そうですね、「１秒待つ」ブロックを足しましょう。
では、さっきの動きとせりふが合うかどうか、試してみましょう。
緑の旗を押しますよ。
よく見ていてくださいね。
せりふと動きがずれているように見えますね。
さいご、引っ張っていないのに、「うんとこしょ！どっこいしょ！」と言うのは変ですね。
さて、どんな工夫をしたらよいでしょう。
せりふに時間がかかりすぎている、ということは・・・？
そうですね、とりあえず、２秒を１秒にしてみましょう。
さて、試してみますよ。
よく見ていてくださいね。
これで、せりふと動きがぴったりになりました。
もう少しせりふを増やしてみましょう。
抜けなかったので、「うーん…」と考えさせたいです。
どのブロックを使いましょう。
「見た目」の中の「「うーん…」と２秒考える」ブロックをさっきのセリフの所にくっつけましょう。
さて、もう一度緑の旗を押してチェックしてみますよ。
これでいいですね。
音を付ける
最後にこの場面に音を付けます。
「コード」の中の「音」を見てみましょう。
色々なブロックがあります。
「ポップの音を鳴らす」があります。
押してみましょう。
三角を押すと選べるようですね。
録音もできるようです。
今回は簡単に作りたいので、もう用意してある音を使いたいと思います。
実は、他にもまだ音を選ぶことができます。
左下の「拡張機能を追加」をクリックします。
「音楽」をクリックします。
すると、「コード」の中に、「音楽」が追加されました。
これもクリックしてみましょう。
ブロックがありますね。
「スネアドラムのドラムを0.25拍鳴らす」をクリックしてみましょう。
さっきとは違う音が出ました。
三角を押すと、さっきよりたくさんの音があることがわかります。
コードエリアにブロックを移動させて、色々試してみます。
いくつか聞きながら選びます。
かぶを引っ張る音に合うのはどれでしょう。
この「クイーカー」にします。
いつも通り、「１秒待つ」を入れて、「３回繰り返す」にします。
動きとせりふと音がぴったり合ってほしいので、始まりを合わせるために、「緑の旗を押されたとき」もくっつけます。
さて、旗を押してみましょう。
どうなるでしょう。
これだと、音が速すぎます。
音が鳴る時間を少し長くしてみます。
0.25は、小数ですね。
３年生で習います。
もう習っていますか？
0.01ずつ増やすと時間がかかりそうなので、少し思い切って、0.5にしてみます。
どうなるでしょう。
やってみます。
まだ、音のほうが速いですね。
１にしてみます。
これでぴったりですね。
さて、もっと音を付け足しますよ。
「うーん」と考えている時にも音を鳴らしたいです。
今度は、「ビブラスラップ」にしてみます。
「うーんと考える」のは２秒なので、２拍鳴らしましょう。
さて、緑の旗を押してみます。
いいですね。
仕上げをする
かぶにも動きと音を付けたいと思います。
引っ張られた後に、「まだまだぬけないぞ！」と言わせます。
かぶのスプライトを選択します。
「こんにちは！と言う」ブロックをコードエリアに持ってきて、せりふを変えましょう。
そして、今まで通り、「緑の旗が押されたとき」をくっつけます。
さて、ここで問題があります。
登場人物が引っ張っている時、かぶは動かないで止まっていてほしいです。
この動きにぴったりなブロックはどれでしょう。
そうですね、今まで何度も使ってきた「待つ」ブロックです。
では、何秒待たせたらよいでしょう。
おじいさんのコードエリアをみて考えてみましょう。
秒数が細かく書いているので、せりふのブロックがヒントになりそうです。
どうですか、見当がつきますか？
プログラミングでは、思った通り動かすためにどうしたらいいのか考えることがとっても大切です。
みなさんなら何秒にしますか？
かぶを引っ張って戻るのに２秒。
それを三回繰り返すので、２×３で６秒。
そのあと２秒考えるので、６＋２で８秒。
８秒にしてみましょう。
さあ、うまくいくといいですね。
よく見ていてください。
いいですね。
さらに、動きを付けましょう。
せりふが終わった後に、少しかぶを動かします。
「15度回す」のブロックを使ってみましょう。
緑の旗を押してチェックします。
これでいいです。
最後に、かぶの動きと同時に音が出るようにします。
おじいさんのコードエリアの所にある音楽のブロックに付け足すのが簡単です。
「クラーベ」という音を鳴らします。
「ビブラスラップ」の後に、プロックを付けます。
「1秒待つ」も入れましょう。
さて、緑の旗を押してチェックしてみますよ。
かぶの動きと音が合いませんね。
２秒待たせてみます。
チェックしますよ。
これでいいですね。
大きなかぶの一場面、完成です。
ファイルの保存と開き方、サインアウト
では、最後にとても大事なことを教えます。
低学年の動画で見た人は復習になります。
スクラッチでは、作った作品をそのまま取っておくことができるのです。
左上にある「ファイル」タブをクリックして、「直ちに保存」をクリックします。
すると、右上に「プロジェクトが保存されました」と出ます。
その隣のユーザー名をクリックすると、「私の作品」と出てくるのでクリックします。
このように、保存されています。
いらないものは「削除」という青い字をクリックすると消えます。
また、次サインインして、「作る」のページに入った時は、今確認したのと同じことをします。
「ユーザー名」、「私の作品」とクリックして、開きたいファイルを見つけます。
そして、「中を見る」をクリックすると、取っておいたまま、また出すことができます。
途中でやめた時も保存しておけば、続きから始められるので便利ですよ。
もう今日はスクラッチやらないよ、というときは、「サインアウト」をします。
「ユーザー名」をクリックして、「サインアウト」をクリックします。
これだけです。
画面からユーザー名が無くなっていればOKです。
まとめ
さて、今回のレッスンはここでおしまいです。
皆さんは、スプライトのキャラクターを作ったり、せりふを付けたり、音を付けたりできるようになったはずです。
そのために紹介したブロックはほんの一部です。
自分でやってみて、物語にピッタリなプログラミングを目指しましょう。
ぜひお気に入りの物語で自分だけの一場面を作ってみてくださいね。
教科書に載っているお話や、昔好きだった絵本を参考にするのもおすすめです。
うさぎとかめは？うらしまたろうは？どんな場面でも作れそうですね！
また、もっとレベルアップして、自分で作った物語でもいいですね。
是非チャレンジしてみてくださいね。
次は高学年の皆さんに向けた動画を配信します。
チャンネル登録がまだの方は、登録をお願いします。 それでは、次のレッスンでお会いしましょう。
