このプロジェクトについて
Mobile Gamingは、モバイルゲーム広告のスタイルからコンセプトを得た、ブラウザベースのパズル、アーケード、シミュレーションゲームのコレクションです。すべてオープンウェブ上で動作し、2DゲームプレイにはPhaser 3、3DレンダリングにはThree.jsが使用されています。ライブビルドはmobile-gaming.pages.devで公開されており、ゲームセレクターハブページが各タイトルを起動するためのロビーとして機能します。
現在、3つの大まかなグループに分かれた13のゲームをカバーしています。
パズルゲーム:
- Brain Teaser — 重さによるアイテムのソート、迷路のナビゲート、論理問題など、10以上の手作りレベルを含むラテラルシンキングパズル。
- Water Sort — チューブ間で色付きの液体を注いで分けるソートゲーム。色とチューブが増えるにつれて難易度が上がります。
- Parking Escape — 赤い車の道を切り開くために車両を脇にずらす、アンブロック形式のパズル。
- Pull the Pin — 物理ベースのピンパズル。障害物を避けながら報酬を集め、ボールをゴールに導きます。
- Save the Character — 判断力と反射神経を試す、選択肢形式の生存シナリオ。
- Bus Jam — 乗客を一致するバスに振り分けるカラーマッチングパズル。ルート計画とバスの満員状態への管理が必要です。
- Merge Games — 一致するタイルをマージして目標ティアに到達させるゲーム。効率的なマージのための計画が必要です。
アーケードゲーム:
- Crowd Runner — 数学ゲートを通じて群衆を増やし、障害物を避けながらボスを倒すオートランナー。
- Bridge Race — ブロックを収集してAI競合相手と競い合う、橋建設メカニクスを備えた3Dオートランナー。
- Giant Runner — 一致するオーブを収集してパワーアップし、ボス戦に挑む3D成長フォーカスランナー。
- Jelly Shift — ジェリーの塊を壁に合わせて変形させるシェイプシフティング3Dランナー。
- Makeover Run — アップグレードステーション、スタイルアイテム、ランウェイフィナーレを備えたファッションテーマの3Dオートランナー。
シミュレーション:
- Satisfying Clean — スワイプして掃除するASMRスタイルのリラクゼーションゲーム。
ローカルで実行するにはNodeとnpmが必要です。ドキュメント化されたコマンドは、依存関係をインストールするnpm ci、開発サーバーを起動するnpm run dev、プロダクションビルドを行うnpm run build、およびそのビルドをプレビューするnpm run previewです。テストは、Vitestユニットテスト用のnpm test、Playwrightエンドツーエンドテスト用のnpm run test:e2e、およびレベル検証用のnpm run test:levelsで実行されます。開発サーバーはhttp://localhost:5173/で待機し、src/games/*/からゲームを自動検出します。
プロジェクト構造では、各ゲームがsrc/games配下の専用ディレクトリに配置され、index.html、game.js、state.js、renderer.js、input.js、styles.css、levels.jsonのファイルが含まれています。src/hubディレクトリにはメインロビーとセレクターがあり、src/sharedにはオーディオ、スコアリング、ライフサイクル処理のための共有ユーティリティが含まれています。個別のlevels/、public/、tests/、docs/ディレクトリには、レベルJSONファイル、マニフェストやサービスワーカー、リダイレクトなどの静的アセット、テストスイート、およびプロジェクトドキュメントが格納されています。
テストに関して、READMEにはゲームロジック、状態管理、スコアリングをカバーする121のユニットテストファイルがあること、およびモバイル版ChromeとSafariに対してPlaywright E2Eテストが実行されることが記載されています。バンドルサイズはJavaScriptで3000KB、CSSで150KBの予算に対して強制され、レベル検証ステップではすべてのゲームに少なくとも3つのレベルがあることが求められます。
デプロイ先はプロダクションURLのCloudflare Pagesであり、CI/CDはiad-ciクラスター上のArgo Workflowsによって駆動されます。ビルドはmainブランチへのプッシュで自動的にトリガーされ、npm ci、npm test、npm run test:levels、npm run buildが順に実行されます。再利用可能なビルドおよびデプロイ定義は、別の公開GitOpsリポジトリであるjedarden/declarative-configに存在します。
採用されているテクノロジーは、2Dパズルゲーム用のPhaser 3、3Dアーケードランナー用のThree.js、ホットモジュールリプレイスメントを備えたビルドツールとしてのVite、ユニットテスト用のVitest、およびクロスブラウザエンドツーエンドテスト用のPlaywrightです。また、本プロジェクトはプログレッシブウェブアプリ(PWA)であり、オフラインキャッシュ用のサービスワーカーとアプリマニフェストを通じてモバイルデバイスにインストールしてオフラインでプレイでき、あらゆる画面サイズに対応したレスポンシブデザインを採用しています。MITライセンスの下でリリースされています。
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.