Agent Skills › asgeirtj/system_prompts_leaks › 3d-object

3d-object

GitHub

使用 three.js 构建可交互的 3D 模型查看器，支持多角度旋转查看及 OBJ/GLB 格式下载。通过组合基础几何体程序化生成模型，并规范材质与命名以确保导出文件可用性。

Anthropic/claude-design/skills/3d-object/SKILL.md asgeirtj/system_prompts_leaks

Trigger Scenarios

需要创建可下载的 3D 模型实现 Three.js 3D 场景展示生成 OBJ 或 GLB 文件

Install

npx skills add asgeirtj/system_prompts_leaks --skill 3d-object -g -y

More Options

Non-standard path

npx skills add https://github.com/asgeirtj/system_prompts_leaks/tree/main/Anthropic/claude-design/skills/3d-object -g -y

Use without installing

npx skills use asgeirtj/system_prompts_leaks@3d-object

指定 Agent (Claude Code)

npx skills add asgeirtj/system_prompts_leaks --skill 3d-object -a claude-code -g -y

安装 repo 全部 skill

npx skills add asgeirtj/system_prompts_leaks --all -g -y

预览 repo 内 skill

npx skills add asgeirtj/system_prompts_leaks --list

SKILL.md

Frontmatter

{
    "name": "3d-object",
    "description": "three.js model, downloadable as OBJ or GLB",
    "user-invocable": true
}

3D object

Model a 3D object the user can inspect from every angle and download, built with three.js and presented in the three_d_stage starter.

START by calling copy_starter_component with kind: "three_d_stage.js" — it is the whole viewer: studio lighting, ground shadow, orbit controls, an auto-framed camera, and a toolbar that downloads the object as OBJ + MTL or GLB. Read the copied file's usage block and follow its page skeleton exactly. You only write the model-building module script.

Build the page as plain HTML — a .html file with ordinary <script> tags — even when the project's other designs are .dc.html Design Components: DC restricts scripts to , which races the stage's mount and can't host this skeleton.

Load three.js ONLY through this exact pinned import map, in , before any module script. Do not change versions, URLs, or hashes, do not add other copies of three.js, and do not import addons beyond the three listed — the map is deliberately a closed set, so anything else fails to resolve rather than loading unverified:

Build the model programmatically, as a THREE.Group composed of named parts:

Compose primitives (BoxGeometry, CylinderGeometry, SphereGeometry, TorusGeometry, LatheGeometry, ExtrudeGeometry with Shape) before reaching for raw BufferGeometry; real objects decompose into far more primitives than you'd guess.
NAME every mesh and every material ("hull", "walnut", "brass") — the names become the o / usemtl entries in the exported OBJ and the node names in the GLB, which is what makes the download usable in Blender.
Use MeshStandardMaterial with a small curated palette (3-5 materials, shared across parts); set roughness/metalness deliberately. Textures don't survive the OBJ export — prefer geometry and material color over texture detail.
Model in real-world meters, y-up, centered on the origin, base resting at the lowest y. Offset deliberately coplanar faces by ~0.001 so nothing z-fights.
Curved surfaces need enough segments to read as smooth at full screen (32+ radial segments on feature surfaces), but don't tessellate what no one will see.

The stage's toolbar gives the user OBJ + MTL (universal, geometry + per-material colors) and GLB (the modern interchange format — keeps the part hierarchy and PBR materials; imports cleanly into Blender, Maya, Cinema 4D, Unity, Unreal). Those two are the export formats on offer — when the user asks for something else (FBX, USDZ, STEP), say plainly that the stage exports OBJ + MTL and GLB.

Iterate with screenshots: the stage keeps its last frame readable, so the ordinary screenshot tools capture the live canvas — no extra steps. After editing a module file, reload with show_html before screenshotting (the iframe caches already-loaded modules). Look at the object from the default framing and refine silhouette, proportion, and material separation — the silhouette carries the object.