本日は, ゲームボーイのようなゲームを, つくったお話をしたいと思います (o'(ェ)')_🍵
OpenAI と ModRetro が, 携帯ゲーム機 「Chromatic」 向けのゲームづくりで, 協業しています。そして, Codex でつくった, ゲームボーイのようなゲームを 13 本, 公開しています 🎮
これを見て, ぼくも, 試しに1 本つくってみようと思いました ✨
そこで, Codex と ModRetro Chromatic のプラグインを使って, オリジナルのゲーム Gem Quest を, つくってみました 💎

ちなみに, Chromatic の実機は, 持っていません・・・それでも, ブラウザで遊べる形で, 公開まで, できました ✨
以下は, その完成した Gem Quest の見ためです ✨

ブラウザで, そのまま遊べますので, もし, ご興味ありましたら, 覗いてみてください (ブラウザによっては, 多少, UI が崩れます・・・) 💧
操作は, Z キーが 「 A ボタン:決定」 です。矢印キーで, 移動できます。3つの宝石をゲットして, トビラに向かうと, クリアです (詳細は以下に, 書いて在ります) ✨
【 ゲーム 】https://tokoinx.github.io/gem-quest/
【 GitHub 】https://github.com/tokoinx/gem-quest
1. Gem Quest とは 💎✨
3 つの宝石をすべて集めて, 扉からクリアを目指す, ゲームボーイのような小さな冒険ゲームです ✨
| 項目 | 内容 |
|---|---|
| 対象 | ゲームボーイ/ゲームボーイカラー互換 |
| 目的 | 3 つの宝石をすべて集める |
| 進行 | 宝石を集める → 扉が開く → 扉へ進む → クリア画面 |
| グラフィック | 宝石と扉は, オリジナルのドット絵 |
| 画面の大きさ | 160 × 144 ピクセル |
| テスト | PyBoy (エミュレーター) と, ブラウザで確認 |
| 実機テスト | まだ (実機を持っていないため) |
2. 遊び方 🎮
| ボタン | キーボード |
|---|---|
| 移動 (上下左右) | 矢印キー, または W / A / S / D |
| A ボタン (決定・調べる・メッセージ送り) | Z キー (J キー, Alt キーでも可) |
| B ボタン | X キー (K キー, Control キーでも可) |
| START | Enter キー |
| SELECT | Shift キー |
遊び方の流れは, こんな感じです。
① ゲーム画面を, 1 回クリックする
② 最初のメッセージを, Z キーで閉じる
③ 宝石の近くで Z キーを押して, 集める
④ 3 つ集めたら, 扉へ向かって, クリア 💎
ちなみに, スマートフォンやタブレットで開くと, 画面にタッチ操作のボタンが付きます (GB Studio の Web 版の機能です) ✨
3. つくり方の流れ ✨
今回の流れは, こんな感じです。
① どんなゲームにするかを, 言葉で決める
② Codex と ModRetro Chromatic のプラグインで, GB Studio のプロジェクトをつくる
③ GB Studio CLI と GBDK で, ROM (ゲーム本体のファイル) をビルドする
④ PyBoy で, 自動のプレイテストをする
⑤ ブラウザ用の Web 版を書き出す
⑥ GitHub に置いて, GitHub Pages で公開する
使ったツールは, 次のとおりです 🔎
| ツール | 役割 | バージョン |
|---|---|---|
| Codex | 言葉の指示から, コードの編集やコマンドの実行をするコーディングエージェント | - |
| GB Studio CLI | GB Studio のビルドを, コマンドで行う | 4.3.2 |
| GBDK | ゲームボーイ向けのコンパイルに使うツール群 | 4.5.0 |
| PyBoy | Python から使える, ゲームボーイ系のエミュレーター | 2.7.0 |
ちなみに, GB Studio のエディター (画面で編集するアプリ) は, 今回は入れていません。コマンドだけで, ビルドとテストまで, できました ✨
また, テストでは 「宝石 3 つ → 扉 → クリア」 の通しプレイが, 成功しています 💎
4. ROM と Web 版は, 別のもの 🔎
つくってみて分かったのですが, ゲームのファイルには, 2 つの形があります。
| 形 | 中身 | 遊び方 |
|---|---|---|
| ROM | gem-quest.gbc の 1 ファイル |
エミュレーターや, 対応するゲーム機で遊ぶ |
| Web 版 | index.html と, CSS・JavaScript のファイル一式 |
ブラウザで遊ぶ |
GB Studio の公式ドキュメントでは, Web 版は, フォルダごと Web サーバーに置いて, index.html を開くもの, と説明されています。
実は, 最初, パソコンの中の index.html をクリックしても, ゲームが始まりませんでした・・・💧
パソコンの中の保存先は, 公開された Web の URL ではないんですね。公開前は, Codex のプレビューか, 手元の Web サーバーで開きます。公開後は, GitHub Pages の https の URL で開きます ✨
5. GitHub Pages で公開する 🛠️✨
GitHub Pages は, GitHub のリポジトリにあるファイルを, そのまま Web サイトとして公開できる仕組みです。
今回は, 書き出した Web 版のファイル一式を, リポジトリのいちばん上に置きました。そのうえで, 次の手順で公開しています。
① GitHub で, リポジトリ (gem-quest) を開く
② 「Settings」 を押す
③ 左のメニューの 「Pages」 を押す
④ 「Build and deployment」 の 「Source」 を 「Deploy from a branch」 にする
⑤ ブランチを 「main」, フォルダを 「/ (root)」 にする
⑥ 「Save」 を押す
ちなみに, 公開する作業は, Codex にお願いすることもできます。今回, 渡した指示文は, こんな感じです 📚
完成済みのオリジナルゲーム「Gem Quest」を GitHub Pages で一般公開してください。
【公開先】
GitHub アカウント:tokoinx
リポジトリ名:gem-quest
公開 URL:https://tokoinx.github.io/gem-quest/
公開方式:GitHub Pages
リポジトリ:Public
【作業内容】
・既存ゲームの元データを破壊しない。
・Web 版が正しくビルドされているか確認する。
・GitHub の認証状態を確認する。
・リポジトリが存在しなければ作成する。
・build/web/ 内の公開に必要なファイルをすべて公開対象のルートへ配置する。
・README.md を整備する。
・Git にコミットし, GitHub へ push する。
・GitHub Pages を main ブランチの /(root) から公開する。
・公開 URL を開いて動作確認する。
・確認した内容と未検証の内容を区別して報告する。
【検証項目】
・公開ページからブラウザで直接遊べる。
・矢印キーと Z キーで操作できる。
・宝石3個の回収からクリアまで確認する。
・秘密情報や不要なローカルファイルを公開しない。
6. ゲームを更新するとき ✨
ゲームを直したときは, ROM と Web 版をつくり直してテストし, 公開用のファイルを差し替えて, GitHub に送ります。
git status
git add .
git commit -m "Update Gem Quest"
git push origin main
git add . の前に, かならず git status で, 公開してはいけないファイルが混ざっていないかを, 確認します ⚠️❗️ ← ここ重要✨
7. 注意点❗️
① 実機での動作は, まだ確認していません (Chromatic の実機を持っていないため)
② GitHub の公式ドキュメントによると, GitHub Pages のサイトは, インターネットに公開されます。無料プランでは, 公開 (Public) のリポジトリでしか使えません
③ 公開リポジトリの中身は, 誰でも見られます。パスワードなどの秘密の情報や, 公開しなくてよいファイルは, 入れないようにします
④ 画像や音楽などを使うときは, 公開してよいものかを, 確認しておきます
8. まとめ ✨
言葉でゲームを決めて, ビルドして, テストして, Web 版にして, 公開する・・・この流れを, 実機なしで, ひととおり体験できました 💎✨
今後は, タイトル画面や効果音, ステージの追加も, してみたいと思います。
レトロゲームが好きな方は, ぜひ, 気軽に遊んでみてください ✨
【 ゲーム 】https://tokoinx.github.io/gem-quest/
参考にしたページ 📚
- Gem Quest (ゲーム):今回のゲーム。ブラウザーで遊べます
- gem-quest (GitHub):今回のゲームのリポジトリ
- ModRetro (OpenAI):OpenAI と ModRetro の協業と, Codex でつくった 13 本のゲーム
- Codex:OpenAI のコーディングエージェント
- GB Studio:Building Your Game:ROM と Web 版の書き出し
- GitHub Docs:Configuring a publishing source:GitHub Pages の公開の設定
それでは, 今回は, これでおしまいです✨ ありがとうございました (o'(ェ)')_🍙 ✨
また 「前提知識がなくても理解できる」 Python の入門書や, Lua の入門書を執筆しております。amazon の月額 ( Kindle unlimited など) に登録されている場合は, 追加料金なく読めますので, もし, これらに, ご興味ありましたら, 覗いてみてください ✨ 何卒, よろしくお願いいたします 🍵✨
【Amazon】はじめてのプログラミング Python 入門者になるための1歩 for Windows11
【Amazon】はじめてのプログラミング Lua - 教科書 ① for Windows11





