studioigor/ref2game

これは何？

主な機能

• 01エンジンが動きやエフェクトを処理し、参考画像のスタイルに合わせたアートをパーツごとに生成します。
• 022本のボーンを持つ手足のパーツと、関節単位の計測を使ってキャラクターを構築します。
• 03足の滑りや歩幅など、動きを自動でチェックします。
• 04変更のたびにブラウザのページを再読み込みしつつ、プレイ状態を維持します。
• 05テクスチャ、マニフェスト、ソースを含む静的なプレイ可能ビルドを出力します。

ユースケース

• ゲームのコンセプト画像を、プレゼンやプレイテスト向けのクリック可能なプロトタイプにする。
• 1枚の画像をもとに、プラットフォーマーや見下ろし型シューティングなどの2Dゲームジャンルを試す。
• リグを手作業で作らずに、コンセプトアートからアニメーション付きスプライトを試作する。
• エージェントとのセッションから、小規模なブラウザゲームのビルドを出力する。

クイックスタート

1. 1

   インストール用プロンプトをエージェント（Claude Code または Codex）に送信します

2. 2

   Claude Code では claude/ フォルダーを、Codex では codex/ フォルダーを使用します

3. 3

   Claude Code では /ref2game を、Codex では $ref2game を、参考画像を添付して送信します

使う前に知っておきたいこと

• !Claude Code または Codex が必要です。macOS または Linux でのみ動作します。
• !Python 3.9 以降と Node.js 18 以降が必要です。初回実行時に Playwright と Chromium がインストールされます。
• !動画を参考素材として使用する場合や動画をレンダリングする場合は、ffmpeg が必要です。
• !Claude Code 版での画像生成には、選択した画像 API またはツールが必要で、その利用料金はユーザー負担です。

収録されている特集

トピック

よくある質問

ref2game とは？

Claude CodeとCodex向けのエージェントスキル。1枚の参考画像から、ブラウザで遊べる2Dゲームのプロトタイプを作成します。 ref2gameは、スクリーンショットやキービジュアル、コンセプト画像をもとに、ブラウザで遊べる2Dゲームのプロトタイプを作成します。AI画像生成で参考画像のスタイルに合わせたアートをパーツごとに描き、動き、ライティング、パーティクル、カメラ、HUDは小規模なWebGL2エンジンのコードで実装します。エージェントの作業に合わせてページがリアルタイムに更新されます。

ref2game は無料で使えますか？ライセンスは？

ref2game は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

ref2game は今もメンテナンスされていますか？

活発にメンテナンス中。ref2game の最終コミットは 2026年10月15日 です。

ref2game は何に使えますか？

ゲームのコンセプト画像を、プレゼンやプレイテスト向けのクリック可能なプロトタイプにする。 1枚の画像をもとに、プラットフォーマーや見下ろし型シューティングなどの2Dゲームジャンルを試す。 リグを手作業で作らずに、コンセプトアートからアニメーション付きスプライトを試作する。 エージェントとのセッションから、小規模なブラウザゲームのビルドを出力する。

ref2game のインストール方法は？

インストール用プロンプトをエージェント（Claude Code または Codex）に送信します Claude Code では claude/ フォルダーを、Codex では codex/ フォルダーを使用します Claude Code では /ref2game を、Codex では $ref2game を、参考画像を添付して送信します

ref2game はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/studioigor/ref2game