mcpField
B
blender-threejs-export

blender-threejs-export

github.com/kevinbadiクリエイティブ・メディア210159 回インストール30 週間前に更新
リポジトリ

blender-threejs-export について

Blender のシーンを圧縮 GLB として書き出し、Three.js の単体 HTML ビューアーを生成するスキルです。Web サイトで 3D モデルを公開する制作者向けで、回転、背景色、単一ファイルへの埋め込みを設定できます。

主な機能

  1. 01圧縮 GLB の書き出し
  2. 02単体 HTML ビューアーの生成
  3. 03回転・ズーム・パン操作
  4. 04スタジオ照明と自動回転
  5. 05レスポンシブレイアウト
  6. 06GLB の HTML 埋め込み

活用シーン

  1. 01製品モデルの Web プレビュー作成
  2. 023D モデルを単一 HTML ファイルで共有

MCP 対応

Blender MCP addon 経由で起動中の Blender に接続し、現在のシーンを書き出します。

インストール

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

$npx skills add https://github.com/kevinbadi/blender-skills --skill blender-threejs-export

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

同梱ファイルscripts/blender-threejs-export.js

詳細

Blender Three.js エクスポート

現在の Blender シーンを圧縮済み GLB としてエクスポートし、Three.js ビューアーを備えたスタンドアロンの HTML ファイルを生成します。ビューアーには、オービットコントロール、スタジオ照明、自動回転、レスポンシブなサイズ調整が含まれており、あらゆる Web サイトにそのまま追加できます。

前提条件

  • Blender（4.x 以降）が起動しており、ポート 9876 で Blender MCP アドオンが有効になっていること
  • Blender にシーンが読み込まれていること（例：blender-product-polish の実行後）

実行方法

node skills/blender-threejs-export/scripts/blender-threejs-export.js --output ~/Desktop/my-product
オプション
オプション説明デフォルト
--outputGLB ファイルと HTML ファイルの出力先ディレクトリ必須
--name拡張子を除くファイル名model
--portBlender MCP のポート9876
--no-rotate自動回転を無効にするfalse
--bg背景色の 16 進数コード#111111
--embedGLB を Base64 で HTML に埋め込む（単一ファイル）false

出力

output-dir/
  model.glb          # Compressed GLB export from Blender
  model.html         # Standalone Three.js viewer (CDN imports, no build step)

ビューアーの機能

  • オービットコントロール — クリックしてドラッグすると回転、スクロールするとズーム、右クリックするとパンします
  • 自動回転 — 製品を見せるためのゆっくりとした回転です（--no-rotate で無効にできます）
  • スタジオ照明 — Blender のポリッシュ仕上げの見た目に合わせた 3 点照明のセットアップです
  • レスポンシブ — コンテナーいっぱいに表示され、モバイルでも動作します
  • 依存関係ゼロ — import maps 経由で CDN の Three.js を使用するため、npm やビルドは不要です
  • すぐに使える — HTML を直接開くか、任意のページに埋め込めます

コメント

Markdown 対応