Machine Anatomy
一个共享套件:新机器只编写其模型、布局和绘图、实时钩子及其事实。
套件拥有页面、主题和样式、缩放框架、爆炸视图、真理检查、
录制器、音效和检查功能。示例位于 examples/edison-light-bulb/;请复制其结构。
1. 一次性提问,然后构建
在任何代码之前,使用主机的提问工具(Claude Code 中的 AskUserQuestion)在一轮内向用户提出所有引入问题,每个问题都带有推荐的默认值,跳过他们已说过的内容。然后继续,无需进一步的门控。问题、默认值以及每个答案如何映射到配置:references/intake.md。
2. 研究,然后生成事实
阅读真实来源(专利、制造商的论文、博物馆页面、百科全书)。编写 reference/notes.md,包含 URL 和引用,然后编写 facts.json:每个事实一条记录,包含 text、source、quote 或 note,以及 status(verified 或 inferred)。规则以及 lint 强制实施的内容:references/truth-control.md。
从来源中列出机器的所有功能及其设置到 functions 中。
然后收集至少 3 张该机器及其设置的真实照片或图纸到 reference/images/ 中,并附带 sources.json,并在绘制前打开每张图片;每个组件都要注明其绘制所依据的图片。
Lint 强制执行此操作,而 record 会生成 shots/reference-compare.png 以进行检查:references/reference-images.md。
3. 构建机器文件夹
node cli.mjs new <folder> --title "..." 从 Edison 示例中搭建脚手架。按以下顺序替换:
model.mjs— 纯模型,无 DOM;所有行为和显示的所有数字。test-model.mjs针对真实值或不变量对其进行测试。测试是强制性的。layout.mjs— 以世界单位表示的大小和计算出的曲线(路径遵循真实零件,从不使用弦)。figure.mjs—drawFigure(draw):将真实零件绘制为编号组件下的项目,使用套件的辅助函数;返回标签、defs、CSS、徽章锚点、步骤点和缩放目标。live.js—createMachineHooks(kit):状态、运动部件的绘制、控件、读数、动作。使用kit.Motion处理弹簧、惯性和关节:references/motion.md。machine.mjs— 带有移除轴和来源的组件,所有可见文本为{ text, facts },读数模板,控件,影片故事,声音角色。
在编写每个文件之前,请阅读示例的对应文件;不要读取已构建的 *.html 文件。
4. 外观
主题和渲染风格是独立的层:references/themes-and-styles.md。在 machine.mjs 中设置默认值(theme,style);任何页面切换使用 ?theme= 和 ?style=。
5. 影片和音效
默认影片是经批准的 30 秒格式(先正常工作,一次缩放诞生,一次有标签的慢速运行,带有对比时刻的正常运行,交错拆解,重新组装,最后正常工作):references/film.md。
音效是安静的近距离麦克风敲击声,没有哔哔声,没有限制器:references/sound.md。发布影片的说明文字规则:references/caption.md。
6. 命令和检查(交付前需要全部完成)
node cli.mjs lint <folder> # 文本绑定到事实、来源、最高级、来源信息
node cli.mjs test <folder> # 模型测试
node cli.mjs build <folder> [--format 16:9,9:16,square]
node cli.mjs audit <folder> # 爆炸视图的绘制顺序和穿透
node cli.mjs verify <folder> # 在无头 Chrome 中检查真实页面,每个主题和样式
node scripts/lines.mjs <folder>/<slug>-anatomy.html # 纹理线条终止于某处
node cli.mjs record <folder> [--format 9:16] [--style dither] [--no-sound]
node cli.mjs remux <folder> # 仅对录制的帧进行音效更改
npm test # 套件单元测试
Playwright 不捆绑:npm install --no-save playwright,或设置 MACHINE_ANATOMY_PLAYWRIGHT 指向现有的 Playwright index.mjs。录制以低于正常优先级且不使用 GPU 运行。
然后自行打开 shots/<variant>/video-sheet.png、三张静态图、verify 截图和 shots/reference-compare.png;修复裁剪、重叠、不可读文本、游动图案以及与参考图像的每一项差异(除非是已声明的简化)。
所有者设定的规则(在存在检查时强制执行)
- 任何事物都不能遮挡其他事物:record 和 verify 中的一次碰撞检查(
references/film.md);仅声明物理上真实的重叠及其原因,在film.overlapAllowed中。 - 在机器完整的真实设置中展示该机器(引入问题 10),附带来源和来源信息。
- 主体在每个阶段至少占据帧高度的 25%,并且关键事件发生在屏幕上(
minimum.subject,film.onScreen);运行的机器使用hooks.camera()控制相机。 - 图案锁定在表面上且不游动;使用
scripts/swim.mjs测量(references/themes-and-styles.md)。 - 火焰、蒸汽、烟雾和发光来自
kit/effects.mjs,由模型驱动(references/motion.md)。 - 每个工作零件要么显示为工作状态,要么有声明的原因;没有运动而没有绘制出的、主动的原因;压缩的时间显示在屏幕上(
references/completeness-and-causality.md,lint 和 record)。
报告
页面、发布片段和影片的路径;lint、test、audit、verify 和 lines 计数;响度、真实峰值和影片频谱(说明无人听过);影片时间线;每个说明文字事实及其来源;哪些是简化、推断或未验证的。
致谢:基于 Anatomy by Ryan (github.com/wheresryan22/anatomy, MIT) 构建。参见 THIRD_PARTY_NOTICES.md。