← すべての Skills · 3D · Three.js Scene Builder

Three.js Scene Builder — 完成出力
Runs inClaude Code Codex Cursor Muse Dot Grok Bot Cue OpenClaw Hermes
Install guidesClaude Code Codex Cursor Muse
必要なもの：シーンブリーフ（brief.txt：[objects] id: shape | size … | pos … | material …、[lights]、[camera]、[scene]）と、シーン表示用のWebGL対応ブラウザ。

Similar Skills

Blender Scene Assistant previewFree

Blender Scene Assistant

  1. プレーンテキストでシーンブリーフを書く
  2. ブリーフにジェネレーターを実行する
  3. シーンを信じる前にレポートを読む
  4. Blenderでレンダリングする（ヘッドレスでもビューポートでも）
  5. エラーを修正して再実行する

View all skills →

得られるもの

  • スタンドアロンのscene.html：インポートマップ、影付きレンダラー、各オブジェクトに標準マテリアル
  • OrbitControlsとターンテーブルアニメーション、リサイズハンドラー付き
  • シーンレポート：オブジェクト・ライト一覧とすべてのエラー・警告
  • 生成モジュールスクリプトは毎回node --checkで構文チェック済み

こんな方に最適

  • リンクで共有する製品ターンテーブルと3Dウェブシーン
  • サイトに組み込む前の3Dシーンプロトタイプ
  • シーンを正直に保つ：書かれたものだけを構築

向いていない用途

  • 複雑な外部モデル（GLTF/FBX）——プリミティブのみ
  • 不足するオブジェクトやライト、背景の補完
  • シーンが良いことの証明——レポートが綺麗なのはブリーフ通りという意味で、見栄えの保証ではない

出力サンプル

この Skill が生成するものの例です。サンプルコンテンツであり、説明用に表示しています。

Three.js Scene Builder report — sample

Scene report: Yellow Mug Turntable

Objects: 3 valid | Lights: 2 | Camera: custom | Background: #262627 | Turntable: on

Objects: pedestal (cylinder 2.0, 0.15); mug (cylinder 0.9, 1.1); backdrop (plane 12, 12).

Errors: none. Warnings: none. Module node --check: OK.

Messy draft check: 2 valid objects, 3 errors (unknown capsule shape; duplicate mug id; negative-size badbox), 1 warning (missing camera — default added).

この Skill について

You say
Three.jsの製品ターンテーブルを作って：暗い台座の上の黄色いマグ、明るい背景、オービットコントロール付き。

インストール方法

  1. インストールプロンプトをあなたのエージェントにコピーしてください： Read https://skillu.dev/install/agent.md, then install the Three.js Scene Builder skill (threejs-scene-builder).
  2. または、公開後にこのページから Skill パッケージをダウンロードし、そのフォルダをエージェントの skills ディレクトリに配置します。
  3. スラッシュコマンドで呼び出します。例：/threejs-scene-builder。あとは欲しいものをそのまま言葉で伝えるだけです。

よくある質問

ブリーフにエラーがあるとどうなりますか？

有効な部分からはシーンが生成され、レポートにすべてのエラーと警告が載ります：未知の形状は破棄、重複idは最初の定義を保持、不正なサイズは指摘、カメラが無ければ明記されたデフォルトで補います。ブリーフを直して再実行してください。

書いていないものは作られますか？

いいえ。ブリーフのオブジェクト、ライト、設定だけが現れます。背景や2つ目のライトが無ければブリーフの不足であり、スキルが補うことはありません。

シーンにサーバーは必要ですか？

任意の静的ホストか1行のローカルサーバーで十分です（python3 -m http.server）。ページはunpkg CDNからthree.js 0.160.0を読み込みます。完全オフラインで使う場合はモジュールとOrbitControlsアドオンをローカルにダウンロードし、インポートマップをそちらに向けてください。

Premium を入手 他の Skills を見る