スクラッチで3Dクレーンの作り方

中級

今回つくるゲーム

難易度3 out of 5 stars

今回はスクラッチで3Dクレーンゲームを作っていきます。2Dのクレーンゲームはこちらで解説していますが、今回はそれの3Dバージョンです。奥行きをどのようにつくっていくかがポイントとなります。意外と簡単なコードで作れてしまいますのでぜひ挑戦してみてください!

この記事でも順番に作り方を解説しますがくわしくははYouTube動画で確認してください。


まずはゲームをプレイしてみましょう。

youtube解説

こちらの動画ではわかりやすくゲームの作り方を解説しています。実際に作るときはこの動画を見ながら作ることをお勧めします。チャンネル登録もよろしくお願いします!

[スクラッチ]3Dクレーンゲームの作り方①

ガラスケースを描く

まずはクレーンゲームの”ガラスケース”から作っていきます。3Dのガラスケースを描くために、まずはガイドを配置します。そのために背景ある「Xy-grid-30px」という背景を選びます。そして左下の「ベクターに変換」というボタンを押し、コピーできるようにします。

スクラッチで3Dクレーンの作り方
スクラッチで3Dクレーンの作り方

次に新しいスプライトを作り、そこに先ほどのグリッドを貼り付けます。見やすいように、x座標、y座標は両方0にしておきます。あわせて先ほどのグリッドの背景は削除しておきましょう。

スクラッチで3Dクレーンの作り方

ではこのマス目にそって3Dのガラスケースを描いていきます。こんな感じで描いてください。このあたりの作り方も動画で確認してみてください!

スクラッチで3Dクレーンの作り方

次に、これを手前と背面に分けます。

スクラッチで3Dクレーンの作り方
スクラッチで3Dクレーンの作り方

次に、背面の方をコピーして、背景に貼り付けます。こんな感じです。背面の方は色をつけておき、さらに穴もつくっておくと、いい感じです。そうすると右上の窓に表示されるように、ガラスのスプライトと背景が合体して、ガラスケースが完成します。このように二つに分けることによって、中にキャラクター(ぬいぐるみ)を置いたときにレイヤーが正しく配置されます。

スクラッチで3Dクレーンの作り方

ガラスのコードは以下のように記載しておきましょう。

スクラッチで3Dクレーンの作り方

操作ボタンをつくる

次に操作ボタンを作っていきます。新しくスプライトを追加して、元々スクラッチにあるボタンのコスチュームに以下のように矢印などを書いていきます。作るのは右・上・決定の3種類です。

スクラッチで3Dクレーンの作り方

次にコードを書きます。以下のようにコードを書くと、ボタンが表示され、ボタンを押すとそれぞれの動きを作ることができるようになります。

スクラッチで3Dクレーンの作り方

クレーンを作る

次に、クレーンを作ります。以下のように、開く・閉じるの2パターンのクレーンを作ります。クレーンを閉じた部分がコスチュームの中心になるように描くのがポイントです。

スクラッチで3Dクレーンの作り方
スクラッチで3Dクレーンの作り方

クレーンのコードは以下の通りとなります。上移動のときに65度に向けることで、3Dっぽい動きになります。右カウントと上カウントの変数をつくることで、もときた道をクレーンが戻れるようにしています。

スクラッチで3Dクレーンの作り方
スクラッチで3Dクレーンの作り方

ここまでで、クレーンは操作できるようになったのでボタンを押して、思った通りにクレーンを動かせるかためしてみましょう。

ケーブルを描く

では、クレーンにケーブルをつけましょう。新しいスプライトを作成し、「ペン」の拡張機能を追加して以下のようにコードを描きます(コスチュームは不要です)

スクラッチで3Dクレーンの作り方

これで、クレーンを下ろした時に、以下のようにケーブルも降りていくようになります。

スクラッチで3Dクレーンの作り方

キャラを配置する

さいごにキャラを配置していきます。まずはネコのコスチュームの中心をおなかくらいのところになるように上に少し移動させます。つかめるかどうかの判定をクレーンの先っぽ(キャッチする部分)とのキョリにするためです。

スクラッチで3Dクレーンの作り方



以下のようにx座標、y座標というリストを作成し、キャラを配置する場所のx座標、y座標を指定していきます。たとえば、1つめのキャラはx,y=-50,-66に配置するということです。奥から順番に配置していくのがポイントとなります。色の効果を変えることで、ネコをカラフルにすることができます。

スクラッチで3Dクレーンの作り方

次に、同じネコのスプライトに以下のようにコードを追加します。これでクレーンを近くに下ろせるとキャッチできるようになります。

スクラッチで3Dクレーンの作り方

すべてのコード

これで全てのコードは完成です。

3Dクレーンゲーム