横スクロールゲームを作ってみた

2019-2-07

今回は、横スクロールゲームを作ってみました。このゲームは、土台が無限に横移動していくので、ジャンプで移動します。

Heppocode Runner on Scratch

01.四角を動かす

最初に、地面をあらわす四角を１つだけ作って、横移動させます。これは簡単ですよね。ネコの移動と、ほとんど同じです。

背景に、地面を描く
スプライトに、地面(の一部)をあらわす四角を描く
スプライトを、X方向に移動
左はしまで来たら、右はしに戻る

ヒント

スプライトの基準点を確認しましょう。

02.空中の台と穴を作る

移動する四角の位置とサイズを調整すると、空中の台になります。さらに、複製して色を変えると、穴になります。

四角をコピーして、色を土台に合わせる
同じように四角をコピーして、2つ目と３つ目の台を作る
さらに複製したら、位置と色を変えて穴にする
スタート位置と高さ・移動速度を調整する

ヒント

「穴」は、地面あらわす四角の長さを調整するのではなく、白色の四角のスプライトを用意して、地面に重ねて移動させています。

03.プレイヤーを追加する

ゲームらしくするために、プレイヤーのキャラクターを追加します。そして、上矢印キーでジャンプさせます。

プレイヤーのスプライトを追加する
プレイヤーを落下させる
地面にふれたら停止
穴に落ちたらリスタート
上矢印キーでジャンプ

ヒント

プレイヤーの動作は、「プラットフォーマーゲームの作り方」とほとんど同じです。空中台の長さ、スタート位置、高さなどで、ゲームの難易度が変わってきます。

04.天井とカベにふれたら位置を調整する

空中の台や穴のカベにふれると食い込んでしまうので、カベにふれたら位置を調整します。このカベを検出するために、土台の左はしの色を変えました。

たて移動の土台にふれた時の処理で、Y方向(縦の移動方向)を考慮する
カベを検出するため、空中台の左はしと穴の右はしに色をつける
よこチェックで、カベにふれたら、カベに押されて-10移動する
ジャンプで、前に移動
左はしまで押し込まれたら、リスタート

05.スターを追加する

ポイントを獲得するアイテムとして、スターを追加しましょう。これも、横移動する四角と同じパターンです。

スプライトを追加する
スプライトを横移動させる
位置とスピードを調整する
プレイヤーにふれたら「隠す」

06.スターを複数にする

スターが列を作って移動していくよう、クローンで複製します。

「クローンされたとき」を追加
スターのコードを、クローン側に移動
「自身のクローンを作る」を複数回くりかえす

07.スターの位置をランダムに変える

ここでは、スターの位置を毎回ランダムに変えてみましょう。

「番号」「ID」変数を追加
各クローンにIDを割り振る
「star_Y位置」変数を追加
ID=1のクローンは「star_Y位置」を更新
スターの高さを調整する

ヒント

バラバラに変えるのではなく、先頭が位置を変えたら、残りは先頭と同じ位置にします。そのために、各スターにIDを割り当てています。スターの位置は、「star_Y位置」変数で表します。

08.ゲームの形を整える

最後に、ゲームらしい要素を付け加えて完成です。

背景に、スタート画面とゲームオーバー画面を追加
最初は、スタート画面を表示
リスタートの代わりに、ゲームーバー画面に切り替える
「走行距離」を追加
「スター数」を追加

やってみよう

というわけで、横スクロールゲームの開発手順を紹介しました。各ステップのコードは、スタジオにまとめてあります。

いろいろなバリエーションを作れると思いますので、ぜひチャレンジしてください。

発展形

こんな感じの横スクロールゲームを作ってみました。スクロールする地面をクローンで作っています。バギーのアニメーションも、良い感じにできていますので、ぜひ本物を見てください

Heppocode Garage