3D Website Factory は何をしますか？

S はこのファイルが置かれているフォルダです。必要条件: Chrome、Python 3、Node 22+。フィルムにはffmpegも必要です。

パイプライン

           ┌──> 彫刻家 (3Dオブジェクト) ──┐
偵察 ─────┤                            ├──> 建築家 (統合) ──> 批評家 ──┐
(計画)     └──> アニメーター (モーション) ──┘        ^                   │
   ^ ユーザーが計画を承認                      └──── 修正、最大3ラウンド ┘

役割	概要	作成物
偵察	`roles/scout.md`	計画: 事実、ゴールドスタンダードからのデザインシステム、画面、3Dオブジェクト一覧
彫刻家	`roles/sculptor.md`	3Dオブジェクトごとに1つのthree.jsモジュール（またはSplineシーン）
アニメーター	`roles/animator.md`	説明用ループ、スクロール連動、出現アニメーション
建築家	`roles/builder.md`	ウェブサイト、すべての統合、ユーザーのインタラクションの配線
批評家	`roles/critic.md`	10の固定質問に基づく合格/不合格判定と修正指示

各役割はワークスペース内のファイル（_work/<slug>/ 内の計画、sites/<slug>/ 内のコード）を介してのみ対話します。そのため、任意の役割を単独でやり直すことができます（「3Dをより光沢のあるものに」は彫刻家の仕事で、その後建築家と批評家が続きます）。

ロールの実行。 使用しているツールがサブエージェントを起動できる場合（Claude Code、Codex、Cursorなど）、役割ごとに1つのエージェントをこのプロンプトで起動し、彫刻家とアニメーターは同時に実行します:

あなたは3D Website Factoryの<役割>です。<S>/roles/<役割>.md と <S>/references/taste.md を読み、ワークスペース <絶対パス> 内のサイト <slug> に対してあなたの役割を実行してください。スキルフォルダは <S> です。何を作成したか、できなかったことを報告してください。

できない場合は、各役割の概要を開始直前に読みながら、順番に自分で実行してください。いずれにしてもあなたが指揮者です: ユーザーと対話し、各引き継ぎが存在することを確認し、ゲートで停止します。

ユーザーが決定するゲート: 偵察のインタビューとそのサマリー（参考、ルック、ヒーローコンセプト、画面、コスト付きオブジェクト）は、有料作業の前と最後に行います。それ以外はすべてユーザーに問い合わせずに実行します。

進捗。 ビルドには最大1時間かかることがあります。各役割の開始前に、何をしているかを1行でユーザーに伝え（「彫刻家: 粘土のロゴを構築中、無料」）、終了後には何を作成したかを伝えます。

ジョブ

ユーザーの発言	ジョブ
"セットアップ"、初回使用、またはワークスペースが存在しない	A. セットアップ
"これを作って"、"Xのサイトを構築して"	B. ビルド
"私のウェブサイトを3Dにして"、"このサイトに3Dを追加して"	C. 既存サイトのアップグレード
"ロボットをカーソルに追従させて"、"3Dを変更して"、ビルド済みサイトへの変更	D. 変更
"フィルムを追加して"、"動画を追加して"	E. フィルム (`references/film.md`)

A. セットアップ

sh "$S/scripts/init.sh"        # ./website-factory を作成、上書きはしない

ユーザーに平易な言葉で伝えます: 文章は content/ に、ロゴは assets/logo/（SVGが最適、3D化可能）、画像は assets/images/ に、3Dモデルは assets/models/ に、気に入ったサイトは assets/style/ に。その後「これをウェブサイトとして構築してください」と言います。コンテンツができるか、ユーザーがデモを要求するまではビルドしません。

B. ビルド

content/ 内の各ファイルに対して1つのサイトを作成します（_ で始まる名前と、sites/ にフォルダがすでに存在するファイルは、再構築が要求されない限りスキップします）。slug = ファイル名をケバブケースにしたもの。フルパイプラインを実行します。最後に sites/<slug>/REPORT.md を作成し、ユーザーに伝えます: 各3Dオブジェクトとモーションの内容、ユーザーが未決定のままにしたすべての選択、コピーの変更（copy.md）、消費したクレジット、批評家の判定、まだ未決定の事項、プレビュー方法: python3 -m http.server 8080 --directory sites/<slug>。その後、公開を提案します（公開セクション参照）。

C. 既存サイトのアップグレード

ユーザー自身のウェブサイトフォルダ内で実行します。サイトはユーザーのものです: デザインも文章も同じまま。

偵察がコードをスキャンし、計画を作成します。提案: どのオブジェクトをどこに配置するか、何が動くか、どのファイルが変更されるか。 承認を待ちます。
Gitリポジトリの場合は、ブランチを作成します。変更するファイルは最小限にします。スタイルの変更、文言の変更、並べ替え、依存関係のアップグレードは行いません。
彫刻家とアニメーターがパーツを作成します。建築家がサイト本来の方法で追加します:
- プレーンHTML: roles/builder.md の通り。
- React、Next、Vue、Svelte、Astro: マウント後にボックスをレンダリングしてオブジェクトモジュールをインポートするクライアント専用コンポーネント。stage.js とモジュールはフレームワークが使用する静的フォルダまたはソースフォルダに配置します。プロジェクトがすでにthree.jsやreact-three-fiberを使用している場合は、インポートマップの代わりにそれを使用します。
- WordPress: 子テーマまたはカスタムHTMLブロック。親テーマやライブサイトでは絶対に使用しません。
ゲート: サイト自身のビルドとテストがまだ通ること。開発サーバーを実行した状態で、変更前に node "$S/scripts/probe.mjs" <url> _work/before、変更後に _work/after を実行します（_work/ はGitの管理対象外にします）。批評家が比較します。check.py はジョブBのページのみ使用します。
差分とプレビュー方法を表示します。ユーザーが要求しない限り、プッシュやデプロイは絶対に行いません（公開セクション参照）。

D. 変更

変更を所有する役割を見つけ、その役割の部分のみをやり直し、その後建築家のゲートと批評家を実行します。

Splineシーン

Splineシーンは複数の3Dソースのうちの1つです（roles/sculptor.md 参照）。

コミュニティシーン（無料、アカウント不要）: sh "$S/scripts/browser.sh" embed <コミュニティURL> で埋め込み可能なURLを出力します。Splineのエディタ全体を読み込むため、初回訪問時に約15秒と暗い画面が表示されます。デモには適しています。実際のサイトでは、ユーザーが無料のSplineアカウントで開き、リミックスして、エクスポート > 公開URL を選択し、my.spline.design/... リンクを提供します。このリンクは1〜2秒で読み込まれます。
ページ上: <div class="f-3d" data-spline="URL" data-title="説明" style="height:100vh"></div>。factory.js が遅延読み込み、フェードインして、ビューアのボタンを隠すためにオーバーサイズで表示します。
シーンの作者のクレジットは、シーンのライセンスが要求する場合のみフッターに追加します。
カーソルがシーン上にあるときもページがスクロールできること（probe.mjs がテストします）。できない場合は data-shield を追加します。
Splineコネクタ（claude mcp add --transport http spline https://mcp.spline.design/mcp）は新しいシーンを構築できます。1日の呼び出し制限があります: ユーザーが要求した場合のみ使用し、使用した呼び出し回数を伝えます。

アセットと費用

3D、画像、フィルムの入手先、使用するプロバイダー（HiggsfieldコネクタまたはCLI、他の接続済みジェネレーター、または無料の手動ルート）、および有料生成のルール: references/assets.md。

公開

ユーザーが要求した場合のみ行います。接続済みのものを使用します: ホスティングコネクタ（Hostinger、Netlify、Vercelなどはデプロイツールを公開）、またはGitHub Pages用のGitHub CLI、もしくはユーザーにアップロードするフォルダを伝えます。最初のデプロイ前にターゲット（ドメインまたはリポジトリ）を確認します。その後は、要求された場合のみ変更を再デプロイします。

常に保持するルール

費用。 コードで構築された3D、Splineコミュニティシーン、モーションは無料です。有料のもの（AI画像、動画、3D、Splineプラン）には、この会話内で見積もったコストに対するユーザーの承諾が必要であり、毎回必要です。最初に1画面だけパイロットします。
真実。 ユーザーの事実のみ。架空の数字、価格、顧客、引用、賞、ロゴは決して作成しません。
センス。 references/taste.md のスロップリストからのものは一切使用しません。
アクセシビリティ。 prefers-reduced-motion には完成した静止ページを提供します。画像にはaltテキストを付けます。テキストは読みやすいコントラストを保ちます。
他人の作品。 参考サイトの文章、画像、コードを決してコピーしません。アセットのライセンスが要求するクレジットを保持し、それ以外のクレジットは追加しません。
クリーンアップ。 起動したすべてのサーバーとブラウザを停止します。

3D Website Factory