ページトップへ

子どものScratch迷路で壁をすり抜けるときは?移動前の座標に戻す壁判定の作り方

コラム

子どもがScratchで迷路を作ったのに、キャラクターが壁を通り抜けてしまう。「壁に触れたら止めたいのに、どこにブロックを足せばいいの?」と迷うことがあります。

動かす直前の座標を覚え、移動後に壁に触れていたら、その座標へ戻す方法で組んでみましょう。ただし、大きく動かして壁の向こうへ飛び越える場合は、移動を小さく分ける工夫も必要です。

ここでは、上下左右に動く迷路を対象に、壁の前で止まる仕組みだけを作ります。以下の手順やテスト表は、公式教材の接触判定を踏まえた本記事の制作例です。ジャンプ、重力、動く壁は対象に含めません。

壁を描くだけでは「通れない場所」にはならない

Scratchの迷路では、描いた壁に対して「触れたかどうかを調べ、その結果で動きを変える」処理を用意します。Scratch公式の条件分岐カードの迷路制作例(英語PDF)でも、壁の色への接触を条件として使う方法が紹介されています。

今回作るのは、壁に触れたらスタートへ戻る迷路ではありません。直前の移動だけを取り消し、壁の手前にとどまる迷路です。

順番は「覚える→動く→調べる→必要なら戻す」。まず右方向だけで作り、できてから残りの方向へ広げます。最初から複雑な迷路全体を直そうとせず、広い場所と一本の壁で試すと、確認する対象を絞れます。

最初は単色の壁と、動かないキャラクターで準備する

この制作例では、背景に単色の壁を描き、操作するキャラクターを一体置きます。壁の色は、通路や飾りに使っていない色を選んでください。

「調べる」にある「[色]に触れた」ブロックの色欄を開き、スポイトで壁の内側を選びます。色を目で似せるのではなく、実際の壁から取る方法は、ハーバード大学CS50のScratch教材(英語)でも説明されています。

  • 開始位置では、キャラクターを壁から離して置く。
  • 通路には、キャラクターが通れる余裕を持たせる。
  • 試している間は、コスチュームや大きさを変えない。
  • 以前作った移動用のスクリプトは、いったん切り離す。

古い移動処理を残したまま新しい処理を足すと、どちらが位置を変えたのか追いにくくなります。壁判定を組む間は、これから作る移動処理だけで確認しましょう。

通路の幅も大切です。Scratch公式の迷路制作カード(英語PDF)では、通路だけでなく角も通れる大きさにするよう案内しています。

右へ動く処理に「移動前のx座標」を入れる

操作するキャラクターを選び、「変数」で「移動前x」と「移動前y」を作ります。この例では、どちらも「このスプライトのみ」の変数にします。

下の文字は、Scratchのブロックを上から並べる順番です。貼り付けて実行するコードではありません。字下げした部分を、それぞれのブロックの内側に入れてください。「1」は、小さい移動で確かめるための設定例です。

緑の旗が押されたとき
  ずっと
    もし[右向き矢印キーが押された]なら
      [移動前x]を(x座標)にする
      x座標を(1)ずつ変える
      もし[壁の色に触れた]なら
        x座標を(移動前x)にする

「移動前x」に入れるのは、現在のx座標を表す丸いブロックです。開始位置の数字を手入力するのではありません。右へ動くたびに、その直前の位置を覚え直します。

「x座標を1ずつ変える」と「x座標を移動前xにする」も区別してください。前者は今の位置から動かす処理、後者は覚えた位置に置き直す処理です。

例えば、廊下を右へ進んだ先に壁がある場面。壁に触れていなければ新しい位置に残り、触れていれば一つ前の位置へ戻ります。これを繰り返す設計で、壁へ進み続けても位置が先へ進まない状態を作ります。

この方法は、移動前の位置が壁の外にあることが前提です。最初から壁に重なっている場合は、まずキャラクターを通路へ置き直してください。

上下左右は、方向ごとに「動く・調べる」を一組にする

右方向で壁を越えなくなったら、同じ「ずっと」の中へ、左・上・下の条件を加えます。保存する座標と動かす向きを、次のように対応させましょう。

押すキー 動く前に覚える値 試す移動 壁に触れた場合
右 移動前xにx座標 x座標を1増やす x座標を移動前xに戻す
左 移動前xにx座標 x座標を1減らす x座標を移動前xに戻す
上 移動前yにy座標 y座標を1増やす y座標を移動前yに戻す
下 移動前yにy座標 y座標を1減らす y座標を移動前yに戻す

各方向の「もしキーが押されたなら」の中に、保存・移動・接触判定・復帰をまとめます。右と上を押した場合も、横移動を調べてから縦移動を調べる構成にします。

横と縦を両方動かした後、まとめて元の位置へ戻す構成とは分けて考えてください。本記事の案は、壁に向かう横移動だけを取り消し、通れる縦方向は動けるようにすることを狙ったものです。

記事の途中で1分・5問

お子さまに合う学び方診断

正解・不正解を決める診断ではありません。今の様子から、取り組みやすい学び方の入口をご案内します。

角での動きは、キャラクターの形や通路によっても変わります。組み終わったら、直線だけでなく、曲がり角とキーの同時押しも試しましょう。

細い壁を越えるなら、速さではなく「一回の移動」を見直す

この設計では、動かした後の位置で接触を調べます。そのため、一回の移動を大きくすると、細い壁をまたいだ位置へ移り、調べる時点では壁に触れていないケースが考えられます。

速く動かしたい場合も、まずは「小さく動く→壁を調べる」を一組として繰り返す案を試してください。例えば、右方向の保存・移動・判定・復帰を「3回繰り返す」に入れ、毎回1ずつ動かします。この数字は比較用の設定例で、すべての作品に最適な値ではありません。

「3ずつ動いてから一度だけ調べる」のと、「1ずつ動いて毎回調べる」のは、確認する位置が異なります。繰り返す場合も、移動前の座標は各回の移動直前に保存し直します。

まず小さい移動で壁が機能することを確かめ、その後で操作感を調整しましょう。細い壁を越えたという理由だけで、迷路全体を描き直す必要はありません。

壁判定テスト表で「どの形で越えるか」を確かめる

次の表は、本記事の実装案を確認するためのテスト表です。「できた・できない」だけでなく、越えた場所と押していたキーを空欄に残してください。

試す場所・操作 目指す動き 結果・気づいたこと
壁に右から、左から近づく どちら側でも越えない ____
横向きの壁へ上下から近づく 上下とも壁の手前にとどまる ____
角で右と上を同時に押す 壁を越えず、通れる方向へ進める ____
最も狭い通路を通る 途中や角で引っかからない ____
細い壁へ向かって押し続ける 反対側へ飛び越えない ____

全部の壁を越えるなら、選んだ壁の色と、各方向の移動直後に判定が入っているかを見直す候補にします。特定の通路だけ進めないなら、壁とキャラクターの間に通れる余地があるかを確認しましょう。

背景の飾りの前でも止まる場合は、壁と同じ色を使っていないか見てください。この制作例は「壁という意味」ではなく「指定した色」に反応する設計だからです。

よくある質問(FAQ)

「もし端に着いたら、跳ね返る」では壁を止められませんか?

今回作りたいのは、画面の外周ではなく、迷路の内側に描いた壁に対する処理です。本記事の案では、壁の色への接触を調べ、直前の座標へ戻します。

壁に触れたら、毎回スタートへ戻してもよいですか?

それも迷路のルールとして選べます。ただし、「その場で止まる迷路」とは別の遊び方になります。本記事の仕組みを使う場合は、開始位置ではなく、各移動の直前に保存した座標へ戻してください。

色を塗り直したら壁を通れるようになりました。

接触判定に指定した色も見直してください。壁の色を変更した後は、スポイトで選び直し、まず一本の壁で確認すると対象を絞れます。途中だけ別の色になっている部分も確認しましょう。

幼児と一緒でも取り組めますか?

変数や条件分岐を一度に組むことが難しければ、大人が右方向だけ準備し、子どもは「壁を越えたか」「通路を通れたか」を試す役にする方法があります。年齢だけで区切らず、操作できる部分を分担してください。

体験教室で、この迷路の作り方を相談できますか?

CotoMiraiは、年齢・興味・理解度に合わせた個別指導を行っています。学び方はスクール利用の案内をご覧ください。家庭のScratch作品を体験で扱えるか、今回の壁判定を相談できるかは未確認のため、申し込み時にお問い合わせください。

南青山のCotoMiraiは、青山一丁目・乃木坂から通える教室です。所在地や経路は教室紹介・アクセスで確認できます。無料体験を希望する場合は、対象年齢や申し込み手順を公式案内で確認してください。

CotoMiraiの無料体験・入会方法を見る

参考にした情報

関連する記事

読後に1分・5問

お子さまに合う学び方診断

正解・不正解を決める診断ではありません。今の様子から、取り組みやすい学び方の入口をご案内します。

お知らせ一覧へ

アクセス

A C C E S S