ニンジャ

ジャンプがうまくできないんですよね・・

子ども向け無料プログラミング寺子屋『CoderDojo熊本』開催中に寄せられた質問に、

アオキ

マリオみたいな感じだよね、そりゃあジャンプしたいよねぇ。

と思い、『スクラッチ』でジャンプをする方法を探ってみることにしました。

ありがたいことに『スクラッチ』では、

世界中の人々がつくったゲームを遊ぶこともできれば、

ゲームを動かしている仕組み(ブロックの組み方)を見ることもできます。

スクラッチの中で『mario』と検索してヒットしたゲームを参考に記事にしてみました。

こんな感じでジャンプします。

※プログラミングの作り方っていろいろな方法があるので、あくまで参考にしてもらえればと思います。

スクラッチでジャンプをする方法 その0 Y座標を考える

スクラッチに限らずですが、

画面上のどの位置にいるか、というのを表現するために、

XとYという考え方がよく使われます。

• X・・左右
• Y・・上下

になり、

• 右に進むなら x (プラスエックス)
• 左に進むなら -x (マイナスエックス)
• 上に進むなら y (プラスワイ)
• 下に進むなら -y (マイナスワイ)

になります。

ジャンプしたように見せようとすると、

1. 上ボタンを押したらYの値が増えて、
2. ある程度上がったらYの値が止まって、
3. 徐々にYの値が減って、
4. 地面につく

という動きができれば、ジャンプしたように見えるのかなと思います。

アオキ

ジャンプ一つでも意外に考える事いっぱいあるんですよねぇ

スクラッチでジャンプをする方法 その1 重力を設定する

ジャンプの動きとしては、

1. 上ボタンを押したらYの値が増えて、
2. ある程度上がったらYの値が止まって、
3. 徐々にYの値が減って、
4. 地面につく

という順番なんですが、

スクラッチで作る場合はまず始めに、

３.徐々にYの値が減って、

を作った方がわかりやすいのかなと思います。

• Yの値が減る
• どんどん下に下がっていく

というのは、

アオキ

『重力』と同じですね。

スクラッチでブロックを組むならこんな感じになります。

この状態で『緑の旗ボタン(スタートボタン)』を押せば、

キャラクター(今回はライオン)がすーっと下に下がっていきます。

y座標を -5 ずつ下がるようにしていますが、

この数字を -2 にしたり、 -10 にしたりして、

落ちるスピードを調整してみてください。

簡単ですが、これで『重力』が表現できました。

スクラッチでジャンプをする方法 その2 地面をつくる

このままではライオンがずっと下がっていってしまうので、地面をつくります。

作り方はいろいろあると思いますが、今回は色で判別したいと思います。

地面の色を『茶色』として、

スプライトを『描く』を選んで、『茶色の地面』をつくってみます。

アオキ

枠線(わくせん・まわりの線)は透明にしておきます。

プロックの組み方はこんな感じで。

『もし茶色に触れたではないなら』

というちょっと変な表現になっていますが、ようは、

• 茶色にさわらなかったらYが-5ずつ減っていく
• 茶色にさわったらYは変化しなくなる

ということを表現しています。

スクラッチでジャンプをする方法 その3 Let’s ジャンプ！

これまでで、

３. 徐々にYの値が減って、
４. 地面につく

というところまで作る事ができたので、ようやく、

１. 上ボタンを押したらYの値が増えて、
２. ある程度上がったらYの値が止まって、

の箇所を作ってみます。

ブロックとしてはこんな感じで。

• 上ボタンを押したらYの値が増えて、
• ちょっとずつYの増え方が少なくなって、
• Yが増えなくなる

というような流れを目指しています。

Yが増えなくなったら、重力によってYが下がっていくという形ですね。

今回のジャンプの完成形はこんな感じです。

ジャンプの高さや止まる位置などは、
好みによるし、ゲームによって違うと思うので、
ちょうどいいジャンプ感になるまで調整してみるのも楽しいかもですね。

2019/6/17 追記

より本物らしくジャンプをさせたいなら、
『重力加速度』を使うことになります。

こちらの記事も参考にしてみてください。

もんプロ～問題発見と解決のためのプログラミング〜

【物理】と【プログラム】の関係〜力学のはじめのいっぽ

https://coinbaby8.com/physics-and-programming.html

子供向けプログラミング教室『CoderDojo熊本』で以前こんな質問がありました。ジャンプをさせてみたいんです。参考記事マリオだってロックマンだってマイクラだって、ぴょんぴょんジャンプができるのが当たり前で、現実世界でもジャンプしようと思えば健康体であれば簡単にできると思うんですが、いざジャンプができるようにプログラミングをつくってみようとすると、これがなかなか難しいんですよね。なんせ、重力を再現しないといけないので。普段生活している中ではそうそう意識することはないんですが、ジャンプしたら着地するし、...

もんプロ～問題発見と解決のためのプログラミング〜

14 Users

6 Pockets

プログラムで【加速度】【速度】の使い方をわかりやすく (5)【P5.js】

https://coinbaby8.com/acceleration.html

遊ぶようなプログラミングでおなじみの『クリエイティブコーディング』。スムーズな動きを実現しようと思うとどうしても『物理』や『数学』の知識が必要になってきます。今回のお題は『加速度』。だんだんスピードが速くなったり、だんだんスピードが遅くなったり、はたまた逆方向に加速していったり。そんな動きをできるだけわかりやすく作ってみたいと思います。今回は2D(2次元・平面)の動きを想定しています。加速度の前に『ベクトル』のざっくり解説平面(2次元・2D)の場合、横と縦の2つの情報が必要になります。横がX、縦がYになり...

さいごに

マリオでも、ロックマンでも、カービィでも、

横スクロールゲームを作ろうと思ったら、ジャンプは必須条件ですよね。

スクラッチでうまいことジャンプがつくれるようになって、

ぜひおもしろいゲームを考えてつくる事を通じて、

『創造的思考力』『自分の頭で考えてつくれる』ような人が増えればいいなぁと思います。

アオキ

たかがジャンプ、されどジャンプ、ですな。

子どもむけプログラミング寺子屋『CoderDojo熊本』参加者募集中

『スクラッチ』ではこんな記事も読まれています。

アオキ

ツイッターでも記事ネタ含めちょろちょろ書いていくので、よろしければぜひフォローお願いしますm(_ _ )m