doodle-cut
30 秒手绘风视频剪辑器动画,画面、配乐、音效全部用代码写出来

- Platform · 平台
- 代码动画
- Stack · 技术栈
- Remotion · React · SVG · Node.js
- Date · 日期
- 2026.09
- Status · 状态
- 已上线
一个橙色小盒子在剪视频的 30 秒动画:拖素材、剪掉无聊片段、加转场时被自己绊倒、把抖动拉到最大、最后导出成功撒花。
每一个画面、角色动作、镜头运动、背景音乐和音效,全部是代码生成的。
怎么做到的
- 画面:Remotion(React + SVG / CSS),完全由帧号驱动
- 音乐和音效:一个约 400 行的 Node 脚本,用 Karplus-Strong 拨弦、三角波贝斯、噪声鼓点和混响合成尤克里里风格配乐和 8 种音效
- 输出:1920×1080、30 fps、30 秒
核心思路
动画是帧号的纯函数。 组件只负责画出 getEditorState(frame)、getBuddy(frame)、getCamera(frame) 返回的内容,所以整段编排可以写单元测试。音乐是 120 BPM,一拍正好 15 帧,动作很容易踩在节拍上。


