GameMakerStudioチュートリアル

投稿者: | 2013年9月27日

■このページについて

GameMakerStudioを使って簡単なゲームを作ってみるページです。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━

★目次

━━━━━━━━━━━━━━━━━━━━━━━━━━━━

■プロジェクトの作成

まず、GameMakerStudioを起動します。

001

  1. 「New」のタブを選択します。
  2. プロジェクトの保存フォルダ(Project Directory)が変なところになっているので、デスクトップにでもしておきましょう
  3. 変更できたら「Create」でプロジェクトを作成します

■Roomの作成と実行

002

新規プロジェクトが作られるので、左側のプロジェクトツリーから「Room」を選択して右クリック、「Create Room」を選択してRoomを作成します。


003

そうするとRoomが作成され、Roomプロパティが開きます。なおRoomというのは、ゲームのキャラクターが動き回る部屋のようなものです。

Roomがあると実行することができます。早速F5を押して実行してみます。


004

するとビルドが開始して灰色の画面が出ます。とりあえず部屋だけ作ったのでそれ以外は何も表示されない状態です。

これでは寂しいのでプレイヤーキャラを置いてみましょう。

■Spriteの作成

Ball1

まずはプレイヤーとなるこの画像を右クリックで保存してください。


005

保存できたら、プロジェクトツリーから「Sprites」を右クリック「Create Sprite」を選択してSpriteを作成します。


006

するとスプライトプロパティが表示されるので、「Name」に「sprPlayer」と入力して、「Load Sprite」ボタンを押します。


007

画像選択のダイアログが表示されるので、先ほど保存したボール画像を選択して「開く」ボタンを押します。「Remove Background」にチェックを入れて背景色を透過しておきます。


008

すると左上にボール画像が表示されるので、OKを押します。


009

プロジェクトツリーにsprPlayerが登録されました。ここで登録したSpriteというのは、キャラクター画像データのようなものと考えてもらえれば分かりやすいと思います。

■Objectの作成

Spriteは単なる画像データなのでそれを動かすための仕組みが必要となります。Objectを作成することで画像データ(Sprite)を動かすことができるようになります。

ではObjectを作ってみます。


010

Objectを作るにはプロジェクトツリーから「Objects」を右クリックして「Create Object」を選択します。


011

するとObjectプロパティが表示されるので、「Name」に「objPlayer」と入力し、すぐ下のとあるところをクリックして「sprPlayer」を選択します。


012

OKボタンを押して、objPlayerが作成されたことを確認します。

■ObjectをRoomに配置する

では早速Objectを配置します。プロジェクトツリーからRooms>room0をダブルクリックして、Roomプロパティ画面を開きます。(すでに開いている場合はそのまま)


013

そこから「objects」をクリック、すぐ下のところをクリックするとポップアップされるので「objPlayer」を選択します。


014

その状態でグリッド上の好きなところをクリックするとボールが配置されます。そしてF5を押して実行します。


015

画面中央にボールがぽつんと置かれた状態になります。そして微動だにしません。不動の構えですね。

■Objectを動かしてみる

動かなくてしょんぼりな結果になってしまったので、Objectを動かしてみます。

016

Objectを動かすには「objPlayer」をダブルクリックして、Objectプロパティを開きます。そこから、「AddEvent」ボタンを押して「Create」イベントを作成します。これはobjPlayerの実体が生成されたときに発生するイベントとなります。


017

「Craete」イベントが作成されたことを確認したら、次にそのイベントに対応するアクションを定義します。今回は移動アクションをさせたいので、8方向の緑色の矢印アイコンを選択してドラッグ&ドロップします。


018

移動方法として、斜め4方向に動かしたいと思います。斜め矢印をそれぞれクリックし、「Speed」のところに数字の「4」を指定します。これは移動する速さとなります。設定が完了したら「OK」ボタンを押します。

F5を押して動作を確認します。ボールが斜めに移動して画面外に出て行ったのを確認できると思います。

■壁を作る

またもしょんぼりな結果になってしまいました。これはボールの動きを遮るものがないためです。そこでボールが画面外に出て行くのを回避するために外に壁を作りたいと思います。

Square

まずはこの画像を保存します。

そうしたら、Spriteを「sprWall」、Objectを「objWall」で作成してみましょう。(ボール画像と同じ手順で登録できるので省略します)


020

Roomプロパティを開いて、左クリックでぽちぽちと外堀を埋めていきます。「Ctrl+Shift」を押しながらドラッグすると連続で配置することができます。

壁を作ったら早速F5で実行しましょう。どうでしょうか。残念ながらボールは画面外に出て行ってしまいました。これはボールと壁に当たり判定がないため、抜けてしまっています。

■当たり判定をつける

当たり判定をつけるには、Objectプロパティを設定します。

  • objPlayerはobjWallに衝突すると跳ね返る

という動きを設定したいと思います。

プロジェクトツリーからobjPlayerをダブルクリックしてObjectプロパティを開きます。

021

「Add Event」ボタンを押して「Collision」を選択、衝突対象には「objWall」を選択します。


022

次にアクションの設定です。Bounceアイコンをドラッグ&ドロップして、Bounce設定はそのまま「OK」を押します。これでobjPlayer側の設定は完了です。


続けて、objWall側の設定です。プロジェクトツリーから「objWall」をダブルクリックしてObjectプロパティを開きます。

023

そうしたら「Solid」にチェックを入れます。SolidをつけることによってそのObjectに他のObjectがめり込まなくなります。

早速F5で実行するとボールが壁に跳ね返るようになったと思います。

■ゲームらしくする

ようやくちゃんとした挙動となりましたが、あまりゲームらしくないですね。そこで、周りの壁を壊せるようにして点が入るようにしたいと思います。

024

プロジェクトツリーから「objWall」をダブルクリックしてObjectプロパティを開き、「AddEvent」>「Collision」>「objPlayer」を選択します。


025

そしてアクションには「scoreタブ」を選択>「Set Score」アイコンをドラッグ&ドロップします。


026

「Set Score」の設定には以下のように指定します。

  • new score:「1」を設定
  • relative: チェックを入れる(これを入れないと1が代入されてしまう。relativeとは「相対的」という意味です)

ついでに壁が破壊されるようにしてみます。

027

「main1タブ」を選択>「Destroy Instance」アイコンをドラッグ&ドロップします。


028

Destroy設定は特に何も必要ないので、そのまま「OK」を押します。


029

ボールが壁にぶつかると壁が壊れるようになりました。ですがスコアが表示されていませんね。

スコアの表示

スコアを表示するために、表示用のObjectを作成します。


031

新規にObjectを作成し、「Name」を「objDrawner」、「Add Event」ボタン>「Draw」ボタンを選択します。


032

続いて対応するアクションの設定です。「drawタブ」>「Draw Textアイコン」をドラッグ&ドロップします。


033

「Draw Text」の設定は以下のようにします。

textには

"Score:" + string(score)

と指定して、xとyにはそれぞれ「32」を指定します。

最後にRoomに配置します。ObjectはRoomに配置しない限り、動作をしないためです。


034

「objDrawner」を選択して、任意のところに配置します。配置できたら、F5で実行します。


035

左上にスコアが表示されるようになりました。


プレイヤーの入力を受け付けるようにする

このままだと見ているだけでゲームらしくないので、プレイヤーの入力を受け付けるようにします。ここではボールをクリックすると移動方向が90度回転するようにしてみます。


038

プロジェクトツリーから「objPlayer」をダブルクリック>「AddEvent」>「Mouse」>「Left pressed」を選択します。


アクションには、

039

「Controlタブ」>「Set Variableアイコン」をドラッグ&ドロップします。


040

設定内容は、

  • variable:direction
  • value:90
  • Relative:チェックを入れる

となります。これはボールを左クリックするたび「direction(方向)」を「90度」加算していくアクションとなります。

ゲームオーバーを入れる

ようやくゲームっぽくなってきたのでゲームオーバーを入れてみます。今回は画面外にボールが飛び出したらゲームオーバーになるようにしましょう。


041

プロジェクトツリーから「objPlayer」をダブルクリックしてObjectプロパティを開き、「AddEvent」>「other」>「Outside room」を選びます。これは「objPlayer」が画面外に出た時発生するイベントです。


042

アクションには「main2タブ」>「Display Messageアイコン」をドロップ>設定項目はmessageに「GameOver!」を指定してOKボタンを押します。


043

もう1つアクションを追加します。

「main2タブ」>「End Gameアイコン」をドロップします。


■完成!

ではF5でゲームを開始してみます。

044

ボールが画面外に出ると「ゲームオーバー」のメッセージが表示され、ゲームが終了します。ゲームオーバーになるコツはクリックを素早く2回連打して反射した方向に戻すことです。いかに低いスコアでゲームオーバーになれるかを競ってみてもいいかもしれません。



以上で、チュートリアルは終了となります。

より深い内容はこちらの動画が参考になると思います。

私もまずはこの動画を参考に使いかたを覚えました。