キミも未来のトビラをひらこう!!

公式LINEで相談♪

programmingSchool

できたを育むプログラミングスクール

レッスン24フラッピーゲームを作ろう!

チャプター01はじめに

このチャプターのポイント

フラッピーゲームをつくろう

・ゲームに必要な機能を整理しよう

今回のレッスンでScratchコースは最後のレッスンとなるよ。 ここまで到達したみんなはかなり力がついているので、各チャプターでは自分で処理をつくってみよう。 つくり終えたら答え合わせをして見てね。 ただし、解説の通りでなくても正しく動作することは、あり得るよ。

何かをつくるためにプログラミングは必ず1通りの正解がある訳ではないんだ。 みんなのつくった処理も正しく動けば、正解。 自由に発想してゲームを完成させよう。 まずは、今回のレッスンで作るものを見ていくよ。 今回つくるゲームには、大きく分けて3つの機能が必要だよ。

  1. Parrot「鳥」のスプライトが上下に動かせる機能
  2. pipe「障害物(しょうがいぶつ)」、が右から出現して左へ移動して消える機能
  3. スコアをカウントする機能

これまで学んだ方法を組み合わせて、つくることができるよ。がんばろう! では、実際に作っていこう!

チャプター02背景・スプライトを設定しよう

このチャプターのポイント

背景とスプライトの初期状態を設定しよう

・背景・スプライトの設定を確認しよう

このチャプターでは、背景とスプライトの設定を確認していくよ。 まずは背景を設定しよう。 今回は、ライブラリから背景を選び、Desertを設定しよう。

また、Parrotはコスチュームについて確認してね。 Parrotのコスチューム番号が1番となっていればOKだよ。 動かすスプライト、Parrotの位置を決めよう。 ここまで、みんなの画面でもやってみよう!

チャプター03鳥が羽ばたけるようにしよう

このチャプターのポイント

変数Parrotの羽ばたきを対応させよう

・スペースキーで鳥が羽ばたく処理をつくろう

今回は、最後のレッスンなので、なるべく自分の力でブロックをつくっていこう。 このチャプターでは、Parrotの動きをつくっていくよ。

Parrotの動きには、落ちる処理と羽ばたいて上がる処理があるね。 まずは、Parrotが落ちていく処理、スペースを押す度に羽ばたき上に上がる処理を自分でつくってみよう。 ずっと、y座標が減り続ければいいね。

スペースを押す度に羽ばたくことにするよ。 羽ばたく回数を表す変数「flap(フラップ)」をつくろう。 スペースキーが押される度に、flapが1ずつ増える処理をつくろう。 スペースを押さないと羽ばたいた効果が無効になる処理をつくろう。 何もしなければ減り続けるため、-1ずつ減らせばいいね。

マイナスの値になることのないよう、繰り返しはflapが0となるまでにしておこう。 繰り返し処理に入る前のflapやコスチュームを初期化することを忘れないようにしておこう。

次に、繰り返す処理をつくっていこう。 y座標がなめらかに変化するよう、y座標が6ずつ変わる処理を10回繰り返しながら羽が上下する処理をつくってみよう。

つくった処理を繰り返しの中に合体しよう。 ここまで完成したら、動作を確認してみよう。 スペースキーを押すと、Parrotが羽ばたき上がる、何もしなければ落ちる動作が確認できればOKだよ。 さあ!ここまで、みんなの画面でもやってみよう!

チャプター04障害物をランダムに出現させよう

このチャプターのポイント

乱数とクローンを組み合わせて、横スクロールを実現しよう

・スプライトをランダムに配置しよう

このチャプターでは、Parrotの障害物となるスプライトpipeをの処理をつくっていくよ。 まずは、連続して無限にpipeが出てくる仕組みをつくり、正しく動作することが分かれば、ランダムな位置に出現するようにしよう。 まずは自分でつくってみよう!

最初にスプライトpipeを描こう。

  1. 新しいスプライトを描くをクリック
  2. ベクターモードになっていることを確認して、なっていなければベクターモードに変換をクリックしてね。
  3. 四角形のツールを選択して、2つの四角形を描く
  4. 図形の色を選択して、下の色見本から濃い緑と薄い緑を選択
  5. 塗り方がグラデーションとなるよう選択して塗りつぶす。

最終的には、サイズが30×370、つまり上下に少しはみ出るくらいに調節してね。

次に、pipeの処理をつくっていこう。 最初は隠した状態で、大きさを200%にしておこう。 これで、後から縦方向にpipeの位置を上下させても、pipeが画面にうまくおさまらないことはなくなるね。

pipeが次々に出現する処理は、クローンを利用しよう。 ずっと、2秒おきにつくっていくようにしよう。

クローンされたあとの最初の位置をきめておこう。 scratchの画面の右端は240であることに注意してね。

横方向は480あるので、繰り返す回数とx座標を減らす値をかけた値が-480となるようにしよう。 最後にクローンを削除することをわすれないようにしてね。

ここまで完成したら、途中の動作を確認しよう。 pipeが右端から出現し、左端まで移動して消えていく処理が繰り返されていればOKだよ。 このままでは、ゲームが難しくないのでクローンされた時の出現位置のy座標を乱数として、上下に配置するようにしよう。

ここまで完成したら、動作を確認してみよう。 pipeの隙間が、上下にランダムに配置されていればOKだよ。 さあ!ここまで、みんなの画面でもやってみよう!

チャプター05ゲームの終了条件をつくろう

このチャプターのポイント

メッセージ機能を使って複数スプライトを制御しよう

・メッセージを用いて、gameoverを決めよう

このチャプターでは、Parrotの当たり判定をつくっていくよ。 Parrotpipeまたは端に触れたらゲームオーバーと言う処理をまずは自分でつくってみよう。

ゲーム開始後、つまりグリーンフラッグが押されてから、制御の中にある[~まで待つ]ブロックをつかって処理をつくっていこう。

当たったら、ParrotはGame Overと言い、メッセージgameoverを送る、その後は,他のスプライトは止めておこう。

さらに、pipeの動きも止めなければいけないので、メッセージをうけとったときにスクリプトを止めておこう。 ここまで完成したら、動作を確認してみよう。 端に触れたとき、pipeに触れたとき、どちらもゲームがストップすること、ParrotがGameOverということが確認できればOKだよ。 ここまで、みんなの画面でもやってみよう!

チャプター06スコアを表示させよう

このチャプターのポイント

スプライトどうしの位置関係をスコアと対応させよう

・スコアの増加条件を考えてつくろう

このチャプターでは、pipeを通過するたびにスコアが1ずつ増えていくようにしていくよ。 Parrotpapeのx座標を比べて、大きくなればscoreが1ずつ増える処理をまずは自分でつくってみよう。

変数「score」をつくろう。 値は、ゲーム開始時0で、pipeの隙間を通り抜ける度に、1ずつ増えるよ。 クローンされたpipeのx座標とParrotのx座標を比べ、Parrotのx座標の方が小さくなればscoreが1増えるようにしよう。

score初期値は0としておこう。 ここまで完成したら、動作を確認してみよう。 変数scoreの値を表示して、確認してね。 pipeの間を通過する度にscoreが1ずつ増えていればOKだよ。 ここまで、みんなの画面でもやってみよう!

チャプター7最後に

・まとめ

このレッスンで、Scratchコースも終わりだね。 フラッピーゲームをつくりながら、つまづくことなく完成できたかな? もし簡単だと感じていたら、既にScratchはマスターしたという証だよ。 がんばったね! Scratchをマスターしたら、プログラミングの次のステージへ立てる準備は万端ばんたんだね。