今回つくるゲーム
難易度
今回はスクラッチでクレーンゲーム(ufoキャッチャー)を作っていきます。クレーンを横に動かし、狙いを定めておろしてぬいぐるみをキャッチします。動きとしてはとても単純なので比較的挑戦しやすいプログラミングですが、クレーンの線を描くのにペン機能を使ったり、複数のぬいぐるみに同じコードを書いたりと、ゲーム作りに役立つテクニックも多く含まれます。是非挑戦してみてください。
まずは実際にゲームをプレイしてみてください。右矢印キーでクレーンを移動、スペースキーでクレーンが下に降りてキャッチします。
こちらの動画を見てから記事を読むことをお勧めします。チャンネル登録もよろしくお願いします!
はじめに
まず、以下をリミックスしてください
こちらにはゲームを作るのに必要な素材が揃っています。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-20.51.58.png?resize=1024%2C557&ssl=1)
クレーンを動かす
まずはクレーンの動きを作っていきます。以下のようなルールで動くことをイメージしましょう。
右矢印キーを押す :右に移動する(押されている間だけ) スペースキーを押す:降下して閉じる→持ち上げる→箱に移動→アームを広げる
それをコードに描くと以下の通りになります。
動きの節目でメッセージ機能を使い、コードを分けていくようにしましょう。
また★の部分は、クレーンが上に引き上げられた時の衝撃を表現しています。実際のクレーンゲームでもこの衝撃でせっかく引き上げたぬいぐるみが落ちてしまうことがありますよね。このような細かな動きを入れることがゲームのクオリティーにつながります。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/07/スクリーンショット-2022-07-01-15.46.56.png?resize=847%2C636&ssl=1)
持ち上げている間や、箱に移動している間は、スペースキーが押せないようにしなければなりません。そのためにスペース押せるという変数を作り、制御します。このようなテクニックはよく使うのでマスターしましょう。
実際に動かしてみましょう。以下のように動けば成功です。動きの途中でスペースキーを押して、制御できていることも確認しましょう。
天井からクレーンの線を描く
このままだと、クレーンが空中に浮いているように見えるので、天井から吊るされた線を描いていきましょう。そのために、拡張機能のペン機能を活用していきます。コード左下の拡張機能追加ボタンを押し、ペンを選択します。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.58.17.png?resize=302%2C588&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.58.29.png?resize=1024%2C470&ssl=1)
すると、ペンの機能が使えるようになりますので、線のスプライトに以下のコードを書いていきます。
青いペンがずっと天井からクレーンに向かってまっすぐ描かれることで、線が繋がっているように見えます。y座標をクレーンのy座標より20高くしているのは、クレーン上部の半円の部分に線をくっつけるためです。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.27.49-1.png?resize=761%2C440&ssl=1)
実際に、を押してクレーンを動かしてみましょう。以下のように、クレーンの動きについて線が描かれれば成功です。
ネコのぬいぐるみがキャッチされる
次にネコのぬいぐるみがキャッチされるようにしていきます。
先ほどのクレーンの動きに沿ってコードを書いていきます。
以下のように、クレーンとネコのx座標の違いが4より小さければ持ち上げ成功とします。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-23.18.42.png?resize=816%2C611&ssl=1)
コードにすると以下の通りです。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.35.45.png?resize=844%2C597&ssl=1)
持ち上げ成功の変数を作り、成功したか失敗したかを記録していきますが、今後、ネコ以外のぬいぐるみも作るので、この変数はネコだけに適用されるようにしなければなりません。そのために変数を作るときに以下のように”このスプライトのみ”にチェックを入れるようにしましょう。これはゲームを作る上でとても大切な考え方です。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.36.36.png?resize=299%2C316&ssl=1)
実際にプレーしてみましょう。以下のようにネコをゲットできれば成功です。
ネコのぬいぐるみキャッチ失敗
次にぬいぐるみキャッチ失敗したときの動きを作っていきます。失敗には2種類あります。
失敗1:そもそもキャッチできなかった→左右にカタンッと揺れる 失敗2:キャッチできたけど引き上げた衝撃で運悪く落ちる
この2つの失敗についてコードを追加していきます。ネコの持ち上げるのコードに以下のようにブロック定義を追加していきましょう。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.43.29.png?resize=852%2C634&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.45.07.png?resize=852%2C317&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.45.21.png?resize=852%2C562&ssl=1)
実際に失敗の動きができているかプレイして確認しましょう。以下のようにカタンッと揺れたり、運悪く落下すれば成功です。
ぬいぐるみを追加する
では、ここからネコ以外のぬいぐるみを配置していきます。基本的には全く同じ動きになるので、コードを複製していきます。ネコのスプライトを右クリックして、複製を選びます。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.53.59.png?resize=492%2C332&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.54.11.png?resize=492%2C332&ssl=1)
複製ができたらコスチュームを好きなキャラクターに変更します。スプライトの名前も変更しておきましょう。今回はペンギンにします。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.55.32.png?resize=1024%2C522&ssl=1)
コードは位置と大きさだけ変更しておきます。先ほど、ネコのコードを書いたときに持ち上げ成功の変数は”このスプライトのみ”にチェックを入れましたが、複製したときにもそれは反映されます。これにより、ネコの持ち上げが成功したときにも、ペンギンの持ち上げは成功していないという状況を作ることができます。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.56.43.png?resize=846%2C637&ssl=1)
同様にトナカイのぬいぐるみも追加します。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.57.46.png?resize=1024%2C525&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.58.26.png?resize=848%2C638&ssl=1)
これで、実際にプレイしてみてください。以下のように、狙ったぬいぐるみをゲットできれば成功です。
ショーケースを作る
基本的なクレーンゲームの動きはここまでで完成ですが、ゲームの完成度を上げていきましょう。まずはショーケース感を出していきましょう。手前からアクリル板、箱、箱奥の順番で配置していきます。幽霊の効果を使って後ろが透けるようにしてショーケースの感じを出していきます。
箱を、箱と箱奥の2つに分けているのはぬいぐるみを落としたときに箱の中に落ちていくように見せるためです。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.49.43.png?resize=614%2C249&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.50.02.png?resize=614%2C249&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-21.50.14.png?resize=614%2C249&ssl=1)
これで、以下のように表示されるはずです。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.02.33-1.png?resize=490%2C410&ssl=1)
ボタンの色が変化する
これも細かい設定ですが、右矢印キー、スペースキーを押したときにそれぞれのボタンが反応するようにします。
右ボタン・ダウンボタンのコードに以下のようにコードを書きます。
これでボタンが押されたときに色が変わるようになりました。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.04.04-1.png?resize=608%2C410&ssl=1)
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.04.20.png?resize=608%2C410&ssl=1)
効果音を設定する
最後に効果音を設定していきます。右向きに移動しているとき、スペースキーが押されてクレーンが降下してから箱までもどるまで、それぞれに音を設定します。さらにアームを動かすときにも音を出します。
クレーンのコードに以下を追加します。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.09.51.png?resize=852%2C427&ssl=1)
さらに、ぬいぐるみを落とした時の効果音も設定します。すべてのぬいぐるみのコードに以下を追加します。
![スクラッチでクレーンゲーム(ufoキャッチャー)の作り方](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2022/04/スクリーンショット-2022-04-18-22.10.06.png?resize=368%2C286&ssl=1)
すべてのコード
これで全てのプログラムが完成です。すべてのコードは以下から確認できます。