Scratchで迷路ゲームの作り方②|壁の作成とゴールの当たり判定を追加する方法

迷路の壁を複数のコスチュームに分けて作成した画像 Scratchゲームの作り方
迷路の壁を複数のコスチュームに分けて作成

🔍この記事では、Scratch迷路ゲーム 「Escape the MAZE3」 を作りながら、
制作方法を解説しています。

第2回では、以下の内容を進めていきます。

  • 迷路のを描く方法
  • プレイヤーとの当たり判定
  • ゴールの作成と判定処理

✅第1回【背景の設定・スタートボタン・移動処理の実装】はこちら👇

迷路の壁を作成する

プレイヤーが端まで移動したときに画面を切り替えたり、
当たり判定を付けるために「」をスプライトで作成します。

① 画面いっぱいにマスを並べる

  • 新しいスプライトを作成
  • 1マス 60×60 の正方形を描く
  • コピー&貼り付けで縦一列に並べる
     ※マス同士が重ならないように配置する
     👉 画面切り替え時に壁に挟まらないようにするため
  • 縦1列をグループ化し、横に等間隔で並べる
Scratchでダンジョン風迷路ゲームを作る②スプライトのコスチュームに正方形を並べた画像

② 通路を作る

  • 全体を選択してグループ化を解除
  • 通路作成前にコスチュームを複製
  • 任意のマスを削除して通路を作る
     👉 連続したマスを削除すると道になる
Scratchでダンジョン風迷路ゲームを作る②並べた正方形から通路部分を削除した画像

③ 隣接する迷路を作成「右に抜けたとき」

  • 新しいコスチュームを選択
  • 先ほどの右端の通路とつながるように左端のマスを削除
  • 行き止まり分岐を作って迷路感を出す
Scratchでダンジョン風迷路ゲームを作る②壁のコスチュームで左へ抜ける通路を設けた画像

④フロア全体を作る

  • 次のコスチュームに切り替えて隣接する通路を追加
  • 迷路の外枠部分は残しておく

💡行き止まり部分をうまく配置すると「ダンジョン感」が出る

Scratchでダンジョン風迷路ゲームを作る②壁コスチューム一覧を並べて表示させた画像

⑤コスチューム名を設定

⭐コスチュームは変数で管理するため「数字」で統一
  例:00, 01, 02 …

Scratchでダンジョン風迷路ゲームを作る②壁コスチュームを並べて表示させ、それぞれのコスチューム名を明記した画像

壁のコードを作成する

  • スタート時に変数「タテ」「ヨコ」を”0”にリセット
  • ずっとコスチュームを「タテ」「ヨコ」に設定
Scratchでダンジョン風迷路ゲームを作る②壁のコードブロック画像(スタート時に変数をリセットする設定)

例:
00)からスタート → プレイヤーが右に抜ける
  👉 「ヨコ」が+1 され、コスチュームが「01」に変わる

壁を立体的にしたい場合

  • スプライトをコードごと複製し、上から四角形を重ねる
     👉変数初期化のコードは削除して重複を防ぐ
  • ただしコスチュームのズレで壁に埋まることがあるため、
     👉 当たり判定用と見た目用でスプライトを分けるのがおすすめ
     👉迷路完成後に作成するのがおすすめ
Scratchでダンジョン風迷路ゲームを作る②壁コスチュームを立体的に描いた画像

プレイヤーが壁に当たったときの判定

「プレイヤー(仮)」のコードに以下を追加します。

  • スプライト『壁』に触れた」を判定に利用
  • 進む速さと同じだけ反対側に戻す
  • 「→」「↑」「←」「↓」の処理にそれぞれ追加
Scratchでダンジョン風迷路ゲームを作る②プレイヤーのコードブロックに壁に触れたときの処理を追加した画像

🏴動作確認

💡チェックポイント

  • 画面切り替え時に壁に埋まって動けなくならないか
  • プレイヤーが壁に当たると動きが止まるか

ゴールを作成する

  1. 新しいスプライトを作成し、壁の間に収まる四角形を描く
  2. ゴールを置きたい場所の座標に設置
  3. ○○に触れた」ブロックを利用し、
     👉 プレイヤーに触れたら「ゴール」を送信
  4. ゴール後は変数「タテ」を変更し、再度触れないように管理
Scratchでダンジョン風迷路ゲームを作る②ゴールのコードブロック(指定の画面、座標で表示させ、プレイヤーが触れたときにゴールを送る)画像

🏴動作確認

💡チェックポイント

  • 指定の画面でのみゴールが表示されるか
  • プレイヤーがゴールに触れたらゴール画面に切り替わる

まとめ

今回は、以下の内容を解説しました。

  • 迷路の壁を作成して通路を作る方法
  • プレイヤーと壁の当たり判定
  • ゴールの配置と判定処理

次回は、階段と2階部分を作成して、フロアの移動方法 を紹介します!

✅次の記事はこちら👇

コメント

タイトルとURLをコピーしました