工作方法
motion-canvas 是使用 TypeScript 编写 Motion Canvas 场景的框架参考。它解释由生成器驱动的序列、响应式信号、引用和场景层级,再展示如何与形状、文字、路径和媒体结合。
源文件包含实用的状态与时序机制:保存和恢复节点、等待具名事件、运行后台线程,以及结束自定义转场。当智能体已明确要做的场景、需要正确框架概念来表达时,它很有用。
预期交付物
- 沿用项目现有配置的 Motion Canvas 场景代码。
- 可复用的信号、组件和时序序列。
- 可进入项目已配置预览及渲染工作流的项目。
从简报到审查
- 01定义场景对象
创建所需形状和文字,分配引用,并放入清晰的节点层级。
- 02将状态连接到时序
用信号表示变化值,用生成器函数安排序列。用 all() 同时执行动作,用 yield* 等待动画结束后继续序列。具名 waitUntil() 事件可让场景对齐旁白提示点。
- 03检查转场与输出
启动 slideTransition() 前先添加下一场景的节点,避免其在转场结束后突然出现。自定义 useTransition() 会返回结束函数,必须在转场动画后调用。检查已配置的预览或渲染,并保留项目专属输出设置。