Define the requirements
填入同一控制盒的尺寸和四个ID，确认展示目标。没有提供的材料、公差与制造方法，保留为待确认。
What to check
Open the resource and three-step guide 得到一张需求表，而不是一张看似准确的工程图。
One example, from brief to web page
Build a control box
you can take apart.
Use the same parts across prompts, offset code, an original model and assembly animation.
No account · Runs locally · No AI API calls
本次做完，你会得到一份自己能改的
一份自己能改的
产品展示小样
- 4个有固定ID的独立部件
- 带拆解与复位动画的GLB模型
- 可离线运行的网页和参数源码
虚构概念模型，适合学习。不是工程图，不适合制造或真实拆装。
The interface language has changed. Resource text, examples and licenses remain in their original language. Search using the original title or project name.
Start with the same specification
Consistent IDs connect every step
原创虚构四层桌面控制盒。下表保留毫米、X右／Y后／Z上的源坐标；GLB按标准转换为米、Y向上。全部X、Y中心和偏移均为0。
| ID / name | Size X×Y×Z (mm) | Original centre Z | Exploded offset Z |
|---|---|---|---|
baseBase | 90 × 60 × 12 | 6 | +0 |
circuitCircuit mock-up | 70 × 42 × 6 | 15 | +16 |
frameInner frame | 84 × 54 × 8 | 22 | +32 |
lidLid | 90 × 60 × 10 | 31 | +48 |
文字规划先用包围盒。下载模型里的壳体、环框、电路色块与顶盖细节是本站另行给定的原创美术设定，不代表AI从尺寸推断了真实内部结构。
Four steps to one finished demo
Align parts and coordinates
X向右、Y向后、Z向上，尺寸和中心均用毫米。先用四个包围盒验证位置，保留base、circuit、frame、lid。
What to check
Open the resource and three-step guide 四个中心的Z分别为6、15、22、31；编号不随展示顺序改变。
Test the exploded view, then reset
运行资源里的原生Node示例，位置始终从原中心计算。分别试0、0.5、1，最后再回到0。
What to check
Open the resource and three-step guide 完全拆开后中心Z为6、31、54、79；归零回到6、15、22、31。
Bring the plan into a web page
下载完整练习包，运行本地查看器，拖动、旋转，再播放模型里已有的动画。
What to check
Open the resource and three-step guide 看到四个独立部件连续拆开、停留并装回；暂停与进度控制都可用。
A real model, started by you
Rotate it, then play the assembly animation
The 3D engine loads only when you start it. Closing the viewer stops its rendering.
A small model, a complete first step
No automatic model download or playback. Read the guide first if you prefer.
进入查看器后：拖动旋转，滚轮缩放；键盘可操作部件、拆解与播放控件。默认不播放。画面无法显示时，Open the viewer separately ↗，或继续用Lightweight structure diagram。
Download it and make it your own
完整包包含本地依赖、模型、参数、构建器与许可。先解压到普通文件夹，不要在压缩包里直接启动。模型与网页均无外部贴图、字体或CDN。
第一次在自己电脑上运行
- 安装Node.js 22 or newer，解压练习包。
- 在解压后的文件夹打开终端，运行：
node server.mjs - 打开终端显示的本地地址。服务只监听本机，按Ctrl+C退出。
想改模型：调整parameters.json，再运行 node build-model.mjs。它会生成新的control-box-custom.glb，保留原模型；按README打开带 ?model=custom 的本地地址查看新模型。参数限制和报错处理见包内README。
哪些已经验证，哪些仍需要你试
模型与代码
原创分件、动画及下载包有可重复的生成与校验记录。查看器采用官方Three.js r186与GLTFLoader；完整版本与文件摘要随包保留。
验证范围
本站记录检查环境与结果，不把桌面浏览器结果当成真机触屏、读屏或制造验证。具体记录见Validation notes。四份提示词的实际Codex样例与评价另存Prompt trial record，不代表其他模型效果。
原创与许可
模型、参数和本站练习代码采用MIT；上游Three.js按MIT保留署名、完整许可与固定来源。提示词与原创导览采用CC BY 4.0。见Original-work licence及Dependency licence notices。
这是教学起点，不会读取或上传你的模型。真实产品、商业素材和制造用途仍需各自核对与专业验证。