mcpField
G
godogen

godogen

github.com/htdt開発7.2k115 回インストール2 週間前に更新
リポジトリ

godogen について

godogenは、自然言語の依頼からBabylon.jsのブラウザーゲームを生成・更新するスキルです。計画、実装、ブラウザーでのビジュアル検証を段階的に進めます。

主な機能

  1. 01自然言語によるゲームの生成・更新
  2. 02段階的な作業計画と実行
  3. 03ゲームアセットの計画と生成
  4. 04Viteのホットリロードによる反復
  5. 05ブラウザーの画像・動画による検証

活用シーン

  1. 01説明からBabylon.jsゲームを構築
  2. 02既存のPLAN.mdに記録された作業の再開
  3. 03ゲームアセットの計画と生成
  4. 04ブラウザー上のゲーム画面の確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/htdt/godogen --skill godogen

インストール後、Claude Code で/godogenを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

architecture.md
capture.md
decomposer.md
quirks.md
scaffold.md
scene-generation.md
task-execution.md

詳細

Babylon ゲームジェネレーター

自然言語から Babylon.js のブラウザーゲームを生成、更新します。

機能

各ステージに到達したときにのみ、${GODOGEN_SKILL_DIR}/ からそのステージのファイルを読み込みます。

ファイル目的読み込むタイミング
visual-target.md参照画像を生成パイプライン開始時
decomposer.mdタスク計画に分解ビジュアルターゲットの後
scaffold.mdVite/Babylon プロジェクトの骨組み分解の後
architecture.mdBabylon のゲームプレイアーキテクチャ方針ゲームコードの設計前
asset-planner.mdアセットの予算策定と計画予算が提示された場合
asset-gen.mdアセット生成 CLI のリファレンスアセットを生成する場合
rembg.md背景の除去アセットから背景を除去する必要がある場合のみ
task-execution.mdタスクのワークフローとコマンド最初のタスクの前
quirks.mdBabylon/ブラウザー特有の注意点コードを書く前
scene-generation.mdシーン/ワールドの実装パターンプレイ可能なシーンを作成または置き換える場合
capture.mdブラウザーのスクリーンショット/動画キャプチャスクリーンショットまたは動画の前
(babylon-help skill)Babylon/Vite/ブラウザー API の検索Babylon 固有の質問がある場合

パイプライン

User request
    |
    +- Check if PLAN.md exists (resume check)
    |   +- If yes: read PLAN.md, STRUCTURE.md, MEMORY.md, ASSETS.md if present -> skip to task execution
    |   +- If no: continue with fresh pipeline below
    |
    +- Generate visual target -> reference.png + ASSETS.md (art direction only)
    +- Analyze risks + define verification criteria -> PLAN.md
    +- Scaffold/refresh Vite project -> package.json + src/ + STRUCTURE.md
    |
    +- If budget provided (and no asset tables in ASSETS.md):
    |   +- Plan and generate assets -> ASSETS.md + updated PLAN.md with asset assignments
    |
    +- Start/keep Vite dev server running at http://127.0.0.1:5173
    +- Execute risk slices first, then main build
    +- Use browser screenshots frequently while iterating
    +- If final presentation media is required:
        +- Record browser video to screenshots/result/{N}/video.mp4

アセット

予算が提示された場合、適切なアセットの生成もタスクの一部です。プロシージャルな代替物を使う前に、asset-planner.md/asset-gen.md を使用してください。

実行時に読み込むアセットは、TypeScript からインポートする場合は src/assets/** に、安定した直接 URL が必要な場合に限り public/** に配置してください。参照画像、プロンプト、ソースのサイドカー、デバッグ用キャプチャは、実行時アセットのパス外に保管してください。

実行

開始前に task-execution.md を読んでください。可能な限り npm run dev を起動したままにしてください。通常の開発ループでは Vite のホットリロードを使用します。

  1. src/game/** または src/assets/** を編集します。
  2. すでに開いているブラウザーでシーンが再読み込みされるのを待ちます。
  3. ブラウザーをキャプチャまたは確認します。
  4. 大規模な編集の前に npm run check を実行し、最終メディアの前に npm run build を実行します。

Chrome/Chromium と WebGL2 が必要です。どちらかがない場合は、回避策を講じずに作業を停止し、不足している依存関係を報告してください。ハードウェア GPU アクセラレーションの使用を推奨します。WebGL2 がソフトウェアレンダラー(SwiftShader、llvmpipe、lavapipe など)にフォールバックした場合でも、キャプチャスクリプトは目立つ警告をログに出しつつ、キャプチャを完了します。GPU を搭載したホストでは、この警告を修正すべき設定ミスとして扱ってください。GPU のないホストでは、この警告は参考情報であり、品質を下げた状態でも実行によってタスクを検証できます。

Babylon ヘルプ

Babylon API に関する質問、例、ローダーの動作、Vite との統合、ブラウザーキャプチャの問題、正確なインポートパスについては、babylon-help を使用してください。現在のプロジェクトバージョンに対応する、インストール済み npm パッケージのソース/型定義を優先し、その後に公式ドキュメントを参照してください。

コンテキストの整理

重要な状態はファイルに記録してください。

  • PLAN.md — タスクのステータスと検証基準
  • STRUCTURE.md — アーキテクチャの参照情報
  • MEMORY.md — 発見事項、注意点、回避策、うまくいったことや失敗したこと
  • ASSETS.md — パスと生成の詳細を含むアセットマニフェスト

各タスクの完了後、関連する状態ファイルを更新してください。リポジトリのポリシーで定められている場合やユーザーから求められた場合は、タスクの区切りを検証した後にコミットしてください。

ビジュアル検証

コードだけを信頼しないでください。スクリーンショットまたは録画した動画を使って、ブラウザー上で表示を検証してください。コードとメディアの内容が食い違う場合は、メディアを正としてください。ブラウザーキャプチャで要件を確認できない場合は、未完了として扱ってください。

コメント