スクラッチでチャリ走ゲームの作り方

中級

今回つくるゲーム

難易度2 out of 5 stars

今回は自転車を走らせて、二段ジャンプで溝に落ちないように走行していくチャリ走ゲームを作っていきます。スクロールの基礎や二段ジャンプの仕組みなどを覚えておくと、いろいろなゲームに応用できます。
こちらが今回つくるゲームの完成形です。シフトを押して二段ジャンプしながら溝を越えていきます。

※スクラッチ初心者の方は、まずこちらの、
もぐらたたきゲーム作り方(初級)
からチャレンジしてみてください。

準備

まずは、こちらにアクセスして、リミックスをしてください。
チャリ走ビンゴおじさん(素材)

ゲーム作りに必要な自転車に乗ったおじさんと、コースの二つのスプライトが準備されています。

スクラッチでチャリ走ゲームの作り方



リミックスの方法が分からないという方はこちらの記事を参考にしてください。

コースを作る

まずは、コースを作っていきます。横スクロールゲームはだいたい同じですが、コースが右から左へ流れていくことで、プレイヤーが進行方向右側に移動しているように見せます。

最初にプレイヤーを配置します。おじさんのスプライトで以下のようにコードを書いてください。

スクラッチでチャリ走ゲームの作り方

次にコースのスプライトに以下のようにコードを書いていきます。
X座標が-460より小さくなる、つまり、左端に来たら隠す処理をします。

スクラッチでチャリ走ゲームの作り方

これではすぐにコースが終わってしまうので、クローンを作って、どんどんコースが現れてくるようにします。

スクラッチでチャリ走ゲームの作り方

このままではコースが単調になるので、コースが出てくる間隔をランダムにすることで、溝の広さを調整し、コスチュームを1〜5でランダムにすることでさまざまなバリエーションのコースを作るようにします。

スクラッチでチャリ走ゲームの作り方

あと、自転車がスーッと動くのは少し気持ち悪いのでおじさんのコードに以下を追加して、少し自転車が揺れるような表現をしてあげます。

スクラッチでチャリ走ゲームの作り方

緑の旗を押してみてください。下の動画のように自転車がコースの上を走っているように見えれば成功です。

隙間にプレイヤーを落とす

コースとコースの隙間にきたら、プレイヤーは落ちなければなりません。
そのために、おじさんのスプライトに以下のコードを追加していきます。ジャンプの高さという変数を作成し、常にY座標がジャンプの高さずつ変わるようなプログラムにします。そして、地面の色に触れている時はジャンプの高さを0にして、触れていなければ−1ずつ変えます。これがつまり落ちるということになります。そして、赤色に触れるとゲーム終了とします。

スクラッチでチャリ走ゲームの作り方

以下の動画のようになるはずです。

二段ジャンプをする

コースとコースの隙間に落ちないように二段ジャンプができるようにします。スペースボタンが押された時にYの高さを20変えてさらに10ジャンプし、合計30上に行き、ジャンプを表現します。そしてジャンプ回数残りという変数をつくり、スペースが押された時にジャンプ回数残りが1づつ減って、ゼロになるとスペースを押してもジャンプできなくなります。これで二段ジャンプができるようになりました。ジャンプ回数残りの部分を例えば3に変更すると三段ジャンプができるようになります。

スクラッチでチャリ走ゲームの作り方

この状態でプレーしたところ、下の動画のように、着地した時に少し自転車が地面に食い込んでしまうような挙動が起こります。

それを防ぐために、地面に触れた時はY=−66に補正するようにします。さらに、ジャンプは真上にするのではなく、ウイリーっぽくジャンプさせた方がチャリ走に近くなるので、通常時は90度に向けて、スペースを押した時は60度を向くようにします。

スクラッチでチャリ走ゲームの作り方

緑の旗を押してプレーしてみてください。チャリ走っぽくなってきました。

坂道を作る

コースをただ平坦なだけでなく、坂道を作るとよりゲームとして面白くなります。コスチューム5と6に坂道を用意してあるのでこちらを活用していきます。

コースのコードを少しだけ変更します。以下のようにコスチュームを1〜6までの乱数とします。

スクラッチでチャリ走ゲームの作り方

そして、おじさんのコードの方も変更していきます。坂道の表面は地面より少しだけ濃い茶色に設定しています。この濃い茶色に触れた時に、75度に傾けて、Y軸方向に3ずつ移動していくようにすることで、坂道を上っていくように見えます。あと、ジャンプをするときの音もつけておきました。

スクラッチでチャリ走ゲームの作り方

下の動画のように、なれば成功です。

今回つくったコードはこちらからでも確認できます。
チャリ走ビンゴおじさん