はじめての脱出ゲームメーカー（後編）

ではさっそくゲームを動かすプログラムを作っていきましょう！

脱出ゲームメーカーのアプリインストールはこちら↓

イベントをつくろう

イベントとは？

例えば、

• 「メッセージを表示する」
• 「アイテムを入手する」
• 「クリア画面に移動する」

などの細かなイベントを順に組み合わせることでゲームを動かすことができます。

鍵のイベント

さて、まずは部屋のシーンを表示させてください。そして下の画面赤枠「タップイベント」を何度かタップしてみてください。

すると、画面上の「イベント：追加編集」という箇所が「拡大縮小」→「移動」というように変化していくことを確認してください。

変化することを確認したら、「イベント：追加編集」となっている状態で画面内の鍵のところをタップしてみてください。

次のような画面が表示されます。

「タップイベント編集画面」が表示されました。

ここには「プレイヤーが鍵をタップした時のゲームの動き」を設定していきます。

ここで、画面赤枠「イベント追加」をタップすると次のような画面になります。

「イベント選択画面」が開きました。

さて、「プレイヤーが鍵をタップした時」に起こることなので、

まずは、「テーブルに鍵が置いてある」という説明のメッセージを表示させましょうか。

では、イベント選択画面赤枠の「メッセージ表示」をタップしてください。

ここに「テーブルに鍵が置いてある」と入力して「Ok」をタップしてみましょう。

すると次のように表示されます。

「メッセージ表示：テーブルに鍵が置いてある」という1行が追加されましたね。これで、さきほどのプレビュー画面のようなメッセージをゲーム中に表示させられるようになりました！

もし、間違って入力してしまったら

上の画面の状態で、また「イベント追加」をタップしてみてください。

同じくまたイベント選択画面が開きました。プレイヤーに「アイテムをゲット」させるために赤枠「アイテム取得」をタップしてください。次のような画面になります。

アイテム選択画面が開きました。

「アイテム取得」のイベントではプレイヤーがいったい何のアイテムを取得するのか必ず選ばなくてはいけません。

今回アイテムは「最後の鍵」しかないので、画面赤枠のとおり「最後の鍵」をタップして選択してください。

下に「アイテム取得：最後の鍵」という行が追加されました。

このように表示されればプレイヤーに「最後の鍵」をゲットさせることができます。

ここでまたプレビューを見てみましょう

アイテム欄に「最後の鍵」が追加されていますね。でもちょっとおかしな点にお気づきでしょうか。

プレイヤー目線だと、テーブルの上の「鍵」が残ったままのように見えてしまいますね。

この理由は、「シーン部品」として配置した「鍵の画像」がそのまま表示され続けているからです。

こういう場合は、「鍵の画像」を見えなくしてしまう。つまり「非表示」にしてしまうと解決します。

「鍵の画像」を「非表示」にするために、またイベントを追加していきましょう！

またタップイベント編集画面の左上「イベント追加」をタップして、「イベント選択画面」を開いてください。

画面赤枠「画像非表示」とは、シーンに配置したシーン部品の画像をプレイヤーから見えないようにするイベントです。

「画像非表示」をタップすると次のような画面になります。

まるで画像編集画面のようにも見えますが、この画面は「どの画像」を「非表示」にしたいのかを選ぶ画面です。

今回は「鍵の画像」を「非表示」にしたいので、「鍵の画像」をタップで選んでください。

「画像非表示：image003_〇〇」という行が３行目に追加されましたね。少しわかりにくいですが、今回のチュートリアルでは「鍵の画像」はimage003という名前が自動で付けられています。

この3行だと「メッセージ」→「アイテム取得」→「画像非表示」の順に実行されていきます。イベントを追加するときは順番がとても大切だということを覚えておいてください。

さて、多くの脱出ゲームではアイテムを取得すると、「〇〇を手に入れた」などのメッセージが表示されますね。

練習もかねて、４行目にメッセージ表示を追加して「鍵を手に入れた」と表示させるようにしてみてください。

すると次のようになっているはずです。

フラグとIF分岐

ここでイベント編集最大の醍醐味であるフラグとIF分岐について触れていきます。

フラグという言葉はサブカルが好きな人なら日常でも使うことがあるかもしれません。なじみのない人も難しく感じる必要はありません。

フラグとは、ONとOFFに切り替えられるスイッチだと思ってください。

脱出ゲームメーカーでは、フラグにはONとOFFの2つの状態がある、ということを先に知っておいてください。

IF分岐のIFとは英単語のif（もしも～ならば～）と考えて頂いて大丈夫です。

IF分岐の中身は、具体的に紹介すると、

もしも「アイテム」を「使って」いたら「クリア画面に行く」

などのように使っていきます。ゲームを作る上で欠かせないイベントです。

まずは、問題点を整理しましょう。

今回の問題点は、「すでに鍵をゲットしたのに、また鍵を手に入れるイベントが発生してしまう。」という点です。

問題点が整理できたようですね。

「鍵をゲットする」のイベントは分かれ道の分岐点です。

分岐点が見えたならば、その分岐点に合った「フラグ」を作りましょう！

フラグを作るには、左上の「戻る」を何度かタップして「メニュー画面」を開いてください。そして、赤枠「フラグ管理」をタップしてください。

次のような「フラグ管理画面」になります。まだ何もフラグがありませんね。

左上赤枠「フラグ追加」をタップしてください。

下の画面のような「フラグ名入力画面」が出てきます。ここでフラグに名前を付けましょう！

このフラグの名前もプレイヤーには見られない名前なので、とにかく自分で分かりやすい名前にしたほうがよいです。

今回のチュートリアルでは、分岐点が「鍵をゲットする」というイベントなので、フラグの名前もそのまま「鍵をゲットする」という名前にしてみましょう。

名前を付けると次のような画面になります。「鍵をゲットする」という1行が追加されていますね。

フラグを作る作業はこれで終了です。

次はIF分岐イベントで今作った「鍵をゲットする」フラグを活用していきましょう！

また、「部屋のシーン」にある鍵の部分の「タップイベント編集画面」を開いてください。

今このような状態になっていますが、今度は５行目に「フラグ操作」というイベントを追加していきます。

左上の「イベント追加」をタップして「イベント選択画面」を開いてください。

画面赤枠「フラグ操作」というイベントをタップしてください。次のような画面になります。

「フラグと操作を選択してください」という画面が現れました。ここでは画面赤枠「選択」をタップして「フラグ選択画面」を開きましょう。

さきほど作った「鍵をゲットする」フラグが表示されているので赤枠「鍵をゲットする」をタップして選択してください。

「フラグ：」のあとに「鍵をゲットする」という表示が追加されました。

もうひとつ「操作」という欄がありますが、ここでは「フラグ」を「ON」にするか「OFF」するかを選ぶことができます。

ここでは「鍵をゲットする」フラグを「ON」の状態にする、という内容で「Ok」をタップしてみましょう。

すると次のように５行分のイベントが並ぶはずです。

今までは新しいイベント一番下の行に追加してきましたが、今回のIF分岐イベントは一番上の行に追加していきます。

５行のイベントが並んだ「タップイベント編集画面」の一番上の行、「メッセージ表示：テーブルに…」の行を1回だけタップしてみてください。

下の画面のように変化します。

今タップした「メッセージ表示：テーブルに…」の行に青枠がつきましたね。それと同時に、今まで「イベント追加」などが表示されていた部分も「前に挿入」などに変化しました。

今回は一番上、つまり青枠の前に挿入したいので、「前に挿入」をタップしてください。

「イベント選択画面」になるので、下のほうにスクロールして「IF分岐（AND）」というイベントを探してタップしてください。

「IF分岐（AND）」をタップすると「条件指定画面」が表示されます。

ここではタイプという欄で「フラグ」か「アイテム」かを選びますが、今回は「鍵をゲットする」という「フラグ」で分岐させるため「フラグ」を選択しましょう。

すると次のようなになります。

「選択」をタップすると次のように「フラグ選択」画面になります。今回は「鍵をゲットする」フラグしかないので、これをタップで選択しましょう。

フラグを選択すると次のようにまた条件指定画面が表示されます。

ここでは「条件」を選ぶ欄が新たに表示されています。

さきにお話しした通り、「フラグ」には「ON」と「OFF」の２つの状態があります。

「ON」を選択して右下の「Ok」をタップしてください。

次のようにイベントが並びます。

「IF分岐（AND）:鍵をゲットするがONなら」という行が一番上に挿入されましたね。

このように、IF分岐イベントを入力すると、「IF:〇〇が〇〇なら」というように表示されます。

さて、今は「もしもフラグがONなら」ということしか入力できていません。

フラグがONなら「何をするか」という部分を入力していきましょう。

今挿入した行「 IF分岐（AND）:鍵をゲット …」を１回だけタップして下の画面のように青枠を表示させてください。

青枠が表示されたならIF分岐で「何をするか」を入力するために

必ず「中に追加」をタップしてください！！

初心者は必ずと言っていいほど、また、慣れた人でも時々間違えるほど、この「中に追加」というところをタップし間違えないかどうかという点はIF分岐において重要です！

正しく「中に追加」をタップしていつもの「イベント選択画面」を開きましょう。

今回はチュートリアルなので、分かりやすいようにまたメッセージを表示させることとします。

フラグがONのときに「もう何もない」というメッセージを表示させたいので、イベント選択画面から「メッセージ表示」イベントを選択し「もう何もない」と入力してください。

次のように表示されれば正しく入力できています。

「メッセージ表示：もう何もない」の行が２行目に追加されたと思いますが、

ここで必ず確認して欲しいことがあります！！

上の画面のように、ちゃんと1文字分の空白があいていますか？

もしあいていなければ、正しく「中に追加」できていないのでもう一度入力方法を確認しましょう！

正しく「中に追加」出来たのであれば、ここでいったんイベント全体を見てみましょう。今は下の画面のようになっていますね。

※グループという表現は脱出ゲームメーカー公式用語ではありませんが、チュートリアル用にこのブログで使用していきます。

この7行のイベントをわかりやすくグループとして考えると下の画面のような構成になっています。

ピンク枠で囲んだ２行分はIF分岐のグループです。このグループは「鍵をゲットする」フラグが「ON」に切り替わっているときにだけ実行されます。

それ以外の青で印をつけた５行分のイベントは「いつでも」つまり「ON」でも「OFF」でも関係なく実行されます。

１回目のタップでは青枠の５行が実行されることにより、プレイヤーは鍵を手に入れて、なおかつ、「フラグ」は「ON」に切り替えられます。

実はこの場合、ピンク枠と青枠の両方が実行されてしまいます。

さきほどの説明の通り、青枠は「いつでも」、つまり「ON」でも「OFF」でも実行される部分になっています。

上から順にピンク枠が実行された後、イベントは停止せずに、そのまま青枠のイベントも上から順に実行されていきます。

「処理終了」という聞きなれないイベントについて入力しながら解説していきます。

下の画像のように、タップイベント編集画面で「メッセージ表示：もう何もない」の行を1回だけタップして青枠を表示させてください。その状態で今度は「後に挿入」をタップしましょう。

次に開いた「イベント選択」画面を一番下までスクロールしてください。そうすると一番下に「処理終了」というイベントがあるのでそれをタップしましょう。

すると次のような画面になります。

上から数えて３行目に「処理終了：」という行が入りました。この時、「処理終了」の前も１文字分の空白があいていることをしっかり確認してください。

通常、「IF分岐」を使用するときは「処理終了」も必ず１つは使用することになるので忘れないように注意しましょう。

これで「鍵のイベント」はすべて入力できました！初めてのIF分岐で少し難しく感じたかもしれません。

どこが分岐点か、ONとOFFどちらから入力したらよいのか、という点は何度が作っていくうちに少しずつスムーズに組み立てられるようになります。

今設定したIF分岐について、２回目以降タップ（何もないテーブルをタップ）した時のプレビューを見てみましょう。

何もないテーブルをタップした時には「もう何もない」と表示されて、それ以上のイベントは起こりません。

違和感のない仕上がりになっています。

ドアのイベント

鍵のイベントを作り終えた状態の「部屋のシーン」は下の画面のようになっています。

鍵の画像のところに、暗い箱のようなものがかぶっていますね。

これはさきほど作った「鍵のイベント」です。暗い箱の大きさはプレイヤーがタップした時に反応する範囲を示しています。

さて、ドアのイベントを追加するために、「イベント：追加編集」の状態でドアノブのあたりをタップしてください。

また新しい「タップイベント編集画面」が開きました。当然ながらまだなにも入力されていませんね。

ここに「ドアをタップした時に起きるイベント」を入力していきましょう！

この２つの分かれ道をまたフラグとIF分岐を使って入力していきますが、今回は「もしも鍵を使っていたならば」の部分、つまりIF分岐の部分から入力してみましょう。

左上の「イベント追加」をタップして「イベント選択画面」が開いたら、下にスクロールして「IF分岐（AND）」を選んでください。

次のような画面が表示されます。

鍵のイベント時は、ここで「フラグ」を選択していましたが、今回は「鍵を使っているときだけ」つまり「’最後の鍵’という”アイテム”を使っているときだけ」というアイテムに関連した分岐点なので、ここでは「アイテム」を選んでください。

上画面の赤枠「選択」をタップすると分岐に使う「アイテム選択画面」が開きます。今回はアイテムは「最後の鍵」しかないのでそれを選んでください。

次のような画面になります。

条件という欄には３種類の項目があります。今回は「最後の鍵」を「使っている」時にしたいので、「使っている」を選択して「Ok」をタップしてください。

上の画面のように「IF分岐（AND）:最後の鍵を使っていたら」という行が入力できたはずです。

今は「もしも鍵を使っていたら」という部分が入力できただけで「何をするか」という部分はまだ入力できていません。

IF分岐の行を1回だけタップして青枠を表示させ「中に追加」をタップしましょう。

「イベント選択」が開きますので、「何をするか」の部分を選択していきます。

今回のチュートリアルではわかりやすくするために、まずは「鍵が開いた」というメッセージを表示させましょう。

「メッセージ表示」を選択し「鍵が開いた」というメッセージを入力して「Ok」をタップすると次のようになっているはずです。

２行目に「メッセージ表示」の行が追加されました。このとき必ず、１文字あいているか確認してください。

さて、「鍵が開いた」と表示させた後にゲームはクリアとなります。

今回は「鍵が開いた」というメッセージが表示された後に、プレイヤーを強制的に「移動」させて「終了シーン」に到達させましょう。

「メッセージ表示:鍵が開いた」という行をタップして青枠を表示させ「後に追加」をタップしてください。そして「イベント選択画面」から「移動」を選んでください。

「移動」を選択すると次のような「シーン選択画面」になるため、移動先のシーンである「クリアのシーン」を選択してください。

クリアのシーンを選択すると次のように表示されます。

３行目に「移動:クリアのシーン」という行が追加されました。ここでも必ず１文字分あいているか確認してください。

これで、「鍵を使っている」時にドアをタップすると「鍵が開いた」とメッセージが表示されて「終了シーン」に移動（ゲーム終了）となるように入力出来ました。

いよいよ次の工程でイベント入力は最後です！

鍵を使っていない時にドアをタップした場合は「鍵がかかっている」というメッセージを表示させましょう。

左上の「イベント追加」をタップして「イベント選択画面」から「メッセージ表示」を選びましょう。そして「鍵がかかっている」と入力してください。

次のような画面になったでしょうか。

４行目に「メッセージ表示:鍵がかかっている」という行ができましたが、この行は１文字あいていないことを確認してください。なぜなら、４行目だけはIF分岐のグループではないからです。

「移動」イベントだけは少し特殊です。他のシーンにいったん「移動」してしまうと、元のシーンに入力してあったイベントは全て実行されなくなってしまいます。

これにてイベント入力は全て終了です！！大変お疲れさまでした！

これ以降はゲーム公開に向けて仕上げの作業です。さくっと行ってみましょう！

イベント範囲を大きくしよう

さて、鍵とドアのイベントを作った部屋のシーンはこんな感じになっているはずです。

鍵とドアの部分にタップ範囲を表す暗い箱が付いていますね。

「ドアのイベント」の「タップ範囲」が少し小さ過ぎるのでドア全体まで大きくしてみましょう。

画面の下側にある「タップイベント」を何度かタップして「イベント：拡大縮小」の状態にし、タップ範囲の角の部分を指でおさえながら大きさを調整しましょう。この操作は画像の大きさを調整したときとほぼ同じです。

だいたい次のような大きさになればちょうどよいでしょう。

私個人の経験則だと、作者の気持ちよりもやや大きめがちょうどよいようです。

なぜならば、スマホの画面はとても小さく、指で狭い範囲を正確にタップするのが少し難しいからです。

テストプレイをしよう

ついに「テストプレイ」までこぎつけました！

「テストプレイ」とはプレイヤーに公開する前に作者だけがゲームを実際にプレイして確認できる作業です。

さらに言うと、「テストプレイ」で正常にゲームクリア出来なければ他のプレイヤーに公開することができません。

メニュー画面を開き赤枠「テストプレイ」をタップしましょう。

７５％…９０％…と読み込みのパーセントが少し表示された後ゲームがスタートします。

さて、想像通りにゲームは正しく動くでしょうか？

ちゃんと手に入れた鍵を使って「クリアのシーン」にたどりつけたでしょうか？

ゲームクリア画面になったら画面一番右下「メニュー」をタップして「ゲームを終了」をすればまたメニュー画面に戻れます。

なにかがうまくいかないときは必ずなにかの入力がまちがっているはずなので、もう一度各々のイベントを１行ずつチェックしてみましょう。

タイトルと説明書きをいれよう

テストプレイが無事終わったら公開前にタイトルや説明書きを入れましょう！

プレイヤーはゲームをプレイするまでそればどんなゲームなのか全くわかりません。

短い作品なのか？ホラーなのか？ストーリーものなのか？

作品をアピールする説明書きを入力してしてたくさんの人にプレイしてもらいましょう！

ちなみに、このチュートリアルで作った作品を公開する場合は「チュートリアルを見ながら作りました」「初作品」「練習作品」などの説明があればプレイヤーに理解してもらいやすいでしょう。

公開しよう

いよいよ公開です！まれに長編の作品だと容量が大きすぎてアップロードが止まってしまうことがあるようですが、このチュートリアル作品程度の容量であれば問題なく行えるはずです。

電話状況の良いところで行いましょう。

メニュー画面で「アップロード・更新」というところをタップすると次のような表示が出ます。

このまま「Ok」をタップすると公開です。

ちなみに、「限定公開」にチェックを入れてしまうと脱出ゲームメーカーの新着に表示されなくなってしまいます。自分だけ、知り合いにだけ遊んでほしい場合には「限定公開」が便利です。

また、作者以外のプレイヤーにネタバレコメントを書いてほしくない場合は「ヒントコメントを許可」のチェックを外しておきましょう。

テストプレイの時と同じようにアップロード状況のパーセントが表示されます。

脱出ゲームメーカーのトップページ新着に表示されればアップロードが正常に終わりました。

まとめ

慣れないうちはこのチュートリアル作品を改造していく形で作っていくと完成させられやすいかもしれません。

脱出ゲームメーカーにはほかにもいろいろな機能がありますので、どんどん触りながら実験してみましょう！

今後、他の記事では脱出ゲームメーカーの活用方法やゲームアイディアのヒントとなる記事を作成していきますので購読していただければ幸いです！

ブログ更新情報はTwitterユーザー名「ふらぐらむOFF」でつぶやいていきます！