スクラッチ

スクラッチはプログラミングを始めるのにおすすめ!簡単なゲームの作り方を紹介

Scratch プログラミング(9)
むらっち
むらっち
こんにちは!キッズプログラミング教室アルスクールのむらっちです。

アルスクールのメイン教材は、Scratch(スクラッチ)です。

レッスンでは、スクラッチを使って、子供自身が何を作りたいか考え、試行錯誤しながら、色々な作品を創っています。

作品の種類としては、やはりゲームが一番多く、あとはアニメーションやキャラデザインなどもしています。

スクラッチの作品

 

在校生の子がスクラッチで作った作品を紹介します。
アルスクールキッズ(小学生)の作品

分からないところは講師がサポートしますが、基本的には子供自身がどう創りたいか考えて、完成までがんばって作った作品です。

アルスクールでは、プログラミングをドリル的に学ぶのではなく、得たスキルを組み合わせて使いこなすまで学びます

次の章からは、スクラッチを教えてきた中で感じた教材としての良さや、初心者でも作れる作品例について紹介していきます。

online-banner>> アルスクールのオンラインレッスンの詳細はコチラ

 

スクラッチがプログラミング教材として使われるのはなぜ?

小学生でも学びやすいから

スクラッチは、マサチューセッツ工科大学(MIT)のライフロング・キンダーガーテンというグループによって開発されました。

スクラッチには、【10歩進む】や【「こんにちは!」と言う】などの、ブロックがあらかじめ準備されています。

Scratch プログラミング(1)

プログラミングと聞いて思い浮かぶのは、真っ黒な画面に何やら細かい文字のオンパレード…。これが大きなハードルでした。

ビジュアルプログラミング0(6)

ママ
ママ
これを見るとパソコンを閉じたくなるわね。 

 

ビジュアルプログラミングの場合、文字が書いてある【ブロック】を真ん中のスペースに移動するだけで、コンピューターに指示を出すことができます。

スクラッチ プログラミング

そのため、直観的に動作を理解しやすいのです。

これにより、小学生でもプログラミングを楽しく学べるようになりました。

また、スクラッチは無料であることも、広く利用されている理由となっています。

 

創造性が育つ教材

また、スクラッチには、創造性を伸ばせるというメリットもあります。

開発者のミッチェル・レズニック教授は、【Creative Learning】(創造的な学び)という教育理念を提唱しています。

スクラッチは、この【創造的な学び】が、継続的にできるように設計されています。

ママ
ママ
創造力はこれからの時代に大切って聞いたことがあるわ。

ミッチェル・レズニック教授の論文では、創造的な学びをするために必要な要素①~⑤が紹介されています。

  1. 何を作るかを想像する(Imagine)
  2. 想像したものをつくる(Create)
  3. 自分で遊ぶ(Play)
  4. 友人や家族に共有したくなる(Share)
  5. 様々なフィードバックを得ることができる(Reflect

①~⑤を繰り返す、このようなスパイラルを【Creative Learning Spiral(創造的な学びのスパイラル)】と言います。

参照:media.mit.edu

スクラッチは、他の教材とちがって、小1の初心者でも作れる簡単な作品から、本物のSwitchのゲームと同じようなレベルまで作れます。

そのため、「スキルを学ぶ→試しに何か作る」を繰り返していけば、どんどん創造性の高い作品をつくっていけるのです。

 

小学校でもよく使われる

スクラッチは、現在小学校のプログラミング教育で最も使われています。
(例)正多角形をプログラムを使ってかく、ねこから逃げるプログラムを作る

ママ
ママ
算数の時間にプログラミングするなんて、昔の授業とはずいぶん変わったのね。

実際に、小学校ですでにスクラッチを使ったプログラミング授業の実施例がたくさんあり、文部科学省などのサイトで実施例を見ることができます。
参照:小学校を中心とした プログラミング教育ポータル_文部科学省、総務省、経済産業省

 

Scratch(スクラッチ)の使い方

Scratch3.0を起動すると、次のような画面になります。

Scratch プログラミング(1)

主な画面説明

  • 左上:地球マーク(言語選択)、ファイル(保存/読み出し)
  • 左端:ブロックのカテゴリ
  • 左端2番目:ブロックの種類
  • 中央:ブロックを置くところ
  • 右上:スプライトが実際に動く様子を確認する画面
  • 中央右下:スプライト(キャラクターや物など)選択
  • 右下:背景選択

 

長方形のジグゾーパズルのような形のものが「ブロック」です。

ブロックを中央にドラッグして縦につなげることで、「動作の順序」を指示します。

どこに何があるか覚えるのが難しいなー。
むらっち
むらっち
大丈夫!やっていけばすぐに慣れるよ!

 

まず、最初に出てくる「ネコ」を動かしてみましょう。

ネコを動かすための手順を解説します。

手順

  1. イベント」から「緑の旗がクリックされたとき」を中央にドラッグ
  2. 動き」から「○歩動かす」を中央にドラッグして、下につなげます。
  3. ○に「100」と記入。
  4. 緑の旗」を押して実行します。
Scratch プログラミング(2)

右上の緑の旗を押すと、ネコが右に動きました。

ネコが動いた!100歩って、これくらいしか動かないんだ!

同じように他のブロックも配置すると、ブロックに書いてあるように動かすことができます。

例:15度回す、「こんにちは」と言う、など

これがはじめの一歩です。

 

Scratch(スクラッチ)の簡単作品例|サッカーゲーム

むらっち
むらっち
まずは、簡単なサッカー(PK)ゲームを作ってみよう!

サッカー大好き!

1つ目は、「ボールとキーパー」のサッカーゲーム、

2つ目は、「ボールとキッカーとキーパー」のサッカーゲームを紹介します。

 

簡単サッカーゲーム①|ボールとキーパー

むらっち
むらっち
「ボールをクリックしたら、ボールがゴールの方へ進む」っていう簡単なゲームだよ。

このゲームは、次のように作ります。

  1. 緑の旗を押す ⇒ キーパーが左右に動き続ける、ボールが所定の位置にいく
  2. サッカーボールをクリック ⇒ ボールがゴールの方へ動く
  3. ボールがキーパーに当たる ⇒「ざんねん!」と表示
  4. ゴールする ⇒「ゴール!」と表示

 

むらっち
むらっち
作り方を解説するね。

まずは、背景とキャラクターを選びます。

  • 背景 ⇒ 右下の【背景マーク】を押す
  • キャラクター ⇒ 右下の【ネコマーク】を押す
Scratch プログラミング(52)

このゲームでは、「Soccer」と書かれているサッカー場の背景を選択しました。

Scratch プログラミング(28)

背景ってたくさん選べるんだね!サッカー場も2つある!

そうすると、背景がサッカー場になります。

Scratch プログラミング(29)

 

次に、キーパーとサッカーボールのスプライト(キャラクター)を右下のネコのブロックから追加します。

キーパーは、「Casey」を選択。

Scratch プログラミング(30)

 

ボールは、「Soccer Ball」を選択。

Scratch プログラミング(32)

 

すると、画面はこのようになります。

Scratch プログラミング(33)

キーパーとボールがあらわれた!

 

むらっち
むらっち
ここからは、左側にあるブロックを使って、動きをつけていくよ。
むらっち
むらっち
まずは、キーパーから。

ここでは、「緑の旗を押す ⇒ キーパーが左右に動き続ける」ようにします。

キーパーのスプライトを選択し、ブロックを以下の画面のとおり並べます。

Scratch プログラミング(34)

なにこれ…、いきなり難しい。
むらっち
むらっち
大丈夫!一つ一つの意味が分かれば、そんなに難しくはないよ。
むらっち
むらっち
並べたブロックの意味を解説するね。
  • 90度に向ける」:方向に動かしたいときに使う
  • 回転方向を左右のみにする」:キーパーが回転しないようにする
  • 大きさを80%にする」:キーパーを小さくする
  • ずっと」「10歩動かす」「もし端についたら跳ね返る」:左右に動き続ける
むらっち
むらっち
これでキーパーのプログラムは完成!
むらっち
むらっち
緑の旗を押すと、「キーパーが左右に自動で動くこと」を確認できるよ。
Scratch プログラミング(40)

すごい!キーパーがずっと動いてる!

 

むらっち
むらっち
次は、ボールのプログラムを作っていくよ。
Scratch プログラミング(33)

ここでは、次の4つができるようにします。

  1. 緑の旗を押す ⇒ ボールを所定の位置に置く
  2. ボールをクリック ⇒ ゴールの方へ動く
  3. ボールがキーパーに触れる ⇒「ざんねん!」と表示
  4. ボールがゴールまで届く ⇒「ゴール!」と表示

 

ここでは、ボールのスプライトを選択し、ブロックを以下の画面のように並べます。

Scratch プログラミング(35)

キーパーのときよりたくさんある…、やっぱり難しそう。
むらっち
むらっち
一つ一つは簡単なコードだよ。一緒に確認してみよう。

まずは、「緑の旗を押したとき」から解説します。

Scratch プログラミング(41)
  • 「X座標を0、Y座標を-125にする」:ボールを所定の位置に置く
  • 「0度に向ける」:ボールを上方向に動かしたいときに使う

緑の旗を押すと、ボールが所定の位置にいくことを確認できます。

ボールがゴールの下に移動した!

 

スクラッチでは、X座標とY座標を指定することで、場所を指定することができます。

右下のX座標とY座標を変えれば、どの値でどこの場所になるかを確認できます。

Scratch プログラミング(39)

XとYの数字を変えれば、ボールの場所が変わるんだね。
むらっち
むらっち
そのとおり!XとYの場所を変えれば、好きな位置にボールを置くことができるよ。
むらっち
むらっち
これでサッカーボールをける前の場所が決まったね。

うん!ここまでできたよ。

 

むらっち
むらっち
次は、サッカーボールを押したときに、サッカーボールがゴールの方へ動くようにしよう
むらっち
むらっち
このとき、キーパーに取られたら「ざんねん!」、ゴールできたら「ゴール!」とでてきたらおもしろくない?

うん、ゲームっぽくなってきたね!

ここでは、「このスクリプトが押されたとき」からを解説します。

Scratch プログラミング(42)
  • 「ずっと」「10歩動かす」:ボールをゴールの方へ動かし続ける
  • 「もしCaseyに触れたなら」「ざんねん!と2秒言う」「すべてを止める」:ボールがキーパーに触れたら「ざんねん!」と表示され、すべてを止める
  • 「もし端に触れたなら」「ゴール!と2秒言う」「すべてを止める」:ボールが端に触れたら「ゴール!」と表示され、すべてを止める

ここまでできたら、緑の旗を押したあとに、ボールをクリックすると、すべての動きを確認することができます。

ボールがキーパーに触れたら、「ざんねん!」と表示されます。

 

ボールが端までいくと、「ゴール!」と表示されます。

むらっち
むらっち
これで完成だよ!

やったー!サッカーゲームを作れた!

 

簡単サッカーゲーム②|ボールとキッカーとキーパー

むらっち
むらっち
今度は、「ネコ」をキッカーにした、簡単サッカーゲーム②の作り方だよ。

サッカーならキッカーは必要だよね。

簡単ゲーム②は次のように作ることにします。

  1. 緑の旗を押す ⇒ キーパーが上下に動き続ける、ネコとボールが所定の位置にいく
  2. ネコをクリック ⇒ ネコがボールの方へ動く
  3. ネコがボールに触れる ⇒ ボールが右に動く
  4. キーパーに当たると、「ざんねん!」と表示
  5. ボールが右端に当たると、「ゴール!」と表示

 

ここでは、競技場(Playing Field)の風景を選びました。

Scratch プログラミング(3)

次に、サッカーボールとキーパー(Casey)のスプライトを追加します。

Scratch プログラミング(4) Scratch プログラミング(5)

 

すると、画面は次のようになりました。

Scratch プログラミング(6)

今度は公園でサッカーしてるみたいだね。

 

むらっち
むらっち
今回は、キーパーが【上下方向に自動で動く】ようにするよ。
むらっち
むらっち
まずは、キーパーから動きをつけていこう。

まずは、キーパーのスプライトを選択し、ブロックを以下の画面のとおり並べます。

Scratch プログラミング(25)
むらっち
むらっち
並べたブロックの意味を説明するね。
  • 「180度に向ける」:キーパーを下方向に動かすときに使う
  • 「回転方向を左右のみにする」:キーパーが回転しないようにする
  • 「大きさを80%にする」:ボールに合わせてキーパーを小さくする
  • 「ずっと」「10歩動かす」「もし端に着いたら、跳ね返る」:端についたら跳ね返り、上下に動き続けるようにする

ゲーム①とちがうのは、「180度に向ける」だけだね。
むらっち
むらっち
そのとおり!よく気づいたね。

緑の旗を押すと、「キーパーが上下に動き続けること」を確認できます。

Scratch プログラミング(50)

 

むらっち
むらっち
次はネコに動きをつけていこう。

ネコの動きは、次のようにします。

  1. 旗を押すと、所定の場所(X座標:-50,Y座標:0)に移動する
  2. ネコをクリックすると、ボール(X座標:0,Y座標:0)まで走る
  3. ボールまで走ったら、シュートする

この動きをさせるためにブロックは次のように並べます。

Scratch プログラミング(26)
むらっち
むらっち
並べたブロックの意味を説明するね。

旗が押されたとき

  • 「X座標を-80,Y座標を0にする」:ネコを所定の位置におく

 

このスプライトが押されたとき

  • 1秒でX座標を0に、y座標を0に変える
  • シュートを送る

ここでは、ネコがボールに触れたらボールを動かすために「シュートを送る」というブロックを使っています。

ボールのコードで、「シュートを受け取ったとき」というブロックを使うと、ネコにボールが触れたと同時にボールを動かすことができますよ。

 

緑の旗を押して実行すると、ネコがボールまで走ります。

Scratch プログラミング(51)

むらっち
むらっち
ここでは、ネコの最初の場所とボールまで走るときの場所を決めて動かしたんだよ。

あれ?でもボールが動かないよ。

むらっち
むらっち
ボールは、ボールのプログラムを作らないと動かないんだ。

 

むらっち
むらっち
では、ボールの動きをつけていくよ。

ここでは、「ネコがボールに触れたとき、ボールが右方向に動く」ようにします。

ボールのスクリプトを選択し、コードを次のように並べます。

Scratch プログラミング(27)

ゲーム①のボールのコードと似ているね。
むらっち
むらっち
よく気づいたね。では、並べたブロックを説明するよ。
Scratch プログラミング(46) Scratch プログラミング(47)
  • 「X座標を42、y座標を-33にする」:所定の位置にボールを置く
  • 「90度に向ける」:ボールを右方向に動かしたいときに使う
  • 「シュートを受け取った時」:ネコがボールに触れたとき

あとは、簡単ゲーム①と同じように、キーパーに触れると「ざんねん!」、画面右端に無事たどり着くと「ゴール!」と判定されるようにブロックを並べています。

 

キーパーに止められたところ

Scratch プログラミング(49)

ゴールが決まったところ

Scratch プログラミング(48)
むらっち
むらっち
これで完成だよ!
むらっち
むらっち
さあ、キーパーの動きをみて、タイミングよくネコをクリックしてみよう!

 

他にも、【簡単アクションゲームの作り方】・【簡単シューティングゲーム】の作り方を紹介していますので、参考にしてください。

アクションゲーム作り方14
Scratchを使った【簡単アクションゲーム】の作り方|横スクロールしてアイテムを取る方法Scratchでの簡単なアクションゲームの作り方についてご紹介しています。シンプルなゲームに比べ、アクションゲームの作成はちょっと難しくなりますが、背景の設定方法やジャンプの仕方、ゴールの設定方法やクリア画面の作り方についてなどをおさえて自分なりのアクションゲームを作ってみましょう。...
スクラッチシューティングゲームアイキャッチ
【Scratch】簡単シューティングゲームの作り方|敵・弾・スクロールの動きを作ろうScratchで簡単に自分でできるシューティングゲームの作り方についてご紹介しています。自分や敵キャラの動かし方など基本的なものをおさえて、自分だけのオリジナルゲームを作成してみましょう。また応用編としてライフの設定や音楽やBGMをつけたりと、より本格的なシューティングゲームを作って楽しみましょう!...

 

Scratch(スクラッチ)のプログラミング例【動画】

Scratch プログラミング(12)

今度は、動画でScratchのプログラミング例を紹介します。

簡単な【シューティングゲーム】の作り方を動画にしました。

【サルが飛んでくるボールに当たらないように逃げるゲーム】です。

 

4本の動画に分けて、解説します。

1本目:【背景とキャラクター選び】を解説

 

 

2本目:【矢印キーでサルを上下に動かす】を解説

 

3本目:【ボールが地球からサルに飛んでいく】を解説

 

4本目:【ボールがはしに当たったら地球に戻る・サルに当たったらゲーム終了】を解説

 

こちらは、初心者でも簡単に作れるシューティングゲームです。

動画を参考に作ってみてください。

今回の例で作成したゲーム1つとっても、作っているうちにさらなる改善点や要望がみえてくることでしょう。

例えば、次のようにすれば、もっとおもしろいゲームになります。

  • 効果音や音楽をつける
  • 攻撃パターンを増やす
  • ボールに当たったらライフがへるようにする

自分の作品を良くしたい欲求が次々に生まれてくること、これこそがスクラッチの醍醐味といえます

「プログラミングを学びながら、創造性も伸ばせる」

そんなレッスンを体験してみたい方は、アルスクールに一度遊びにきてください。

無料体験レッスン

キッズプログラミング教室【アルスクール】では、オンラインで学べるでプログラミングレッスンを行っています。

実際のレッスンに参加できる無料体験で、一度アルスクールの学びを体験してみませんか。

online-banner

また、実際の教室でもレッスンを行っています。

  • 東京にお住まいの方 → 自由が丘校、中野校
  • 大阪にお住まいの方 → 大阪南千里校
  • 福岡にお住まいの方 → 福岡西新校

教室での無料体験レッスンをご希望の方は、こちらをご覧ください。

 無料体験レッスンを詳しくみる