スキル threejs-builder
📦

threejs-builder

コンテンツリビジョン r1 安全 ⚙️ 外部コマンド🌐 ネットワークアクセス

Three.jsシーンを構築

クリーンなThree.jsシーンを作成するには、多くのセットアップ上の選択が必要です。このスキルは、Claude、Codex、Claude Codeに、レスポンシブな3D Webアプリ向けの実践的なパターンを提供します。

対応: Claude Codex Code(CC)
📊 74 十分

自分のエージェントでインストール

このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。

エージェントリクエスト
Review the Skillstore skill "threejs-builder" from https://skillstore.io/skills/cesaraugustusgrob-threejs-builder.md and its manifest at https://skillstore.io/api/skills/cesaraugustusgrob-threejs-builder/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。

エージェントが読めるリソース

AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。

Markdown詳細 GET /skills/cesaraugustusgrob-threejs-builder.md 署名済み manifest GET /api/skills/cesaraugustusgrob-threejs-builder/manifest 署名済み lockfile GET /api/skills/cesaraugustusgrob-threejs-builder/lockfile

テストする

「threejs-builder」を使用しています。 最小限のアニメーション付きThree.jsオブジェクトを作成してください。

期待される結果:

camera、renderer、lights、回転するmesh、resize behaviorを備えたレスポンシブなブラウザシーン。

「threejs-builder」を使用しています。 インタラクション付きの3Dポートフォリオ背景を作成してください。

期待される結果:

マウスに反応する動き、制限されたpixel ratio、控えめなビジュアルスタイルを備えた、さりげないパーティクルまたは幾何学的な背景。

「threejs-builder」を使用しています。 Three.jsでモデルを読み込む方法を説明してください。

期待される結果:

loader imports、scene placement、auto-centering、lighting、controls、error handlingを網羅した簡潔なGLTFワークフロー。

セキュリティ監査

安全
v10 • 2026/7/9 バージョン別レポートを開く

Most static external command and reconnaissance alerts are false positives from Markdown code fences, inline code, and Three.js examples. The only confirmed risk is low-severity use of hardcoded unpkg CDN imports in examples, which can expose generated apps to third-party script supply-chain risk. No evidence of prompt injection, data exfiltration, credential access, or malicious intent was found.

2
スキャンされたファイル
789
解析済み行数
14
レビュー項目
0
誤検知を無視
機能レビュー項目 (14)

これらは、このスキルに期待される可能性のある実際のローカル機能であるため、レビューが必要ですが、確認済みの悪意ある動作としてはカウントされません。

低
references/advanced-topics.md:13
Hardcoded URL
import * as THREE from 'https://unpkg.com/three@0.160.0/build/three.module.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:14
Hardcoded URL
import { GLTFLoader } from 'https://unpkg.com/three@0.160.0/examples/jsm/loaders/GLTFLoader.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:15
Hardcoded URL
import { OrbitControls } from 'https://unpkg.com/three@0.160.0/examples/jsm/controls/OrbitControls.j
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:78
Hardcoded URL
import * as THREE from 'https://unpkg.com/three@0.160.0/build/three.module.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:79
Hardcoded URL
import { EffectComposer } from 'https://unpkg.com/three@0.160.0/examples/jsm/postprocessing/EffectCo
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:80
Hardcoded URL
import { RenderPass } from 'https://unpkg.com/three@0.160.0/examples/jsm/postprocessing/RenderPass.j
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:81
Hardcoded URL
import { UnrealBloomPass } from 'https://unpkg.com/three@0.160.0/examples/jsm/postprocessing/UnrealB
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:211
Hardcoded URL
import { RGBELoader } from 'https://unpkg.com/three@0.160.0/examples/jsm/loaders/RGBELoader.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:263
Hardcoded URL
import * as THREE from 'https://unpkg.com/three@0.160.0/build/three.module.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:264
Hardcoded URL
import * as CANNON from 'https://unpkg.com/cannon-es@0.20.0/dist/cannon-es.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
references/advanced-topics.md:394
Hardcoded URL
import Stats from 'https://unpkg.com/three@0.160.0/examples/jsm/libs/stats.module.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
SKILL.md:51
Hardcoded URL
import * as THREE from 'https://unpkg.com/three@0.160.0/build/three.module.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
SKILL.md:221
Hardcoded URL
import * as THREE from 'https://unpkg.com/three@0.160.0/build/three.module.js';
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.
低
SKILL.md:222
Hardcoded URL
import { OrbitControls } from 'https://unpkg.com/three@0.160.0/examples/jsm/controls/OrbitControls.j
The example imports JavaScript modules from unpkg.com, so generated apps may load third-party code over the network. This is legitimate Three.js usage but still a low supply-chain and availability risk.

リスク要因

⚙️ 外部コマンド (50)
references/advanced-topics.md:121-123 references/advanced-topics.md:130-144 SKILL.md:25 SKILL.md:27 SKILL.md:36-81 SKILL.md:81-87 SKILL.md:87-90 SKILL.md:90-91 SKILL.md:91-92 SKILL.md:92-93 SKILL.md:93-94 SKILL.md:94-95 SKILL.md:95-96 SKILL.md:96-99 SKILL.md:99-104 SKILL.md:104-113 SKILL.md:113-114 SKILL.md:114-115 SKILL.md:115-116 SKILL.md:116-117 SKILL.md:117-120 SKILL.md:120-131 SKILL.md:131-140 SKILL.md:140-141 SKILL.md:141-142 SKILL.md:142-143 SKILL.md:143-146 SKILL.md:146-157 SKILL.md:157-160 SKILL.md:160-170 SKILL.md:170-181 SKILL.md:181-187 SKILL.md:187-190 SKILL.md:190-195 SKILL.md:195-198 SKILL.md:198-211 SKILL.md:211-219 SKILL.md:219-235 SKILL.md:235-242 SKILL.md:242-253 SKILL.md:253-256 SKILL.md:256-271 SKILL.md:271-274 SKILL.md:274-287 SKILL.md:287-293 SKILL.md:293-296 SKILL.md:296 SKILL.md:297 SKILL.md:298 SKILL.md:299
🌐 ネットワークアクセス (14)
references/advanced-topics.md:13 references/advanced-topics.md:14 references/advanced-topics.md:15 references/advanced-topics.md:78 references/advanced-topics.md:79 references/advanced-topics.md:80 references/advanced-topics.md:81 references/advanced-topics.md:211 references/advanced-topics.md:263 references/advanced-topics.md:264 references/advanced-topics.md:394 SKILL.md:51 SKILL.md:221 SKILL.md:222
監査者: codex 監査履歴を表示 →
このレポートを共有・引用

バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。

バージョン別レポートを開く
セキュリティ評価

レポートリンクをコピー

https://skillstore.io/skills/cesaraugustusgrob-threejs-builder/audits/10?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdownバッジ

[![Skillstore security assessment](https://skillstore.io/badges/skills/cesaraugustusgrob-threejs-builder/security.svg)](https://skillstore.io/skills/cesaraugustusgrob-threejs-builder?utm_source=security_passport_badge)

HTMLバッジ

<a href="https://skillstore.io/skills/cesaraugustusgrob-threejs-builder?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/cesaraugustusgrob-threejs-builder/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

埋め込みカード

<iframe src="https://skillstore.io/embed/skills/cesaraugustusgrob-threejs-builder.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
学術引用 (APA · BibTeX · CFF)

APA形式の引用

CesarAugustusGroB. (2026). threejs-builder security audit report (audit version 10) [Author version unspecified]. Skillstore. https://skillstore.io/skills/cesaraugustusgrob-threejs-builder/audits/10

BibTeX形式の引用

@techreport{cesaraugustusgrob-cesaraugustusgrob-threejs-builder-2026, author = {CesarAugustusGroB}, title = {threejs-builder security audit report (audit version 10)}, institution = {Skillstore}, year = {2026}, number = {10}, url = {https://skillstore.io/skills/cesaraugustusgrob-threejs-builder/audits/10}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "threejs-builder security audit report (audit version 10)" version: "unspecified" type: report authors: - name: "CesarAugustusGroB" date-released: "2026-07-09" url: "https://skillstore.io/skills/cesaraugustusgrob-threejs-builder/audits/10" identifiers: - type: other value: "skillstore:cesaraugustusgrob-threejs-builder:audit:10" description: "Skillstore immutable audit report identifier"

Skillstore スコア

このスコアの理由 証拠の信頼度: 高
41
アーキテクチャ
85
保守性
87
コンテンツ
72
コミュニティ
83
仕様準拠

作成できるもの

WebGLビジュアルのプロトタイプを作成

製品ページ、ポートフォリオ、ランディング体験向けに、レスポンシブなアニメーションシーンを作成します。

インタラクティブなショーケースを構築

カメラ操作、ライティング、マテリアル、動きを追加して、オブジェクトやコンセプトを3Dで提示します。

Three.jsの基礎を教える

シーン設定、ジオメトリ、マテリアル、アニメーションループ、よくある間違いを簡潔な例で説明します。

これらのプロンプトを試す

最初のシーンを作成 
ライティングされたアニメーションオブジェクト、シンプルなマテリアル、resize handlingを備えたレスポンシブなThree.jsページを作成してください。
カメラ操作を追加 
OrbitControls、バランスの取れたライティング、デスクトップおよびモバイルブラウザ向けの滑らかなアニメーションを備えたThree.jsシーンを構築してください。
ショーケースをデザイン 
ユニークなジオメトリ、洗練されたマテリアル、控えめな動き、パフォーマンスを意識した設定を備えたThree.js製品ショーケースを作成してください。
高度なエフェクトで拡張 
GLTF loading、post-processing、debug helpers、明確なパフォーマンス上のトレードオフを使用するThree.jsシーンを計画してください。

ベストプラクティス

  • 詳細を追加する前に、scene、camera、renderer、lighting、resize handlingから始めます。
  • 多くのオブジェクトが同じプロパティを共有する場合は、geometriesとmaterialsを再利用します。
  • WebGLのパフォーマンスはデバイスによって異なるため、デスクトップとモバイルでのレンダリングをテストします。

回避

  • 各アニメーションフレーム内で新しいmeshes、materials、geometriesを作成すること。
  • 目に見える品質上の必要性がないのに、過剰なgeometry segmentsを使用すること。
  • 本番環境の依存関係ポリシーを確認せずにCDNの例を出荷すること。

よくある質問

このスキルは何の構築に役立ちますか？
lighting、materials、animation、controls、レスポンシブレンダリングを備えたシンプルなThree.js Webシーンの構築を支援します。
最新のThree.jsをサポートしていますか？
はい。ES modulesと、最新のThree.js r150以降のパターンに重点を置いています。
完全な本番アプリを作成できますか？
堅実なプロトタイプは作成できますが、本番アプリには引き続きテスト、バンドル、アクセシビリティレビュー、パフォーマンスチェックが必要です。
高度な3Dトピックは含まれていますか？
はい。GLTFモデル、shaders、post-processing、physics、instancing、debugging helpersの参照が含まれています。
CodexやClaude Codeで使用できますか？
はい。このスキルはClaude、Codex、Claude Codeのサポートを宣言しています。
ネットワークアクセスは必要ですか？
一部の例ではunpkg CDN importsを使用します。本番プロジェクトでは、代わりにnpm package importsを使用できます。

開発者情報

ライセンス

MIT

Skillstore リビジョン

r1

バージョンに関する注意

作者はバージョンを宣言していません。

リポジトリ

https://github.com/CesarAugustusGroB/SHINOBI-WAY-the-inifinite-tower/tree/main/.claude/skills/threejs-builder

参照

0519034dad657fb1f7706e0550e962beeda73fdf

メンテナンスの新しさ

2026/7/20

利用状況

11 ダウンロード · 323 閲覧

ファイル構成

📁 references/

📄 advanced-topics.md

📄 SKILL.md

CesarAugustusGroB のその他のスキル

すべて表示

関連スキル

すべて表示