AI 发布片进化论：从剪映模板到“全片一个 HTML 文件”，onetake 代表的新形态

AI 发布片进化论从剪映模板到“全片一个 HTML 文件”onetake 代表的新形态【免费下载链接】onetakeMotion films that never cut to the next slide: every beat grows out of the one before, one continuous camera, continuity measured by an oracle. Product launch films and feature demos, made with a coding agent.项目地址: https://gitcode.com/gh_mirrors/on/onetake产品发布片正在经历一次比“换工具”更深的形态更替。过去五年做一条 15 秒的产品宣传片主流路径只有两条套模板或者“生成”。套模板的结果是千篇一律的标题卡、淡出、界面镜头、淡出、Logo——每一镜单看都不错合起来就是翻 PPT生成式视频有镜头美学了但同一段提示词每次生成不同帧产品真实界面无法逐像素复现改一个画面要重生成一整段。而在 onetake 这个开源 Claude Agent Skill 里整部 10–30 秒的片子被压缩成一个 HTML 文件每个像素都是时间t的纯函数渲染带真实快门运动模糊成片交给人类看之前先由脚本化的“oracle”验收连贯性。本文结合仓库源码拆解这条从“剪辑”到“编译”的路径为什么成立以及它对发布片生产链条的重塑。一、三代 AI 发布片形态模板拼接、生成式视频、程序化合成模板拼接把“场景替换”误当成转场模板工具剪映、Canva、稿定设计等的底层逻辑是场景堆叠标题卡、淡出、界面镜头、淡出、功能卡片、淡出、Logo。onetake 的 README 用一句话点破了问题画面和画面之间没有任何联系后一个场景只是把前一个替换掉了README.md。这不是审美偏好问题而是节奏层面就有硬伤。onetake 的参考片解构文档记录了第一代 AI 动效短片的典型失败motion-web 的第一版把九张页面做成卡片场镜头以 0.74 秒的等间距推过每张实测静止帧占比仅 0.02相机从未停过被用户否为「PPT 式一个一个展示」第二版改成全幅素材加硬切七段等长镜头依然被否为「没有节奏变化 依然是 PPT」references/rhythm.md。模板工具的节奏是写死的一拍一卡素材要自己录屏改一版就要重剪这些痛点是结构性的。生成式视频美感有了“确定性”没了生成式视频文生视频、图生视频解决了“画面好看”的问题镜头美学与场景逻辑能力也在快速进化。但对发布片这个具体体裁它有几个结构性短板一是逐帧不确定性——同一 prompt 两次生成帧序列完全不同无法把产品真实界面、真实数据、真实交互动效精确呈现二是不可 seek——无法“跳到第 6.4 秒改那一帧”改一个画面往往意味着整段重生成三是产品发布片最贵的部分恰恰是“产品本身的样子”而生成式模型对中文界面、真实控件、真实数据的还原成本远高于直接渲染 DOM。这些约束决定了发布片不是生成式视频的最佳战场。程序化合成把“剪辑”变成“编译”onetake 选择的是第三条路把一部电影写成一个 composition——一个 HTML 文件一个window.__seek(t)的纯时间函数一套动作库、一套素材录制、一个共享混响的声音系统以及一个在人类观看之前先判定“有没有节奏、有没有衔接”的 oracleSKILL.md。成片不再是“剪辑出来的素材流”而是“编译出来的确定性输出”。这正是“全片一个 HTML 文件”这一定位的工程含义电影被写成程序渲染是执行验收是测试。上图是 onetake 自己的 30 秒发布片提示词栏被输入三次一次比一次短一句 → 四个词 → 一个词每次回车提示词都看得见地变成一条完整的小片子——输入框展开成 Mac 窗口第二条压成一条线划过桌面第三条变成 LED 屏幕的网格线。全片一个镜头结尾块状光标一笔写出名字cases/onetake-launch-30s/README.md。二、onetake 的“一个 HTML 文件即一部片”为什么是工程胜利契约先行__seek(t)与纯函数时间composition 的契约极简见 templates/comp.htmlwindow.__seek async (t) { ... ; return true; } // 为时间 t 设置每个样式图片解码完成后 resolve window.__ready document.fonts.ready.then(() { measure(); simulate(); return seek(0); }); window.__meta { dur: 15, fps: 30 }; // render.py 读 durprobe.py 读 cuts 与 inFrameseek(t)必须是纯的先调 6.4、再调 2.0、再调 6.4得到的帧必须逐像素相同。因此 composition 里不允许有跨调用累积的状态弹簧写成闭式解真正需要积分的物理软体、Verlet 串、依赖手迹的磁吸用固定种子在 240 Hz 预模拟一次再按时间索引采样references/composition.md。纯函数不是洁癖它是运动模糊的前提render.py 必须能在快门时间内反复 seek才能做真实的快门积分。动作库39 个实测动作而不是手写缓动动效不是随手写的 CSS 过渡而是 lib/motion.js 里的 39 个动作——弹簧、入场、衔接、碰撞、物理模拟、相机、流体光场。每个动作是绝对时间的纯函数返回普通数值写入 DOM transform 或 canvas 调用皆可const w OM.wordRise(t, 0.15); el.style.opacity w.op; el.style.transform translateY(${w.y}px) scale(${w.s});动作的缓动曲线用t80量化运动完成 80% 距离所消耗的时间占比expoOut的 t80 是 0.23是发布片的“落点感”随手写的 smootherstep 处处 t80 ≈ 0.67所有动作都变成同一条软 S 曲线读起来就是网页过渡references/motion-library.md。专门承担“衔接”职责的 carry 动作组——morphRect容器变身、iris从主体打开舞台、zoomThrough推进卡片直到它成为场景、gather/seal演员收拢成标志——来自被否掉的 Pocket Weather v3是“画面互相替换 PPT”这条教训的直接产物。每个动作配一张六帧 速度曲线的对照表如 gallery/sheets/morphRect.png选动作前先看图。真实运动模糊快门积分不是 CSS blur浏览器截图是瞬时曝光快动作会闪成清晰的复制品电影摄影机则是在快门打开期间持续积分。render.py 的实现是对每个运动帧在 180° 快门半帧间隔内多次 seek把多次截图在线性光下平均。因为__seek是纯函数这是真实积分而不是模糊滤镜scripts/render.py。采样数由window.__motion(t0, t1)上报的屏上最大位移自适应one-dot 的 633 px/帧开场固定 8 次采样会留下 40 px 的台阶自适应则对 293 个运动帧只用 4 次、对最猛的 3 帧用到 48 次cases/one-dot-15s/README.md。硬规则写得很直白“Fast moves need the shutter”——超过 80 px/帧而无运动模糊就会被判渲染缺陷SKILL.md。可测量的连贯probe.py verify_promo.py 的 oracle“连贯”在 onetake 里不是感觉是数字。probe.py在每次__seek后列出画面上有什么——DOM 元素按变换后的矩形和有效透明度、canvas 每次drawImage/fillText/fill 经上下文变换定位不需要任何注解然后找出每个交接处0.4 秒窗口内屏上内容身份大面积改变判定它是carried有东西活下来并移动 ≥ 2% 帧对角线或缩放 ≥ 10%、anchored幸存者是大块静止物还是bare什么都没活下来。carry score (carried anchored/2) / 被判定的交接数scripts/probe.py。scripts/verify_promo.py 把 probe 的数字变成 8 个验收 legcadence镜头长度变异系数 ≥ 0.25等长镜头 幻灯片、rest≥ 25% 帧静止且有一段 ≥ 1 秒的静默、burst、audio峰值 ≤ −3 dBFS、零削波、continuitycarry score 0.5 直接 FAIL、curves 80 px/帧且无快门模糊 FAIL、framing__meta.inFrame声明的主体不得出画等。判定的效力由数据说话Pocket Weather 的三版剪辑节奏 leg 全部通过v1 的 carry score 是0.00、v2 是0.40都被否v3 让每个画面从上一个里长出来0.75通过。onetake 自己的发布片 0.83README.md。这就是 README 那句“连贯是量出来的不是靠感觉”的出处。一镜到底的镜头语言相机是“操作员”一镜到底不是“不剪”而是一台从不剪断的相机替观众运镜。OM.camera(t, keys)用关键帧定义镜头位置操作感来自三个叠加层手持浮动低频双正弦静止段归零、落点震动OM.shake、远处的参考格点OM.lattice让移动有东西可滑动。方法论是“chase, dont follow”用expoInOut把关键帧打到主体将要到达的位置读起来是操作员甩镜用sineInOut落后主体约 0.1 秒读起来是跟随references/composition.md。clearing 案例把这一套推到极端15 秒内从整年日历推进到某个下午的半小时1× → 300× → 1× 一个镜头。300 倍变焦下世界空间弹簧每滞后一像素目标就摆动一帧宽所以相机追逐的是锚点的屏幕位置和对数的 zoom屏幕空间弹簧在任何尺度下都以同样的方式滞后和落定cases/clearing-15s/README.md。pith 案例反向运行同一技巧440× → 0.52× 只出不回像素在光标里、光标在提示词里、提示词在输出流里窗口把边框画在已经存在的流周围——“里面”的层级关系让替换根本无从发生cases/pith-21s/README.md。不录屏的 UI 复刻与同房间的声音发布片要展示真实产品onetake 的答案不是录屏而是用 HTML 复刻 UI用户只提供参考拍摄界面在参考片的像素坐标系里重建每个字符串在STR[lang]表里、每个状态由纯set(state)写入复刻体放在相机可以任意推近的平面上references/product-demo.md。多语言不是一个分叉的 composition而是同一文件加?lang参数配UIK.timeWarp把第二语言的配音映射到作者时间线再用frame_diff.py对源语言逐像素比对校验。声音同样被工程化references/sound.md 定义的六种合成材料空气、玻璃、木头、sub、气泡、wobble放进同一个 1.1 秒 T60 的混响房间时间与声像直接取自 composition 自己导出的__events()事件表——重排一个节拍声音跟着走。三、这种形态对发布片生产链条的重塑从“剪辑工序”到“8 步协议”onetake 本质是一套写给 Agent 的制作协议SKILL.md先拆参考片成数字analyze_ref.py输出能量图、静止率、剪辑点、t80 运动线→ 出三个“关于画面的一句话”概念 → 写同时约束节奏和衔接的节拍表 → 在动作库上写一个 HTML → probe → 渲染草稿 → 按事件配声 → 过 oracle → 才给人看。每一步都有硬规则而每条硬规则都标注“each one cost a cut”——是用被否掉的成片换来的。例如“Never cut on a metronome”等长镜头再好看也是幻灯片来自 motion-web 的两版被否“Never replace a beat — carry it”来自 Pocket Weather 的 carry 0.00“Never let the frame be always in motion”来自参考片 34% 静止的实测。制作流程第一次变成可执行、可复述、可交给编码 Agent 的协议。版本迭代的成本结构变了传统链条里改一版意味着重录素材、重剪时间线、重配音onetake 里改一版是改节拍表里的几个秒数、改f(t)的参数、重新跑一次 1080p30 草稿渲染。渲染成本是透明可估算的one-dot 的相机版 450 帧共 2,480 次截图8 个 worker 103 秒完成一个浏览器约 8.5 分钟clearing 因为俯冲和甩镜每像素都动7,422 次截图 331 秒cases/clearing-15s/README.md。被否版本不是丢掉的废片而是被量化的记录motion-web 三版、Pocket Weather 三版、one-dot 两版相机的 carry score、静止率、峰值 px/帧全部留档成为下一部片子的校准数据。验收前置oracle 在人类观看之前发布片生产的最后一段传统上依赖“主编的眼力”。onetake 把验收前移成自动化 gate节奏均匀、没有静止段、音频爆音、快动作无模糊、主体出画、carry score 过低——这六类最像 PPT 的病在人类看片之前就由 verify_promo.py 判掉。它甚至能抓到人眼容易漏的问题one-dot 的第一个相机渲染在 1.10 秒跟丢了那颗点所有其他 leg 全部通过只有 framing leg__meta.inFrame { dot: [0.5, 15] }抓出了“点出画”cases/one-dot-15s/README.md。发布片与产品代码同源最深层的变化是宣传片第一次和产品代码共享同一个世界。界面是 DOM数据是产品真实输出的数据pith 的 “63.5 hours kept”、motion-web 的VERDICT: PASS都来自真实运行结果而非手填画面事件驱动声音多语言复用同一 composition。这意味着发布片可以像软件一样做回归每次改版后跑 verify多语言用frame_diff.py逐像素比对?t6.4hud可以钉住任意帧审查。动效短片从“视频资产”变成了“代码资产”进入了版本管理、CI 与回归测试的范畴。需要说明边界onetake 的许可证是 PolyForm Noncommercial 1.0.0个人与教育用途免费商用需 onetake Pro 授权公开案例只含成片与拆解文档、不含片源码体裁上它擅长 10–30 秒的产品动效短片与功能演示不适用于长视频、口播与既有素材剪辑。它也不是要取代生成式视频而是划出了一片生成式模型力所不及的地带——当产品本身是像素时让像素自己演自己的发布片。把“电影”写成window.__seek(t)用 39 个实测动作、真实快门、量化连贯和一台被操作员附体的相机完成合成这大概就是“全片一个 HTML 文件”作为新形态的全部含义发布片不再是素材的剪辑而是代码的编译而验收先于人类的眼睛。【免费下载链接】onetakeMotion films that never cut to the next slide: every beat grows out of the one before, one continuous camera, continuity measured by an oracle. Product launch films and feature demos, made with a coding agent.项目地址: https://gitcode.com/gh_mirrors/on/onetake创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考