别让小模型直接写动效代码，先给它一份合同

小模型写动效代码有个稳定的失败模式：放手让它写，它就偷偷走捷径。动画属性编出不存在的名字，时间曲线拉坏，坐标算错也不吭声，等渲染出来才发现画面全乱。

Reddit 用户 Bitter-Theme4433 的处理方式不是换更重的模型，而是给 Flash 这类轻量模型套一份合同。项目叫 Motion Lab，技术栈是 React 19 + Remotion + GSAP 3。Remotion 简单说就是用 React 组件来写视频，GSAP 负责补间和时间线。项目目前是 0.8.0 预览版，作者自己承认还有不少毛边。

三段拆开，模型一次只干一件事

整套流程把生产切成三段：

• direction.md，先定方向，讲清楚要做什么感觉的东西。
• spec.json，把方向翻译成结构化规格，字段是定死的。
• Scene.tsx，最后才生成代码，且必须严格对着规格来。

模型的输出从自由文本变成填表。填表错了好查，自由文本错了只能靠眼睛盯帧。

配套的东西也不少：20 个工作室流程技能文件放在 .agent/skills 下，分别管方向、工程和审查，避免把全部上下文塞进一个窗口。23 套声明式模板和 28 个可复用基础组件，坐标系和布局不用模型从零猜。

真正卡住幻觉的是 AST 检查

项目里最关键的一层是静态质量闸门。AST 规则会在渲染前扫描代码，拦下几类东西：布局属性回流（width、height、top 这类），糟糕的配色，过长的静止段，以及代码悄悄偏离了 spec。

为什么盯 width/height/top？动画里改这些属性，浏览器每一帧都要重新计算布局，性能直接塌。小模型不知道这回事，它只看语法对不对。

跟帖里 Ashamed_Search8595 说他做静态布局时最头疼的就是模型默默把属性换掉，问这些检查实际有多严。作者回复很直接：Gemini 3.8 稍微一困惑，就会把属性换成 top 或 width，或者编一段随机的 CSS 把渲染搞崩。所以现在 AST 检查是硬阻断，任何布局回流属性或没有种子的随机数都会让构建立刻失败，命令行把出错的那一行原样丢回给模型自己改。

他还附了一段导出示例，链接在这里。

这不是提示词技巧

看下来，这套东西更接近编译器，而不是提示词工程。模板和规则要人先写，模型换来的自由度，拿去换了稳定性。代价是前期投入不小，而且 23 套模板覆盖不到的镜头，照样得人来兜底。

作者在帖子里求反馈，特别想知道做过合同驱动代码生成、或者用小模型跑创意任务的人怎么看，也想知道这套路子在哪里会翻车。

仓库：github.com/m2rtyaman/motion-lab