スクラッチでポケモンGO風ゲームの作り方（ビデオモーションセンサーの活用）

今回つくるゲーム

難易度

今回はポケモンGO風のARゲームを作っていきます。ポケモンGOのモンスターボールでポケモンをゲットする場面をビデオモーションセンサーを活用して再現しています。このゲーム作りをとおしてビデオアクションセンサーの活用方法についてより深く理解することができるとともに、スタンプ機能や幽霊の効果についても学習できます。

以下が今回つくるゲームの完成版の動画です。モンスターボールを手で真上に投げるアクションを上手にできるとモンスターをゲットできます

以下より完成版をプレイいただくこともできます。是非一度プレイして仕上がりをイメージしてみてください。

ポケモン風ゲーム（完成版）

ARゲームとしてはこちらの方が簡単なので、こちらもトライしてみてください。
スクラッチでARゲームの作り方[ビデオモーションセンサーの使い方]

準備（素材の作成）

まず、ゲーム作りに必要な素材を作成していきます。
こちらに素材だけ用意した状態のものも用意していますので、素材を作るのが面倒な方はこちらをリミックして次の章からスタートしてください。

ポケモンGO風ゲーム（素材）
※リミックスされた方はこちらからスタート

新しいプロジェクトを作り、まずはネコのスプライトを削除します。ここから以下の順番でスプライトを追加していってください。

モンスター

今回は、モンスターとしてDinosaur4（今後モンスターと呼びます）を採用します。デフォルトで用意されているキャラクターから選択してください。

モンスターゲット時の光効果

次にゲット時の光の効果を作っていきます。モンスターに向けて閃光が走って、光を放ち、発散されていくような動きを作ります。
まず、閃光部分ですが、以下のようなコスチュームを作ってください。

後ほど詳しく解説しますが、こちらの素材を連続してスタンプしていくことで閃光が走っているように見せます。また、なぜ横向きで作成するかということについて記載しておきます。スクラッチには”●●歩動く”という便利なブロックがあります。それを使うと自分が向いている方向に簡単に動かすことができます。そして、デフォルトが９０度方向（＝右向き）になっています。ですのでコスチュームを作るときにはコスチュームの進行方向を右向きに設定しなければなりません。その上で、今回は右下から左上に閃光が走るので角度を−４５度（＝左上向き）に向けて動かすということになります。

コスチュームを作るときに中心をあわせることと、動く向きについて意識することを忘れないようにしてください。

続いて、閃光がモンスターにあたり光を放ち、発散される部分を作ります。以下のようなコスチュームを作成してください。いずれも丸を変形させて作っています。

ゲット後にモンスターボールの周りに放たれる光も作ります。

スプライトは作られた順番に最背面から重なっていくので、作る順番も重要です。

モンスターボール

次にモンスターボールを作っていきます。中心からグラデーションを引いた白い円と赤い円をそれぞれ半分消して合体させ中央部分も合成して作成しています。比較的簡単な作業なので是非自分で作ってみてください。

最後に、やったーのメッセージのスプライトも作成します。

モンスターボールの動きを作る

素材の準備が整いましたので、ここからは実際にプログラミングをしていきます。まずは、モンスターボールの動きを作っていきます。

ここではモンスターとボールだけをみていくので、それ以外のスプライトは下図のように非表示マークにしといていただくか、緑の旗を押したときに隠すというプログラムを組んでおいてください。

次に、デフォルトの配置を作っていきます。ボールとモンスターそれぞれ以下のようにコードを書いてください。モンスターはコスチュームを変化させて動きをつけます。

次にボールを投げる動きを作ります。実際はビデオモーションセンサーを活用しますが、まずはスプライトが押されたら（クリックされたら）たら投げるという動きを作っていきます。

ボールのコードに以下のように追加をしてください。

0度に向けるというのはつまり真上に向けるということです。進行方向に２０歩づつ１５回動かしますが、その間に大きさが少しづつ小さくなっていきます。さらに下向きに小さくなりながら動きます。これにより、ボールが投げられるような動きを再現することができます。実際にスプライトを押すと以下のような動きになります。

下図のように、角度と動く歩数を変えることで、ボールの投げられる向きと距離が変化します。実際にいろいろ数字をいじってみてください。

最後にゲットの条件を追加します。今回はボールが、モンスターのスプライトに触れたらゲットということにします。ゲットしたら”ポケモンゲット”失敗したら”もう一回チャレンジ”のメッセージが発せられるようにします。

ポケモンゲット時の光の動き

ポケモンをゲットしたときの、閃光が走り、光を放ち拡散するという一連の動きを作ります。

まずは閃光の部分です。前章でも記載した通り、素材が進む方向にスタンプされていくことで、閃光が走る様子を作ります。スタンプは拡張機能からペン機能を追加していくことで利用可能です。左下の＋ボタンを押して拡張機能のペンを選択してください。

閃光（ゲット光１）

そうすると、ペンに関するブロックが追加されるのがわかります。

この中にある”スタンプ”のブロックを使って閃光を作ります。ゲット光１のコードに以下のように記載してください。

動かしている間、スタンプを押し続けるということになります。例えばわかりやすいように、上記のコードで大きさを２０%に変更すると、以下のようになります。この点線になっているのは動いている方向にスタンプが押されていっている様子を示しています。

スタンプとは動いた足跡のようなものです。クローンをつくるよりグッと楽なので是非活用してみてください。

では、大きさを５０%に戻してプレイしてみてください。以下のように閃光が走るのがわかります。
今回は、調整済みのコードを記載していますが、大きさや、初めの位置、向かう方向、一度に何歩動かして何回繰り返すか、などは実際は少しずつ値を変えながら調整することになります。

モンスター

次にモンスターです。モンスターは閃光が当たるとボールに吸収されていくので小さくなっていく演出が必要になります。以下のように追記してください。その場で小さくなるというより、少し光に押されながら小さくなるという印象の動きにしています。

光を放ち拡散する（ゲット光２・３）

閃光がモンスターに当たると光を放ち拡散します。
ゲット光２・３のコードにそれぞれ以下のように記載します。

っこで幽霊の効果というものが出てきますが、幽霊の効果１００というのが完全に消えている状態で、５０は半透明、０は通常の表示となります。
光は放たれて消えていくので透明効果を上げていくようなプログラムを組んでいます。ここまでできた状態の動画は以下のようになります。

モンスターボールをまとう光（ゲット光４）

最後にモンスターボールをまとう光のコードも書いていきます。大きく広がっていき、色が薄くなっていきます。

ポケモンゲット時のボールの動き

次にゲット時のボールの動きです。ボールはまずおおまかな動きを定義しましょう。モンスターをゲットしたボールは、空中にじわっと現れ、下に落ちてきて、バウンドし、左右に揺れる（モンスターが入ってるから）という動きをとります。ブロック定義を使ってまずは動きを書いてみることをオススメめします。そのうえでそれぞれのブロック定義を作っていくと、頭の中が整理されますし、見直すときもわかりやすいです。

あとから見返したり、他の人が見ることも想定して、ブロック定義を多用するようにしましょう。

動きが大体決まったところで、それぞれのブロックの動きを定義していきます。それぞれの定義はいかのとおりとなります。これらのコードがすべて並んでしまうと後から見たら全くわからないようなコードになってしまいます。

あと、”やったー”のメッセージを受け取ったときにやったーのスプライトが表示されるようにしましょう。以下のような感じです。

それでは実際にプレイしてみます。

ビデオモーションセンサーを追加

ここまでできたら、ビデオモーションセンサーを追加していきます。動きを確認するためにボールを押したら必ずゲットできるようにしていましたが、実際のゲームでは手の動きでボールを前に飛ばします。まずはビデオモーションセンサー機能を追加していきます。ペンを追加した時と同様、画面左下のプラスボタンから拡張機能の追加を行います。

ビデオモーションセンサーのブロックが追加されたことが確認できたら、ボールのコードを書き換えていきます。下図のように、元々のコードと比較して矢印の３箇所を書き換えました。
ボールの投げられる方向：スプライトのビデオの向き（手を動かす方向）
ボールの投げられる速さ：スプライトのビデオのモーション（手を動かす大きさ）
と定義し、さらにビデオモーションが３０以上のときだけに反応するようにします。そうしなければ、ささいな動きでもボールが飛んで行ってしまいゲームになりません。

また「もう一回チャレンジ」を受け取った時に、初めの位置と大きさに戻るようにしておきます。