요구 사항 명확히 하기
填入同一控制盒的尺寸和四个ID，确认展示目标。没有提供的材料、公差与制造方法，保留为待确认。
완료 확인 기준
해당 자료 및 3단계 안내 열기 得到一张需求表，而不是一张看似准确的工程图。
하나의 예제로 요구 사항부터 웹까지
분해할 수 있는
탁상 제어 상자를 만들어요.
같은 부품으로 프롬프트, 이동 코드, 자체 모델과 조립 애니메이션을 연결해요.
계정 불필요 · 로컬 실행 · AI API 호출 없음
本次做完，你会得到一份自己能改的
一份自己能改的
产品展示小样
- 4个有固定ID的独立部件
- 带拆解与复位动画的GLB模型
- 可离线运行的网页和参数源码
虚构概念模型，适合学习。不是工程图，不适合制造或真实拆装。
화면 언어를 변경했습니다. 자료 본문, 예제, 라이선스는 원문을 유지합니다. 원문 제목이나 프로젝트 이름으로 검색하세요.
먼저 같은 사양표로 시작해요
일관된 ID로 모든 단계를 연결해요
原创虚构四层桌面控制盒。下表保留毫米、X右／Y后／Z上的源坐标；GLB按标准转换为米、Y向上。全部X、Y中心和偏移均为0。
| ID / 이름 | 치수 X×Y×Z (mm) | 원래 중심 Z | 분해 이동량 Z |
|---|---|---|---|
base받침대 | 90 × 60 × 12 | 6 | +0 |
circuit회로 모형 | 70 × 42 × 6 | 15 | +16 |
frame내부 프레임 | 84 × 54 × 8 | 22 | +32 |
lid윗덮개 | 90 × 60 × 10 | 31 | +48 |
文字规划先用包围盒。下载模型里的壳体、环框、电路色块与顶盖细节是本站另行给定的原创美术设定，不代表AI从尺寸推断了真实内部结构。
네 단계로 하나의 예제 완성
부품과 좌표 통일하기
X向右、Y向后、Z向上，尺寸和中心均用毫米。先用四个包围盒验证位置，保留base、circuit、frame、lid。
완료 확인 기준
해당 자료 및 3단계 안내 열기 四个中心的Z分别为6、15、22、31；编号不随展示顺序改变。
분해를 확인하고 원위치로 되돌리기
运行资源里的原生Node示例，位置始终从原中心计算。分别试0、0.5、1，最后再回到0。
완료 확인 기준
해당 자료 및 3단계 안내 열기 完全拆开后中心Z为6、31、54、79；归零回到6、15、22、31。
계획을 웹페이지로 만들기
下载完整练习包，运行本地查看器，拖动、旋转，再播放模型里已有的动画。
완료 확인 기준
해당 자료 및 3단계 안내 열기 看到四个独立部件连续拆开、停留并装回；暂停与进度控制都可用。
직접 시작하는 실제 모델
회전한 뒤 조립 애니메이션 재생
시작할 때만 3D 엔진을 불러와요. 뷰어를 닫으면 렌더링이 멈춰요.
작은 모델로 완성하는 첫 단계
모델을 자동 다운로드하거나 재생하지 않아요. 먼저 안내를 읽어도 좋아요.
进入查看器后：拖动旋转，滚轮缩放；键盘可操作部件、拆解与播放控件。默认不播放。画面无法显示时，뷰어 별도로 열기 ↗，或继续用가벼운 구조 도해。
다운로드해서 직접 바꿔 보세요
完整包包含本地依赖、模型、参数、构建器与许可。先解压到普通文件夹，不要在压缩包里直接启动。模型与网页均无外部贴图、字体或CDN。
第一次在自己电脑上运行
- 安装Node.js 22 이상，解压练习包。
- 在解压后的文件夹打开终端，运行：
node server.mjs - 打开终端显示的本地地址。服务只监听本机，按Ctrl+C退出。
想改模型：调整parameters.json，再运行 node build-model.mjs。它会生成新的control-box-custom.glb，保留原模型；按README打开带 ?model=custom 的本地地址查看新模型。参数限制和报错处理见包内README。
哪些已经验证，哪些仍需要你试
模型与代码
原创分件、动画及下载包有可重复的生成与校验记录。查看器采用官方Three.js r186与GLTFLoader；完整版本与文件摘要随包保留。
验证范围
本站记录检查环境与结果，不把桌面浏览器结果当成真机触屏、读屏或制造验证。具体记录见검증 안내。四份提示词的实际Codex样例与评价另存프롬프트 시험 기록，不代表其他模型效果。
原创与许可
模型、参数和本站练习代码采用MIT；上游Three.js按MIT保留署名、完整许可与固定来源。提示词与原创导览采用CC BY 4.0。见창작물 라이선스及의존성 라이선스 안내。
这是教学起点，不会读取或上传你的模型。真实产品、商业素材和制造用途仍需各自核对与专业验证。