レッスン 12 フラッピーゲームをつくろう
古典的なアーケードゲーム「フラッピー」をつくり、Scratchがマスターできたことを確認しよう
チャプター1
はじめに
ゲームに必要な機能を整理しよう
みなさんこんにちは!今回も新しいプロジェクトを作っていくよ。
今回のレッスンでScratchマスターコースは最後のレッスンとなるよ。
何かをつくるためにプログラミングは必ず1通りの正解がある訳ではないんだ。みんなのつくった処理も正しく動けば、正解。自由に発想してゲームを完成させよう。
まずは、今回のレッスンで作るものを見ていくよ。
今回つくるゲームには、大きく分けて3つの機能が必要だよ。
①鳥、birdのスプライトが上下に動かせる機能
②障害物、pipeが右から出現して左へ移動して消える機能
③スコアをカウントする機能
これまで学んだ方法を組み合わせて、つくることができるよ。がんばろう!
では、実際に作っていこう!
チャプター2
背景・スプライトを設定しよう
まずは背景を設定しよう。今回は、ライブラリから背景を選び、desertを設定しよう。
また、チャプター1でダウンロードしたbirdはコスチュームについて確認してね。wings_upのコスチューム番号が1番となっていればOKだよ。
動かす(うごかす)スプライト、birdの位置を決めよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C2_3.png)
さあ!ここまで、みんなの画面でもやってみよう!
チャプター3
鳥が羽ばたけるようにしよう
変数と鳥の羽ばたきを対応させよう
スペースキーで鳥が羽ばたく処理をつくろう
このチャプターでは、鳥の動きをつくっていくよ。鳥の動きには、落ちる処理と羽ばたいて上がる処理があるね。まずは、鳥が落ちていく処理、スペースを押す度に羽ばたき上に上がる処理を自分でつくってみよう。
ずっと、y座標(ざひょう)が減り続ければいいね。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C3_1.png)
スペースを押すたびに羽ばたくことにするよ。羽ばたく回数を表す変数『flap』をつくろう。
スペースキーが押されるたびに、flapが1ずつ増える処理をつくろう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C3_2.png)
スペースを押さないと羽ばたいた効果が無効になる処理をつくろう。何もしなければ減り続けるため、-1ずつ減らせばいいね。マイナスの値(ね)になることのないよう、繰り返しはflapが0となるまでにしておこう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C3_3.png)
繰り返し処理に入る前のflapやコスチュームを初期化することを忘れないようにしておこう。
次に繰り返す処理をつくっていこう。y座標が滑らか(なめらか)に変化するよう、y座標が6ずつ変わる処理を10回繰り返しながら羽が上下する処理をつくってみよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C3_4.png)
つくった処理を繰り返しの中に合体しよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C3_5.png)
ここまで完成したら、動作を確認してみよう。スペースきーを押すと、鳥が羽ばたき上がる、何もしなければ落ちる動作が確認できればOKだよ。
さあ!ここまで、みんなの画面でもやってみよう!
チャプター4
障害物をランダムに出現させよう
このチャプターのポイント
乱数とクローンを組み合わせて、横スクロールを実現しよう
スプライトをランダムに配置しよう
このチャプターでは、フラッピーバードの障害物となるスプライトpipeをの処理をつくっていくよ。
まずは、連続して無限にpipeが出てくる仕組みをつくり、正しく動作することが分かれば、ランダムな位置に出現するようにしよう。
まずは自分でつくってみよう!
最初にスプライトpipeを描こう。
①新しいスプライトを描くをクリック
②ベクターモードになっていることを確認して、なっていなければベクターモードに変換をクリックしてね。
③四角形のツールを選択して、2つの四角形を描く
④図形の色を選択して、下の色見本から濃い緑と薄い緑を選択
⑤塗り方がグラデーションとなるよう選択して塗りつぶす。
最終的には、サイズが30×370、つまり上下に少しはみ出るくらいに調節してね。
次に、pipeの処理をつくっていこう。最初は隠した状態で、大きさを200%にしておこう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C4_1.png)
これで、後から縦方向にpipeの位置を上下させても、pipeが画面にうまくおさまらないことはなくなるね。
pipeが次々に出現する処理は、クローンを利用しよう。ずっと、2秒おきに生成するようにしよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C4_2.png)
クローンされたあとの最初の位置を決めておこう。scratchの画面の右端(うたん)は240であることに注意してね。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C4_3.png)
横方向は480あるので、繰り返す回数とx座標を減らす値(ね)をかけた値が-480となるようにしよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C4_4.png)
最後にクローンを削除することを忘れないようにしてね。
ここまで完成したら、途中の動作を確認しよう。pipeが右端から出現し、左端(ひだりはし)まで移動して消えていく処理が繰り返されていればOKだよ。
このままでは、ゲームが難しくないのでクローンされた時の出現位置のy座標を乱数として、上下に配置するようにしよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C4_5.png)
ここまで完成したら、動作を確認してみよう。pipeの隙間が、上下にランダムに配置されていればOKだよ。
さあ!ここまで、みんなの画面でもやってみよう!
チャプター5
ゲームの終了条件をつくろう
このチャプターのポイント
メッセージ機能を使って複数スプライトを制御しよう
メッセージを用いて、gameoverを決めよう
このチャプターでは、birdの当たり判定をつくっていくよ。birdがpipeまたは端に触れたらゲームオーバーと言う処理をまずは自分でつくってみよう。
ゲーム開始後、つまりグリーンフラッグが押されてから、制御の中にある~まで待つ
ブロックを使って処理をつくっていこう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C5_1.png)
当たったら、birdはGame Overと言い、メッセージgameoverを送る、その後は他のスプライトは止めておこう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C5_2.png)
さらに、pipeの動きも止めなければいけないので、メッセージを受け取ったときにスクリプトを止めておこう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C5_3.png)
ここまで完成したら、動作を確認してみよう。端に触れたとき、pipeに触れたとき、どちらもゲームがストップすること、birdがGameOverということが確認できればOKだよ。
さあ!ここまで、みんなの画面でもやってみよう!
チャプター6
スコアを表示(ひょうじ)させよう
このチャプターのポイント
スプライトどうしの位置関係をスコアと対応させよう
スコアの増加条件を考えてつくろう
このチャプターでは、pipeを通過するたびにスコアが1ずつ増えていくようにしていくよ。birdとpapeのx座標を比べて、大きくなればscoreが1ずつ増える処理をまずは自分でつくってみよう。
変数scoreをつくろう。値(ね)は、ゲーム開始時0で、pipeの隙間(すきま)を通り抜けるたびに、1ずつ増えるよ。
クローンされたpipeのx座標とbirdのx座標を比べ、birdのx座標の方が小さくなればscoreが1増えるようにしよう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C6_1.png)
scoreの初期値は0としておこう。
![](https://techacademy.s3.amazonaws.com/kids/scratch-master3/Lesson12/C6_2.png)
ここまで完成したら、動作を確認してみよう。変数scoreの値(ね)を表示して、確認してね。
pipeの間を通過する度にscoreが1ずつ増えていればOKだよ。
さあ!ここまで、みんなの画面でもやってみよう!