前回は、魚やサメの大まかな動きを設定することができましたね。
今回は、魚の当たり判定やゲームオーバー・クリアの表示まで、やっていきますので、最後まで頑張ってゲーム制作しましょう。
なお、＜前編＞を取り組んでいない方は、まずそちらから取り組んでください。
Table of Contents
スクラッチの迷路ゲームの作り方①背景を迷路の海にしよう！
それでは、前回設定した海底の背景を自分でカスタマイズしていきましょう。
まず、①ステージ画面をクリックすると、②背景に切り替えます。
そして、③四角形のアイコンを選択して、④塗りつぶしなしにしましょう。
⑤枠線の色は、なんでも良いですが、今回は黒にします。
さらに、⑥枠線を太くして、⑦何個も選択して、あなたオリジナルの迷路を作ってください。
参考までに、今回のゲームで使用した背景は以下の画像の通りです。
スクラッチの迷路ゲームの作り方②助ける魚を作ろう！
次に、オレンジの魚が助ける仲間の魚を作りましょう。
まず、スクラッチに用意されている魚の画像をもう一度、選択します。
オレンジの魚をコスチュームを選択すると、他に3種類の魚がいることがわかるでしょうか。
今回は、青い魚だけ使いたいので、他の魚の画像を削除しましょう。
青い魚だけにしたら、左右を反転して、大きさを100→40へ小さくしましょう。
魚の位置は、マウス操作で、右上端に移動させます。
スクラッチの迷路ゲームの作り方③柵を作ろう！
今度は、何もないところから絵を描いて、仲間の魚が閉じ込められているサクを用意します。
まず、①描くを選択し、②ビクトマップに変更します。
ベクターでもピクトマップでもどちらでも構いません。
やりやすい方で、絵を描いてみてください。
③四角形の図形を選択し、引っ張って柵を作りましょう。
なお、色は茶色など、サクのような色にしておいてください。
最後に、サイズを15など適切な大きさに調整し、右上端までマウスで移動させます。
もう一つサクが必要なので、右クリック→複製で、コピーします。
向きを0にしてから、マウスで柵の位置を微調整しましょう。
そして、上の画像のように、サクに青い魚が閉じ込められている状況になっていれば、完成です。
スクラッチの迷路ゲームの作り方④細かい微調整をしよう【休憩】
ここで、キャラクターの大きさや数、名前など微調整しておくことで、この後のゲーム制作をスムーズにできるようになります。
まず、オレンジの魚の大きさは、100→70と小さくしておきます。
そして、右下端まで移動させましょう。
次に、オレンジの魚のコードを見ると、x座標が10ずつ動くようになっていますが、これだとちょっと早すぎます。
そのため、10→2に変更しましょう。
さらに、サクを開けるためのカギを用意します。
これは、スクラッチに元から用意されている画像から選択することが可能です。
左上端に配置しておきましょう。
最後に、以下の画像のように名前をきちんと正しく書いておきましょう。
名前をわかりやすく変更しておくことで、魚の死亡判定を設定するときに役立ちますよ。
スクラッチの迷路ゲームの作り方⑤魚の死亡条件を作ろう！
オレンジの魚を選択した状態で、コードを追加します。
まず、もし〜ならのブロックに「◯色に触れた」を入れ込みましょう。
ここでは、「魚がどの色にあたったら、死亡するのか？」を決めます。
②色をクリックして、 ③ペンのマークを押します。
虫メガネが出てくるので、迷路の黒い線の色を選択しましょう。
そして、今度は「見た目」の「こんにちは！と2秒言う」を入れ込みます。
また、「こんにちは！」→「痛い！」と変更しましょう。
そして、死亡する＝ゲーム終了とするので、このゲームを止めたい場合は「すべてを止める」を引っ張って入れ込みます。
これで、魚が黒い枠に当たったら、「痛い！」と発言して、ゲーム終了します。
次に、魚がサメに当たったら、死亡するコードを作っていきます。
サメは2匹いるので、サメ1またはサメ2 のどちらかに当たったら、死亡するように設定します。
そのためには、上記の「演算」→「〇〇または〇〇」を選択してください。
次に、「動き」の「マウスポインターに触れた」を二つ、演算のブロックに入れ込みます。
それぞれ、サメ1とサメ2に設定してください。
最後は、上の画像のように、「食べられた！」と記載して、すべてを止めるブロックを入れます。
作ったブロックは、上の画像にあるように、もし〜ならのブロック下に追加で入れておいてください。
スクラッチの迷路ゲームの作り方⑥魚とカギの動きを連携させよう！
次に、カギと魚の動きを連携させます。
まず、カギが大きすぎるので、ゲーム開始時に、小さくなるように、大きさを100％→50%に変更しましょう。
次に、「もしカギが魚に触れたらどうなるのか？」のコードを作っていきます。
「マウスポインター」→「さかな」に変更しておいてください。
「ずっと」を「もし〜なら」の外側に設定し、「動き」の「どこかの場所に行く」を引っ張ってきます。
そして、「さかなへ行く」に変更してください。
そして、魚に付いていきながらも、魚よりも前に表示させたいので、「最前面」に変更してください。
さらに、ゲーム開始時に固定の場所からスタートするように、x座標とy座業をできるブロックを旗ボタンの下においてください。
ついでに、オレンジ色の魚も、ゲーム開始時に所定の位置から始められるように、x座標とy座標の場所を固定しておいてください。
スクラッチの迷路ゲームの作り方⑦サクの表示と非表示を設定しよう！
カギをサクまで連れて行くことができたら、サクを消しましょう。
上の画像のように、ブロックを設定しておいてください。
旗ブロックの下に「表示する」を。
もし〜ならの中に、「隠す」を設定しましょう。
サクがカギに触れたら、ゲームクリア画面を表示します。
ゲームクリアとゲームオーバーの画面は後ほど、作成します。
ですが、ゲームクリアを表示するには、その指令を送らなければいけません。
そのため、「ゲームクリア」のメッセージを作成しましょう。
上記のように、右クリック→新しいメッセージを選択。
そして、「ゲームクリア」とメッセージ名を入力してください。
スクラッチの迷路ゲームの作り方⑧ゲームクリアとゲームオーバーの作成
ゲームクリアとゲームオーバーの画面を設定したいので、自分で描いて作りましょう。
上記のように、描くを選択してください。
キーボード入力で、テキストを打ち込みましょう。
色は、なんでも大丈夫です。
同じく、ゲームクリアも作っておいてください。
ゲームクリアを作成したら、今は表示したくないので、目のマークを切り替えて、非表示しておきましょう。
ゲームオーバーも同じく非表示にしておきます。
そして、ゲームクリアの画面をコードを作って、画面の表示と非表示を設定しましょう。
上の画像のように、「ゲームクリア」を受け取ったときに、「表示する」を作ります。
さらに、旗マークの下に「隠す」を置いてください。
これで、ゲーム開始時には、ゲームクリアが非表示になり、クリアすると表示されます。
「ゲームオーバーを受け取った」時に、ゲームオーバーの画面を表示する。
「ゲームオーバー」のメッセージを作っておいてください。
ゲーム開始時に非表示にするようにしましょう。
最後に、オレンジ色の魚の画像を選択しましょう。
「イベント」の「ゲームオーバーを送る」を魚が死んだ時の「もし〜なら」の場所に入れておいてください。
これで、今回の記事でのゲーム作成は終了です！
お疲れ様でした！
まとめ：余裕のあるお子さんは、発展編にも挑戦しよう！
ここまで、スクラッチで作る迷路ゲームを詳しく解説してきました。
一つのゲームを最後まで作り切るのはなかなか大変なので、よく頑張りましたね。
さらに、迷路ゲームをカッコよくしたい方は、最後の発展編の記事も参考にしてみてください。
また、スクラッチにすでに慣れてきたお子さんは、Unity（ユニティ）に挑戦してみると良いでしょう。
スクラッチよりも複雑で高度なゲームを作成できますし、アプリリリースもできますよ。
興味のある方は、関連記事を紹介しておきますので、ぜひご覧になってください。
お疲れ様でした！
おつると申します。２児の息子の専業主婦です。長男は、ややADHD気質がありますが、毎日子育て奮闘中。夫が、発達支援の仕事をしていたこともあり、いつも勉強になります。日々感じたことを子育てで役に立つノウハウとして記事でアウトプットしています。デザインが得意！ブログのサムネイル、アイコンなど、すべて手作りです！よろしくお願いします！
コメントを残す