Webゲーム
HTMLファイル1つで完結する小さなゲームをモデルに書いてもらいます。完成したものはその場で遊べて、あとから改造もできます。この画面の下にあるビジュアルノベルも、同じ流れで作れます。
1. 種類とお題
ゲームの種類は3つです。それぞれ、モデルに要求する操作と仕組みが決まっています。
| 横スクロールアクション | 走る、跳ぶ、障害物を越えるゲーム。左右移動、ジャンプ、重力、得点またはゴールを求めます。 |
|---|---|
| タップ回避 | タップで浮かび、障害物の間を抜けるゲーム。押すたびに上昇する動きと、通過得点を求めます。 |
| スクロールシューティング | 敵を避けて撃ち、得点を伸ばすゲーム。移動、発射、複数の敵、当たり判定を求めます。 |
お題は種類ごとに用意された6件のプリセットから選びます。自由記述はありません。文章が変わると条件が変わってしまい、モデル同士を同じ土俵で比べられなくなるためです。「おまかせ」を選ぶと、世界観と主人公はモデルが考えます。
2. ライブラリ「なし」と「あり」
ここがこの画面の比較軸です。同じお題を、下の2つの条件で作って見比べられます。
| なし | ゲームループ、キー入力、音、HUDまで全部モデルが書きます。素の実力が出ます。 |
|---|---|
| あり | 共通エンジンMFXGameを渡します。ループ・入力・音・HUD・ステージ・ボスはエンジンが受け持ち、モデルはゲームの中身だけを書きます。 |
「あり」のエンジンは配布されるHTMLにも同梱されるので、書き出したファイルは単体で動きます。「なし」と「あり」は別の条件として扱われ、作品管理では別のグループになります。土台が違うものを同じ列に並べないためです。
3. モデルとやり直し
モデルを1つ選びます。追加やり直しは0〜3回で、既定は2回です。初回と合わせて最大3回試します。イラストやアイコンより既定が多いのは、ゲームは1回で完成しないことが多いためです。
コンテキスト長も選べます(既定32,768)。生成ボタンの下にある「コンテキスト長」から変更してください。長いコードになるほど大きな値が要りますが、そのぶん時間とメモリを使います。ゲームは4種類のなかで一番長いHTMLを書くので、やり直しのときに前回のHTMLを送り返すぶんまで含めて余裕が要ります。
選んだモデルと回数はゲーム画面の分としてブラウザーに残ります。
作られたゲームが表示されるまで
-
モデルがHTMLを1つ書く
<!doctype html>から始まる完全な1ファイルを書いてもらいます。画像も音も外部から読み込みません。 -
保存前に中身を検査する
外部からの読み込み、通信、動的なコード実行が入っていないか、容量とJavaScriptの文法に問題がないかを調べます。ここで失敗すると、検出した理由と前回のHTMLを同じモデルへ渡して書き直してもらいます。
-
隔離した枠の中で動かす
検査を通ったHTMLだけを、権限を絞った枠(
iframe sandbox="allow-scripts")で開きます。読み込んだ直後にエラーで落ちた場合や、時間内に始まらず固まった場合は、その内容をモデルへ伝えて自動で作り直します。
作ったあとの改造
完成して動作確認まで通った版には、改造ボタンが3つ出ます。
- BGMをつける:音を鳴らします。音声ファイルは使わず、その場で合成した音だけを使います。
- ボスを作る:手ごわい相手を追加します。
- ステージを増やす:面を足します。
改造は1つずつ積み上がります。BGMを足した版にボスを足す、という重ね方ができます。作った版は上部のタブで切り替えられるので、改造前と後を見比べられます。改造で壊れたら、前の版のタブへ戻ればそのまま遊べます。
改造した版は、モデル同士の比較グループには入りません。比べているのは元のゲームを作る力なので、そこへ改造後の版を混ぜないためです。
オートプレイ(自動で遊ばせる)
完成して動作確認まで通った版には「オートプレイを作る」が出ます。そのゲームを書いたのと同じモデルに、自分のゲームを自動で遊ぶ攻略スクリプトを書かせる機能です。「自分の書いたコードを理解して遊べるか」という第2のものさしになります。
- 攻略スクリプトは合成キー操作でゲームを動かし、ゲームオーバーになると自動でやり直して、止まらずに遊び続けます。
- 「オートプレイを見る」で、その自動プレイ版をこの画面で再生できます。手動プレイへはボタンで戻せます。
- 攻略が下手ですぐ死ぬ、進めない、というのは失敗ではありません。下手さもモデルの実力です。作成が失敗になるのは、スクリプトが実行時エラーを出したときだけです。
- オートプレイで出たエラーは、そのゲーム本体の動作確認結果(動作確認済み)を書き換えません。オートプレイ側だけの失敗として扱います。
- 書き出しHTMLにはオートプレイは入りません。配布物は素のゲームのままです。
作品管理の比較詳細では、オートプレイを2件以上作ると「オートプレイで比較」が使えます。選んだ分を同じ大きさで一斉に再生し、モデルごとの遊び方を横に並べて見比べられます。録画機能はありません。並べた画面はOS標準の画面録画(Windowsは Win+G、macOSは Shift+Command+5)で撮ってください。5枠以上を同時に動かすときは、端末の性能に注意してください。
動かないときの救済
| 実行時エラーで落ちる | プレビューがエラーを検知すると、その内容を自動でモデルへ渡して作り直します。操作は要りません。 |
|---|---|
| やり直しを使い切った | 「やり直しを+N回追加して続ける」が出ます。直前の試行のHTMLと失敗した理由を引き継いで、続きから作り直します。最初からやり直しにはなりません。 |
| エラーは出ないが遊べない | 「うまく遊べない → 作り直す」から理由を選びます。操作が効かない/ジャンプできない/すぐ終わる/動かない/その他の5つで、選んだ理由をモデルへ伝えて直してもらいます。 |
| コンソールエラーの表示 | ゲームが出したエラーの件数と内容を赤で表示します。これは自動では直しません。「動いてはいるが壊れている」ことに気づくための目印です。 |
検査が見ているのは「エラーで落ちる・固まる・規格違反」までです。文法も動作も問題ないのに、地面に足が着かずジャンプできない、といった作りの不具合はすり抜けます。だから最後は人が遊んで判断する形にしてあります。
安全のしくみと書き出し
- ゲームはHTML 1ファイルで完結します。外部のスクリプト、画像、音声、フォントは読み込みません。画像を使う場合もファイル内に埋め込みます。
- 通信(
fetchやWebSocket)、コードの動的生成、保存領域やCookieへの読み書き、親画面の参照はすべて拒否します。 - 再生と書き出しのHTMLには、外部へつながらないための制限を書き込んであります。動かすときの権限もスクリプト実行だけに絞っています。
- 上部の「HTML」から書き出せます。1ファイルなので、ブラウザーへドラッグするだけで動きます。共通エンジンを使った場合も、エンジンごと同梱されます。
ビジュアルノベル
Webゲームのすぐ下にある、もう1つの作成導線です(サイドメニューの「Webゲーム → ビジュアルノベル」)。同じ2カラムの画面で、ジャンル・表現・モデルを選んで作ります。
- お題:同じ条件で比べられるよう、ジャンルから選びます。
- 表現:全年齢か、成人向けの表現を文章で許可するか。成人向けは文章にだけかかります。人物のシルエットと背景は全年齢と同じもので、絵は変わりません。未成年を性的に扱う内容は、選択に関わらず拒否されます。
- モデルとやり直し:使うモデルを1つと、追加のやり直し回数。
遊べない構造は保存しません。登場人物にいない話者がしゃべる、最初の場面からたどり着けない場面がある、といったものは検査で落とし、理由を伝えて書き直してもらいます。実例は作例集にあります。
できたノベルは他の作品と同じように保存され、同じ条件で比べるの対象になります。作品ギャラリーへ載せると、書き出したサイトの上でもそのまま読めます。
うまくいかないとき
- 3回とも完成しない:ゲームはモデルの負荷が高い作業です。コンテキスト長を上げる、ライブラリ「あり」にして書く量を減らす、モデルを変える、の順で試します。
- 途中で止めた:「処理を停止」で止めた場合も、「同じゲームの作成を続ける」で残りの回数から再開できます。
- どのモデルが向いているか知りたい:同じ種類・同じお題・同じライブラリ設定で別のモデルを走らせると、作品管理で自動的に並びます。かかった時間は実行履歴で確認できます。