展开本页目录
开始前准备什么
- 下载本页原创练习素材,或准备自己的有权使用素材。
- 核对本页对应软件或账号实际版本;Remotion 示例需要已有可运行项目。
- 保留原素材、实际参数和独立输出,不覆盖输入。
- 只做叠加层,不绘制整屏底色
- 准备棋盘格与两种底色
- 选择目标剪辑器能解码的格式
- 在自己的 Remotion 项目导出
- 在黑白两底色上检查
- 保存透明版和普通预览版
包含独立输入、模板、原创图形与 HTML 教材、验收表和离线检查;不包含外部账号或付费模型结果。
本页具体任务输入或操作模板;按步骤替换为自己的实际材料。
保留实际结果证据,默认待验证,不用人工预期填充通过。
1. 只做叠加层,不绘制整屏底色
下载 Overlay.tsx,内容是小面积圆角标题条,其余画布保持空。检查外层没有铺满不透明 background,避免透明参数正确但画面已经被黑底覆盖。
2. 准备棋盘格与两种底色
下载 overlay.svg 作为原创静态参考和 check backgrounds 教材。棋盘格只是预览方式,不应画进最终素材;最终输出不带预览棋盘。
3. 选择目标剪辑器能解码的格式
官方文档给出 ProRes 4444 的 Alpha 路径:PNG 中间帧、yuva444p10le、prores 和 4444 profile。先核对本地编辑器支持,不把普通 H.264 MP4 当透明视频。
render-command.txt
npx remotion render Overlay overlay.mov --image-format=png --pixel-format=yuva444p10le --codec=prores --prores-profile=44444. 在自己的 Remotion 项目导出
用包内命令针对 Overlay 合成导出 overlay.mov,命令需要已有可运行项目。页面尚未运行 Remotion 导出;素材里的 SVG 预览不证明 MOV 存在 Alpha。
5. 在黑白两底色上检查
把真实 MOV 分别叠在白底和深底上,标题外部必须看到下层背景,边缘不能出现黑色矩形。只看播放器黑背景无法判断透明是否成功。
6. 保存透明版和普通预览版
保留透明 MOV、普通背景预览 MP4、导出日志与项目版本。用于网页时另测浏览器解码;目标环境不支持时改普通背景版本,别承诺所有播放器都支持。
7. 下载材料并关联实际结果
先运行素材包内的 node check.mjs 检查输入结构,再完成需要账号或编辑器的步骤。离线通过不表示模型生成、外部软件导出或自然流量已经验证。
怎样确认已经完成
- 合成外层没有覆盖整屏的不透明底色。
- 真实输出在两种背景上能透出下层。
- 透明版与普通预览版的格式用途清楚。
常见问题
黑色背景就是透明吗?
不是。把素材放在白底或彩色底上看是否能透出下层,播放器默认黑底不提供证明。
为什么不直接输出 MP4?
常见 H.264 MP4 不用于本练习的 Alpha 交付。按官方支持的格式和目标剪辑器能力选择,实际叠加验证。

