top_image_02
top_image_01

プログラムを動かしてみよう

2019年2月7日  カテゴリ:IT用語解説, インターン

こんにちは、インターン生の鶴田です。
GameMaker Studio(以下GMS)について紹介していく記事、第5回テーマは「プログラムを動かしてみよう」です。
前回、「今回からゲームを作るよ!」と言いながら操作と用語の説明ばかりでちっともプログラミングらしいことをしていませんでしたが(ごめんなさい)、
今回からGMSのドラッグ&ドロップ機能を使ったプログラミングを説明していきますよ。

ところで、この記事では初心者向けの内容を9回でまとめるために「こうするとこうなる」のみをサラッと説明していきます。
そのため「なぜそうなるのか」についてはあまり深入りしません。気になる方は自分で調べてみたり、自分で数値やプログラムを自由に書き換えて試してみるのがいいと思います。

・プログラムのテスト(Run)
まずは前回やったのと同じように、丸いボールのスプライトを設定したオブジェクトを用意してルームに配置してみましょう。

こんな感じです。
ではいきなりですが、この状態で今作っているものをゲームとして作動させるとどうなるか試してみましょう。
画面上のタブのBuildをクリック→Runを選ぶと、ゲームとしての動作をテストすることができます。
(タブの下の並んでいるボタンの再生マークをクリックしたり、F5キーを押しても同じことができます)
出てきたウインドウを見てみると……当たり前ですが何も動いていませんね。

というわけで、今日はこの白いボールが動くようにします。
ボールを動かすには、ボールの中身であるオブジェクトにプログラムを仕込んでいきます。
ボールのオブジェクトを選んで編集画面に行きましょう。

・イベントの作成
前回説明がなかった、右側にくっついてるEventsという窓が今回の主役。
オブジェクトにプログラムを組む時は、まずこの下にあるAdd Eventボタンを押します。

なんだかズラズラと出てきましたが、これを使って「プログラムが作動するきっかけ」を決めます。
まずは一番上のCreateを選びましょう。これはルームに出現したとき、つまり一番最初に動くプログラムに使います。

イベントを決めるとイベント一覧の右に画面が増えます。これがプログラムを作る画面です。(見づらい場合はマウスホイールを押したままドラッグで位置を調整したり拡大縮小をしましょう)
右に並んでいるカラフルなアイコンが、自分でプログラムを書く代わりに処理をしてくれるブロックです。
このブロックをドラッグ&ドロップで並べて項目の数字を設定するだけで、ゲームの内部処理を作ることができちゃいます。
これがGMSの特徴であるドラッグ&ドロップ・プログラミングです。(言語でプログラミングをするモードももちろんあります)

・ブロックプログラミング
早速やってみましょう。
右のアイコン一覧をスクロールしていき、Movementというカテゴリの左上にある「Set Direction Fixed」ブロックを左の空白部分にドラッグします。
矢印の描かれたウインドウが出てくるので、右向きの矢印をクリックします。

これでボールが動く向きが右向きに設定されました。
ちなみに、もし間違えて違うブロックを出してしまったときはブロック右上の×ボタンを押してブロックを消しましょう。
出しっぱなしにしておくとプログラムの一部だと認識されてバグの原因になります。

次に、同じMovementにある「Set Speed」ブロックをさっきのウインドウの下側にドラッグしてみましょう。
2つ目以降のブロックは勝手に他のブロックと繋がっていきます。プログラムは上から下に処理されていくので、上にあるブロックほど先に処理されます。
処理の順番を間違えるとプログラムが台無しになってしまうこともあるので、ブロックの並びには注意しましょう。
Set SpeedのウインドウにあるType欄はDirectionのままにして、speedの欄に10を入力します。

こうなっていればOK。これでボールが登場した瞬間から、右向きに速度10で動き続けるというプログラムが完成しました。

この状態でもう一度Runしてみると……ボールが右に動いて、画面の外側まで出て行きます。
ここまでできた皆さん、おめでとうございます。あなたはGMSでのプログラミングに成功しました!

・壁に当たると跳ね返る-衝突イベント-
ボールを動かすことができましたが、これだけだとゲームには程遠いですよね。
もうちょっとゲームっぽい動きにするために、ボールが壁に当たると動く向きが変わるというプログラムを作ってみましょう。

実際にプログラムを作っていく前に、まずはボールがぶつかる壁のオブジェクトとスプライトを用意します。

オブジェクト、スプライトの作り方と設定の手順は第3回と同じなので省略です。
強いて言えばスプライトはキャンパスいっぱい塗りつぶしたほうが壁っぽくなります。

できた壁オブジェクトをボールの左右を挟むように配置してみましょう。ルームにオブジェクトを配置する方法は第4回と同じです。
これでルームの準備ができました。

次にボールオブジェクトのプログラムに戻ります。
さっきCreateイベントを作ったのと同じように、
Add Eventボタン→Collisionイベント→さっき作ったブロック を選択。

画像右のようにEventsの欄にイベントが追加されていれば成功です。
これで「ボールがブロックとぶつかったときのプログラム」を組めるようになりました。
このように、オブジェクトにイベント(きっかけ、~したとき)とプログラム(どうするか)を設定していくのがGMSのプログラミングの基本となります。

それでは、動く向きを変える処理を作ってみましょう。
ブロック一覧のMovementカテゴリ(さっきと同じです)から、「Set Direction Variable」ブロックをドラッグ&ドロップ。
Direction欄に180を入力し、右のRelativeのチェックボックスにチェックを入れます。

実はこれだけで「壁オブジェクト(のインスタンス)にぶつかったら、向きを180度変える」というプログラムが完成してしまいました。
早速Runしてみましょう。ボールが二つのブロックの間を往復していれば成功です!

実はこれだけで「壁オブジェクトにぶつかったら、向きを180度変える」というプログラムが完成してしまいました。
早速Runしてみましょう。ボールが二つのブロックの間を往復していれば成功です!

・まとめ
今回はプログラミングの基礎編として、
オブジェクトのイベントを設定する→ブロックから必要な処理を選ぶ→ブロックを並べて数値を設定する
という一連の流れを説明しました。
ブロックの種類が色々あって驚いたかもしれませんが、簡単なゲームを作るにはブロックの内ごく一部の使い方がわかれば問題ありません。
次回はキーボードで操作できるオブジェクトの作り方を説明します。お楽しみに!

・おまけ
今回使った処理をより深く理解したい人は、Set Speedの数値を変えてボールの動く速度を変えてみたり、
衝突イベントのDirectionの数値やブロックの配置を変えるとどうなるかを試してみると面白いと思います。

衝突イベントのDirectionを-90にして画像のような配置にすると…?

※記事中の画像はすべてGameMaker Studio 2のスクリーンショットを加工したものです。

興味を持たれた方はお気軽にお問い合わせください。

インターンシップへの申し込み・お問い合わせ先

toiawase-(1) (1)

メールでのお問い合わせは、下記フォームに入力して送信してください。

お名前 (必須)

メールアドレス (必須)

電話番号 (必須)

題名

メッセージ本文