今回つくるゲーム
難易度
今回はペンキを発射して、画面を塗りつぶし、その塗りつぶした面積を競う、スプラトゥーン風ゲームの作り方を解説します。ゲーム制作を通してsin/cosの使い方やスタンプの使い方などが学習できます。
※スクラッチ初心者の方は、まずこちらの、
もぐらたたきゲームの作り方（初級）
からチャレンジしてみてください。
準備
まずは、こちらにアクセスして、リミックスをしてください。
スプラトゥーン風ビンゴおじさん（素材）
ゲーム作りに必要なスプライトが一通り用意されています。
リミックスの方法が分からないという方はこちらの記事を参考にしてください。
おばさん（敵）の動きを作る
まずはおばさん（敵）の動きから作っていきます。
おばさんは画面右下に配置します。
次に、おばさんの可動範囲を決めていきます。スクラッチの向きの考え方はこのようになっています。
つまり、今回のおばさんの可動範囲は0〜９０になります。
おばさんは敵なので、この０〜９０に自動的にランダムに向くようにします。
次に、ペンキを発射するのですが、発射するには発射する方向を決めなければなりません。
ターゲットを設置する
発射する方向を定めるためにおばさんが向いている先にターゲットを設置します。まずはおばさんのスプライトのコードを以下のように追記します。おばさんの向きとおばさんのパワーという変数を追加します。おばさんの向きはターゲットの位置を決めるのにつかいます。おばさんのパワーはペンキを飛ばす距離に影響してきます。そして最後におばさん発射のメッセージを送ります。
ここからターゲット２の位置の指定に入っていきます。
ここで使用するのが、sin(サイン)とcos(コサイン)です。下図のように長さ（正確には斜辺の長さ）に対して向きのsinをかけるとタテ、向きのcosをかけるとヨコの長さになります。
これを今回に当てはめると、おばさんからターゲットまでの距離を１５０とすると、下図のようになり、ターゲットの座標は
X:225-(150×おばさんの向きのcos)
Y:-165+(150×おばさんの向きのsin)
となります。
これをターゲット２のスプライトに記述していきます。動画のように、おばさんにターゲットがついてこれば成功です。
ペンキを発射する
さて、ここまでできたらペンキ発射のコードを書いておばさんの動きは終了です。まず、おばさん発射のメッセージを受け取った時のペンキ２の動きを作っていきます。下図のように、おばさん発射のメッセージを受け取った時、まずはおばさんにいきます。そして、そこからターゲット２にむけて進んでいくのですが、進む距離をおばさんのパワーで調整しています。
また、最初は”つぶ”で発射されて、到達した時にペンキが広がるようにします。またペンキの広がりを３種類用意してランダムで出現するようにしています。
この状態で、緑の旗をおすとどうなるでしょうか。下の動画のように、発射するごとに一つ前についたペンキが消えてします。
これを解消するためには、ひとつはクローンを使うという選択肢が考えられます。ペンキのクローンを作成して、到達地点に配置するという考え方です。しかし、クローンを作りすぎるとデータが重くなってしまいますし、今回のゲームではペンキは表示されるだけでアクションは一切ないので、そのような時はスタンプという便利なツールがあります。
スタンプ機能を使うには拡張機能を活用します。画面左下の＋ボタンを押し、拡張機能にある”ペン”を追加します。
そうすると、以下のようにペンのツールが追加されます。上から二つ目に”スタンプ”のツールがあるのでこちらを使用していきます。スタンプはそこに存在したスプライトを残像のように残すことができます。
さきほど作ったペンキ２のコードの最後に”スタンプ”を追加するだけです。旗が押されたときにスタンプを消すのも忘れないようにしましょう。
これで、画面にペンキがどんどん塗られていくことを表現することができます。
スタンプ機能はスクラッチでゲームを作るときにはよく使います。たとえばビームで壁を削っていくときなどもスタンプ機能を使います。
おじさんの動きをつくる
次におじさんの動きを作っていきます。おじさんはおばさん（敵）と違って、ペンキを発射する向きや強さを自分で調整できるようにします。
まずはペンキを発射する向きを決めるコードを作っていきます。
画面左下におじさんを配置し、右矢印と左矢印で発射する向きを調整します。そして、おばさんの時と同様に、”おじさんの向き”という変数を作り、この向きにターゲットを配置していきます。
ターゲット配置の前に、ペンキを発射する時の強さを設定していきます。今回はスペースキーを押したときにペンキが発射されるようにして、スペースキーを押している長さでペンキが飛ぶ距離が変わるようにします。ここでは”タイマー”の機能を使っていきます。下図のようにスペースキーが押されたときにタイマーをリセットして”スペースキーが押されたでないまで待つ”という指示を加えることによって、スペースキーが押されている間タイマーが進むことになります。そしておじさんのパワーという変数をつくり、タイマーの値を代入します。例えば1.5秒間スペースキーを押し続けるとおじさんのパワーは1.5になります。
そして、ゲームっぽくするためにすこしギミックを加えます。スペースキーを教えている間だけ、色の効果を加えると、パワーが溜まっているような表現になります。
タイマーとおじさんのパワーの値を表示して、緑の旗を押してみてください。スペースを押すとタイマーがリセットされ、スペースキーから指を話すとおじさんのパワーにタイマーの数値が代入されているのがわかります。また、スペースが押されている間は少し色が赤味がかり、パワーが溜まっている印象になります。
ターゲットを設置する
次にターゲットを配置していきます。こちらはおばさん（敵）で行なった内容と同じです。
ターゲット１に以下のコードを書いていきます。おじさんは左下にいるため、向きが９０〜１８０になってしまうため、１８０からおじさんの向きを引いた角度のcos/sinを適用します。
ペンキを発射する
次にペンキを発射していきます。ここの考え方はおばさんの時と同様です。ターゲット１の方向に向かっておじさんのパワーに応じて”つぶ”が発射され、到達した場所でスタンプが押されます。
ここまでできたら緑の旗を押してプレイしてみてください。お互いペンキを打ち合って、敵のペンキの上に自分のペンキを重ねると、ペンキが上塗りされるようになります。
スコアをつける
次にスコアをつけていきます。まず、ゲーム自体に制限時間をつけましょう。制限時間のコードはステージに書いていきます。
そして、ゲーム終了を受け取ったときに、おじさんとおばさんの動きを止めます。
次に”おじさんスコア”と”おばさんスコア”の変数を作ります。以下のようにステージに記載したコードに変更を加えていきましょう。
ここから、スコアをつけていくのですが、赤色五角形の”判定”というスプライトにコードを書いていきます。
仕組みとしてはこの赤色五角形が画面中を移動して、紫色に触れたらおじさんのスコアにして、緑色に触れたらおばさんのスコアにします。
下の動画では１０２対９８でおじさんの勝ちとなります。
最後の微調整
お気づきかもしれませんが、このままのコードだと、ゲーム終了後もおじさんはペンキを発射することができてしまいます。それは”ゲーム終了を受け取ったとき”にスクリプトは止まりますが、スペースを押すと”スペースを押したとき”の指示が生きてしまうためです。それを解消するために”スペースキー無効”という変数を作って、ゲーム終了時にスペースキーの操作が無効になるようにします。
以上で完成です。
完成版のコードはこちらになります
