【Scratch 3.0】スーパーマリオ風 Bダッシュと方向転換の方法(Tips)

スポンサーリンク
スーパーマリオ風 Bダッシュと方向転換の方法_m

アクションゲームやプラットフォームゲームをつくる時にキャラクターが歩く動きや走る動きは欠かせません。その時にモデルとなるのはやはりスーパーマリオではないでしょうか?

スーパーマリオでは、十字キーの左右を押すと押した方向に普通に歩き、Bボタンを押しながら十字キーの左右を押すとダッシュします。また、左右の方向を変えるときは慣性の力を感じさせながら急な方向転換するような動きになっています。

今回は、実はわりと複雑に出来ているスーパーマリオのようにキャラクターをダッシュさせたり、方向転換させる方法を紹介します。

この記事を読んでいただくと、スーパーマリオ風にキャラクターをダッシュさせる/方向転換させるスクリプトの作り方とそのコツが分かります。

プラットフォームゲームとは

プラットフォームゲームとは、ゲームジャンルの1つで『左右移動とジャンプ操作によって足場(プラットフォーム)を飛び移り、足場からの落下や障害物を回避しつつ、目標地点へのゴールを目指す』という種類のゲームのことです。代表的な例としては「スーパーマリオブラザーズ」があります。

スクリプトの作り方

完成した動き

「左右の矢印キー」で押した方向に歩き、ダッシュはBボタンの代わりにキーボードの「スペースキー」を使って実現しています。

「スペースキー」を押さずに「左右矢印キー」だけであれば、普通に歩きます。「スペースキー」を押しながら「左右矢印キー」を押すとダッシュします。また、方向転換する際に慣性力を表現しています。

歩くときは「Xv」変数の値は-6前後~+6前後の範囲で変化し、ダッシュをしているときは-10前後~+10前後までの範囲で変化するようにしています。また、方向転換するときは勢いを急速に弱めながら逆方向に向きを変えるように制御しています。

スーパーマリオ風 Bダッシュと方向転換の方法-完成-GIFアニメ

完成したスクリプト

完成したスクリプトの全体です。スプライトは「ネコ」と「背景」の2つです。

【スプライト】

【ネコのスクリプト】

変数
  • Xv:すべてのスプライト用

【背景のスクリプト】

背景のスクリプトは、スタート直後の座標を決める部分だけです。

スクリプトの説明

プログラムを作っていく中でポイントとなる部分を説明します。

ポイント①:プログラムの全体構成を考える

細かい動きを作る前にプログラムの全体像から考えてみましょう。

プログラムの構成として作らなければいけないのは、1.右方向にダッシュしているとき、2.右方向にダッシュしていない(歩いている)とき、3.左方向にダッシュしているとき、4.左方向にダッシュしていない(歩いている)とき、5.ダッシュも歩いてもいないとき、の5パターンが必要です。

右方向への歩きは「右向き矢印キー」、左方向への歩きは「左向き矢印キー」、ダッシュは「スペースキー」で行うこととします。

そうすると下の5つの条件に分けることができます。

  1. 「右向き矢印キー」と「スペースキー」が押された時のプログラム
  2. 「右向き矢印キー」が押された時のプログラム(スペースキーは押されていない)
  3. 「左向き矢印キー」と「スペースキー」が押された時のプログラム
  4. 「左向き矢印キー」が押された時のプログラム(スペースキーは押されていない)
  5. 左右の矢印キーどちらも押されていない時のプログラム

さらに上の1~5の条件の中でX座標をどれだけ動かすかを求めて、その値を変数「Xv」に入れるようにすれば、その変数「Xv」を使ってX座標を移動させれば良いだけなので、実際にX座標を動かすブロックは1か所に置くだけで実現できます(下図⑥)。

このようにすれば、「X座標を~にする」ブロックや「X座標を~ずつ変える」ブロックをあちこちに組み込むより、すっきりしたプログラムに仕上がります。

ポイント②:「右向き矢印キー」と「スペースキー」が押された時のプログラムをつくる

「Xv」変数が10に到達するまで「4×0.06=0.24」ずつ値を増やしていきます。

スペースキーを押していないときは「4×0.05=0.2」ずつ増えていくので、スペースキーを押した時の方が少しスピードが速くなります。

ダッシュのスピードを速めたいときは、0.06よりも大きな数字を入力してください。

ポイント③:「右向き矢印キー」が押された時のプログラム(スペースキーは押されていない)をつくる

「Xv」変数が6に到達するまで「4×0.05=0.2」ずつ値を増やしていきます。

スペースキーを押しているときは「4×0.06=0.24」ずつ増えていくので、スペースキーを押していない時の方が少しスピードが遅くなっています。

ポイント④:「左向き矢印キー」と「スペースキー」が押された時のプログラムをつくる

右向きの時と同じロジックで方向が逆になっているだけなので、説明は省略します。(ポイント②を参照)

ポイント⑤:「左向き矢印キー」が押された時のプログラム(スペースキーは押されていない)をつくる

右向きの時と同じロジックで方向が逆になっているだけなので、説明は省略します。(ポイント③を参照)

ポイント⑥:左右の矢印キーどちらも押されていない時のプログラムをつくる

左右の矢印キーを押していない時は、キャラクターに減速してもらう必要があります。スピードを緩める速度をここで決定します。

下図の例では、「Xv」変数の値を「Xv×0.82」としています。これは「Xv」の値を18%ずつ減らしています。これはつまり、「Xv」の値が0になるまで18%ずつ減速することを意味します。

もっと早く止めたければ、0.82より小さな値を指定してください。

ポイント⑦:方向転換する時のプログラムを追加する

方向転換する部分のスクリプトを組み込みます。これによって慣性の力っぽい表現ができています。

例えば、左向きに移動中に右向きに方向転換する場合を考えてみましょう。

左向きに移動中であれば「Xv」変数の値はマイナスになっています。そこで「右向き矢印キー」が押された時に「Xv<0(Xvがマイナス)」だったら、「Xv」変数をプラスの値で大きめに増加させると、すばやく右方向に動きを変えるようになります。

逆に右向きに移動中であれば「Xv」変数の値はプラスになっていますので、「左向き矢印キー」が押された時に「Xv>0(Xvがプラス)」だったら、「Xv」変数をマイナスの値で大きめに増加させると、すばやく左方向に動きを変えるようになります。

ここまでのポイントを押さえてスクリプトを組むことが出来たら、スーパーマリオ風のダッシュと方向転換のプログラムは完成です!

失敗しやすいポイント

ブロックの入れ子(ネスト)に注意してください。間違い(見落とし)やすいポイントです。

今回は複数の「もし~なら」ブロックを入れ子(ネスト)にしているので、どの「もし~なら」ブロックの中にどの「もし~なら」ブロックを入れるのか、組み込む場所を確認して正しい位置に入れるようにしてください。

応用編

別の記事で紹介している「マリオジャンプ」と組み合わせてみました。

※左右矢印キーを押しながらスペースキーを押すとダッシュします。その状態で上矢印キーを押すとジャンプもできます。

スーパーマリオ風 Bダッシュと方向転換の方法-応用-GIFアニメ
スーパーマリオ風Bダッシュ(応用)

「マリオジャンプ」のやり方はこちらから↓↓↓

まとめ

さいごに、今回の記事で説明した『スーパーマリオ風にキャラクターをダッシュさせる/方向転換させるスクリプトの作り方』のポイントをまとめます。

  • ポイント①:プログラムの全体構成を考える
  • ポイント②:「右向き矢印キー」と「スペースキー」が押された時のプログラムをつくる
  • ポイント③:「右向き矢印キー」が押された時のプログラム(スペースキーは押されていない)をつくる
  • ポイント④:「左向き矢印キー」と「スペースキー」が押された時のプログラムをつくる
  • ポイント⑤:「左向き矢印キー」が押された時のプログラム(スペースキーは押されていない)をつくる
  • ポイント⑥:左右の矢印キーどちらも押されていない時のプログラムをつくる
  • ポイント⑦:方向転換する時のプログラムを追加する

今回、試行錯誤してスーパーマリオのBダッシュを再現することにチャレンジしてみました。本当に正確なロジックは分かりませんが、見た目だけはそれっぽく出来たのではないでしょうか?

これはたまたまですが、今回のプログラムをちょっと変えたら、ちょうどうまい具合に氷の上をスケートで滑るような動きを表現することが出来ました。これはまた別の機会に記事にしたいと思います。

どうでしたか?上手く再現できたでしょうか?
他にも役に立つTips(ティップス)記事をたくさん書いてますので、ぜひ見てみてください。(記事のタイトルに「Tips」と書いていたり「Tips」タグを貼ってあります)

この記事が『よかった/役に立った』と思ったら、左下のGoodボタンを押していただけると嬉しいです。

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