img2threejs: コードのみのジオメトリを使用して参照画像からオブジェクトを再構築する手続き型 Three.js モデルジェネレータ

解決する課題

img2threejs は、オブジェクト、キャラクター、またはクリーチャーの単一の参照画像を手続き型 Three.js モデルに変換します。フォトグラメトリやメッシュ抽出とは異なり、プリミティブとシェーダーを使用してコードのみのモデルを生成し、結果が軽量でアニメーション対応であり、外部のメッシュファイルやアートパックを必要とせずにブラウザ上で直接実行できるようにします。

仕組み

このプロジェクトは、画像を技術仕様に変換し、ブロックアウト、構造、形状、マテリアル、サーフェス、ライティング、インタラクション、最適化といった複数のパスを通じてモデルを反復的に構築する段階的なスカルプトパイプラインを使用します。

エージェントに依存しないよう設計されており、Claude Code、Codex、OpenCode などの AI コーディングエージェント内で実行できます。パイプラインは検証と品質ゲートのために決定論的な Python スクリプトを使用し、AI エージェントは視覚的判断とコード生成を担当します。キャラクターに対しては、パラメトリックテンプレートとランドマークフィッティングを用いた解剖学に配慮したトラックを採用し、類似性を最大化します。

対象ユーザー

画像からブラウザベースの 3D アセットを迅速に生成する必要がある開発者や 3D アーティスト向けです。特に、静的メッシュではなく手続き型でコード駆動のジオメトリを求める方に適しています。

ハイライト

  • コードのみの再構築: プリミティブと手続き型シェーダーからモデルを作成する TypeScript ファクトリを生成します。
  • アニメーション対応: ピボット、ソケット、コライダーを備えたランタイム階層を生成し、すぐにアニメーション可能にします。
  • ディテール優先の分析: 生成開始前に、ベベル、リベット、摩耗などの識別的ディテールの完全なインベントリを要求する厳格な品質ゲートを使用します。
  • 対象別パイプライン: ハードサーフェスオブジェクト、ヒューマノイドキャラクター、クリーチャー(四足歩行、鳥類など)用の専用トラックを含みます。
  • 詳細なレビューゲート: 正確性を確保するため、CS2 固有の武器契約や CIEDE2000 カラーマスなど、厳格なチェックを実装しています。

Sources