Scratchから始めるシューティングゲームの作り方①〜最初のプロジェクトを作成


※ 当ページには【広告/PR】を含む場合があります。
2022/07/22
2022/08/02
Scratchから始めるシューティングゲームの作り方②〜弾の連射を自在にカスタマイズする
合同会社タコスキングダム|TacosKingdom,LLC.

Scratchプログラミング学習の最初の題材として良く取り上げられる定番はなんといっても、
「シューティングゲーム」です。

Scratchでプログラミングを勉強する上で、シューティングゲームのプログラミングコードは様々なテクニックをバランス良く含んでいるので、一通り自分の手で簡単なゲームを作れるようになるころには、かなりの実力が付いていることでしょう。

今回から数回に分けて、簡単なシューティングゲームの作り方を解説していきます。

初回となる今回は、以下のようなシンプルなシューティングゲームを、Scratchで作るにはどうするかの手順をじっくり考えてみます。

この記事にて、シューティングゲームの土台となるプロジェクトの作成手順を自分の手で作り上げていきましょう。


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchを学べるオンライン・駅前プログラミングスクール5選

新規プロジェクトの作成〜プレーヤーと敵と弾を配置する

ではScratch(ウェブ版)で、シューティングゲームで必須となる、「プレーヤー・敵・弾」の3つの要素を配置しましょう。

新規作成するプロジェクトを「シューティングゲーム①」にして、空のScratchプロジェクトを作成します。

合同会社タコスキングダム|タコキンのPスクール

プレーヤー(ゲームで操作するスプライト)は元からあるネコ(スプライト1)をそのまま利用するとして、打ち出す弾となるスプライトと、敵として出てくるスプライトの他2つを適当に追加します。

画面右下のスプライトパレットから、スプライトライブラリーを呼び出して、好きなものを2つ選択してScratchプロジェクトに配置してみます。

合同会社タコスキングダム|タコキンのPスクール

スプライト画像を呼び出してそのままのサイズだと、ちょっと大きいので、画像の大きさと場所を調整します。

スプライトパレットからネコを選択し、プログラミングブロック画面で、以下のようなブロックコマンドを作成してみます。

合同会社タコスキングダム|タコキンのPスクール

これで一旦プログラムを実行してみます。

🚩のマークの実行開始ボタンをクリックすると、

合同会社タコスキングダム|タコキンのPスクール

プレーヤーのゲーム開始の際の、最初の位置と大きさを指定することができます。

同じように、敵と弾の位置と大きさも調整してみましょう。

ボールと敵のスプライトのそれぞれのプログラミングブロックを以下のようにしてみます。

合同会社タコスキングダム|タコキンのPスクール

再び
🚩のマークの実行開始ボタンをクリックすると、弾と敵の位置も調整することが出来ました。

合同会社タコスキングダム|タコキンのPスクール

スプライトの画面を左右反転させる

このシューティングゲームでは、画面左側にプレーヤーを置き、横スクロール方式で画面右側から敵が出てくるようにするのが狙いです。

このままだと敵はプレーヤーと向き合うような画像になっていないので、左右反転を行う必要があります。

敵のスプライトを選択して、
[コスチューム]タブに切り替え、左右反転させたい画像の編集ツールから左右反転のボタンをクリックします。

合同会社タコスキングダム|タコキンのPスクール

すると、敵の画像がプレーヤーに向かう方向へ切り替わったことが分かります。


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchをしっかり学ぶためのオススメ書籍まとめ

キーボードからプレーヤーを動かす

次にプレーヤーをキーボードから上下左右に動かすことを考えていきましょう。

このブログでは、最終的に作り上げたシューティングゲームを
自作コントローラーから操作することも目標に掲げていますが、ともかく今はシューティングゲームとして動くプログラムを書き上げることを優先に進めていきます。

ネコのスプライトを選択して、プログラミングブロックを追加します。

キーボードの方向キーである4つの
、の各キーを押したときに、スプライトがどのように動かすかを決めるときには、[イベント]のブロックにある、●●キーが押されたときを使います。

合同会社タコスキングダム|タコキンのPスクール

これでプレーヤーがキーボードから動かせるようになります。


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchを学べるオンライン・駅前プログラミングスクール5選

プレーヤーから弾を発射させる

プレーヤーが動かせるようになったので、今度はプレーヤーから弾が発射できるようにしてみましょう。

キーボードから弾を発射するときのキーは基本的にどれでも選ぶことができますが、他のシューティングゲームを見ても、細長くて大きい
スペースキーを使うことが多いように思います。

ここでもスペースキーを押すと弾が発射されるようにしてみましょう。

まずば弾のスプライトを選択して、弾のコードブロックを追加していきます。

基本的に、弾は撃たなければ消えているのが通常ですので、ゲームスタート時は
非表示の状態から始めます。

合同会社タコスキングダム|タコキンのPスクール

弾はゲーム中に基本的に何度も同じスプライトを生じさせる必要があります。

なので、スペースキーが押される度にクローンがコピーされるように使うのがポイントです。

また非表示になっている弾のスプライトがクローンされるので、クローンされたときのコードは
表示するに切り替える必要もあります。

合同会社タコスキングダム|タコキンのPスクール

クローンされたとき、
スプライト1へ行くブロックで、ネコのスプライトの位置を自動で割り出し、そこにクローン弾を移動することが出来ます。

合同会社タコスキングダム|タコキンのPスクール

クリックを押すたびに弾は端に当たるまで消滅することなく画面右側へ飛び続けます。


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchをしっかり学ぶためのオススメ書籍まとめ

敵に動きをつける

シューティングゲームですので、敵が動かないとゲームとしてつまらないので、敵にも動きをつけてみます。

敵も先程説明したクローン弾のテクニックと一緒で、クローンすることで複数の敵をゲーム画面に出すことができます。

敵は画面の右端から現れて、プレーヤーにまっすぐ迫ってくるような動きにしてみます。

またここでは、敵の出現頻度は、三秒間隔で1体で出てくるようにします。

敵のスプライトのブロックコードを以下のように変更しましょう。

合同会社タコスキングダム|タコキンのPスクール

変更・追加のブロックは赤枠で囲った箇所です。

まず①は敵のスプライトのオリジナルは画面に表示せず、クローンだけを使うための処置です。

②のブロックでは、プログラムが実行されたらずっと三秒待ってから、クローンを生成するようなループになります。

③のブロックが、クローンで生成された敵の動きを決めている箇所です。

最初に敵クローンが出現する位置を右端のランダムなところからポッと出すようにしたいので、y座標を
-130から130までの乱数にします。

乱数で与えるy座標はおおよそ画面の上下を決める、
-160 〜 +160枠内の値で設定します。

y座標を+160以上(または-160以下)の範囲にしてしまうと、クローンしていきなり端(上下)に当たってしまって、表示されない敵クローンもあります。スプライトの画像の大きさも考えて、+130(-130)程度にするのが妥当です。

他は弾のスプライトで行ったように、x座標をマイナス方向に変えるループを使って、敵をプレーヤー側へ迫るようにしています。

合同会社タコスキングダム|タコキンのPスクール

これで三秒に1体の割合で、敵がプレーヤーに攻めてくるようなエフェクトをつけることが出来ました。


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchを学べるオンライン・駅前プログラミングスクール5選

当たり判定①〜敵が弾をあたると消える

シューティングゲームですので、打った弾が敵にヒットすると、敵と弾は同時に消える必要があります。

まずは弾のスプライトのほうに、
「敵との当たり判定」のブロックを追加してみます。

合同会社タコスキングダム|タコキンのPスクール

上の図で、赤枠で囲った部分が、新しく追加したブロック部分になります。

弾のクローンと敵のクローンがお互いに衝突すると、両方が消える必要あります。

そのため、敵のスプライトの方にも、
「弾との当たり判定」のブロックを追加しておかないといけません。

合同会社タコスキングダム|タコキンのPスクール

この処理の中で、もっとも重要なことが、お互いのクローンを削除する前に
「0.1秒待つ」という処理です。

これがないと、衝突してもどちらか一方が消えないということが起こります。

これは、Scratchの衝突判定の事情で、お互いに当たったときに、最初に当たったと判断された方のクローンが消されてしまうと、数ミリ〜数十ミリ秒遅れて、次にクローンの当たり判定を行っても、既に前のクローンが消去されてしまうので、何事もなかったかのように生き残ってしまうためです。

このようなどちらか一方が生き残ってしまうことを避けるために、当たったと判断された時から、お互い0.1秒ほど待てば、確実に両方が当たった、という処理にすることが可能です。

これを実行してみると、弾を受けた敵は、当たった弾と相打ちになってどちらも消滅させることができます。

合同会社タコスキングダム|タコキンのPスクール


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchをしっかり学ぶためのオススメ書籍まとめ

当たり判定②〜プレーヤーが敵にあたるとダメージを受ける

シューティングゲームで、敵が敵と呼ばれるのは、プレーヤーにダメージを与えるキャラクターだからです。

定番のシューティングゲームの場合、プレーヤーがダメージを受ける回数の上限が決まっていて、いわゆる
「残機数」とか、「残りライフ」とか、一定数を下回るとゲームオーバーとなる数値(グローバル変数)が存在しています。

とりあえずここでのゲーム開始時の残機数を3にして、プレーヤーが敵に当たるたびに、1づつ減っていくような仕組みを追加します。

プレーヤー(ネコ)のスプライトを選択して、
[変数] > [変数を作る] > [残り]という名前で新しい変数を用意しておきます。

合同会社タコスキングダム|タコキンのPスクール

この
残りという変数を利用して、敵と3回当たったらその時点でプログラムを停止させてみます。

プレーヤーのブロックコードを以下のように修正します。

合同会社タコスキングダム|タコキンのPスクール

まずは①の箇所によって、ゲーム開始時点で変数・
残りを3にしています。

②はプレーヤーのスプライトに処理させたい動きをブロックとして追加したものです。

このブロックでは、ゲーム中にずっと処理されるプレーヤーの処理ループの中で、敵と衝突するまで待ってから、衝突したら
残りを1つ減らします。

そして、
残りがゼロになった時点で、ゲームを終了させるようにしています。

一方で、プレーヤーと敵が衝突したときの処理として、敵のクローンのブロックコードに以下を追加します。

合同会社タコスキングダム|タコキンのPスクール

ここでは、
敵にヒットという「ユーザー定義イベント」を使って、イベントメッセージを他のスプライトにイベントの発生タイミングを送る、という動きもさせています。

ユーザー定義イベントは、ブロックパレットから
[イベント] > イベント定義ブロックのどれか > [新しいメッセージ]から新しいユーザー定義イベントが追加できます。

合同会社タコスキングダム|タコキンのPスクール

これで、敵が消滅する間際に、
敵をヒットイベントを他のスプライトへ送信し、その消滅を知らせることができます。

この
敵をヒットのイベントは、次の項目の、ハートのスプライトの処理の時に利用しています。

残機数を数値でなくてハートのライフで置き換える

ここまでの内容で、もっとも簡単なシューティングゲームが完成しているだろうと思います。

Scratchの変数表示は割とダサく感じるので、ハートのスプライトを残りの数だけ並べて分かりやすく画面に表示させてみます。

新たにハートのスプライトをサンプルから読み込んみます。

合同会社タコスキングダム|タコキンのPスクール

Scratchの変数表示はチェックを外して非表示にします。

合同会社タコスキングダム|タコキンのPスクール

プレーヤーのスプライト側には、もう
残りの変数表示の処理が要らないので、先程追加したブロックの一部を削除します。

合同会社タコスキングダム|タコキンのPスクール

さて、数字の分だけ画像を繰り返す処理は、
スタンプを使うのが一番簡単です。

余談ですが、スタンプ以外で同じようなことをするためには、
「ローカル変数によるクローンへの識別番号の割り振り」という中級テクニックを理解する必要があります。

合同会社タコスキングダム|タコキンのPスクール
【Scratch入門〜中級編】少しだけ難しいスプライトのクローンの高度な利用法

Scratchの中級者向けのテクニックとして、クローンの特殊な使い方を解説します。

「スタンプ」は、
背景の画像を上書きするだけの機能しかないので、スタンプした画像を他のスプライトより手前に表示させることはできません。

またスタンプとして書き込んだスプライトはそれ以降動かすこともできませんので、描いた後は消すことしかできないことに注意が必要になります。

スタンプは後付けで利用できる
拡張機能ですので、画面一番左下の拡張機能ボタンから呼び出して利用します。

合同会社タコスキングダム|タコキンのPスクール

ハートのスプライトのブロックコードを以下のように組みます。

合同会社タコスキングダム|タコキンのPスクール

ここでは
〇〇回繰り返すブロックで、ハートの画像を横方向ずらしながらスタンプ表示して、残りライフゲージを表現しています。

また、
敵がヒットイベントが呼び出されるタイミングで、ハートを再描画するようにすることで、プレーヤーが敵に当たってしまうと直ぐにダメージが反映されるようにすることができます。

このブロックコードを見ると、同じ作用をするブロックパートが存在するので、より効果的にプログラミングをするために、
「ブロック定義」を使ってまとめることも可能です。

合同会社タコスキングダム|タコキンのPスクール

ブロックパレットの
[ブロック定義]からハートを描くという名前で新しいブロック定義を作成します。

この
ハートを描くブロックに、繰り返し再利用する処理ブロックを入れることで、よりスッキリとしたコードにすることができます。

合同会社タコスキングダム|タコキンのPスクール


合同会社タコスキングダム|タコキンのPスクール【Pschool厳選】Scratchを学べるオンライン・駅前プログラミングスクール5選

まとめ

ということで以上、今回までの手順で作成したシューティングゲームのプログラミングでは、Scratchゲームとして以下のようなものになるでしょう。

もっと楽しくプレーできるゲームするためには、これからいろんな機能を継ぎ足していかないといけませんが、最も簡単なシューティングゲームの作り方としては、大体この記事で説明したテクニックで作成できるということを理解してもらうと良いと思います。