WebGPUシーンをスキャフォールドする
使うタイミング: 余計な作業なしに動作するWebGPU + Three.jsのスターターが欲しい場合。
フロー
-
ブリーフシーンを説明する;skillが下書きを作成します。✓ コピーしました→ ファイルが書き込まれている
-
反復シェーダーを調整する;skillが適用します✓ コピーしました→ 可視出力
結果: WebGPUシーンがブラウザで高速に動作します。
作者 dgreenheck · dgreenheck/webgpu-claude-skill
ClaudeでWebGPU + Three.jsプロジェクトを立ち上げる — ボイラープレート、シェーダーパターン、パフォーマンスチェックがすべて1つのskillに。
WebGPUはまだ新しくClaudeがAPIをハルシネーションしがちです。このskillがそれを解消します:動作するThree.js + WebGPUのスキャフォールド、よく使うシェーダーパターン、ブラウザのパフォーマンスヒューリスティックを提供します。
使うタイミング: 余計な作業なしに動作するWebGPU + Three.jsのスターターが欲しい場合。
結果: WebGPUシーンがブラウザで高速に動作します。
シーンをプロジェクトに書き込む
| ツール | 入力 | 呼び出すタイミング | コスト |
|---|---|---|---|
| scaffold / shade | (ドキュメント参照) | 2つのフロー | 1 call |
WebGPUが使用できないskillは要求されるとWebGLフォールバックを出力します
| 代替案 | 代わりに使う場面 | トレードオフ |
|---|---|---|
| 直接Three.jsドキュメント参照 | WebGPUをよく知っている場合 | 立ち上げが遅い |