来源:绿屏键控示例
原始样本·MP4·4秒·移动主体,边缘柔和
该示例移除其绿色背景,并选择 WebM 格式。在不同的背景下预览导出视频,以检查浏览器中的透明效果。
试试这个示例问题
在网页上,透明视频仍然存在问题。MP4 得到广泛支持,但在常规浏览器播放中不支持 alpha;GIF 也可以支持透明效果,但仅限于硬边。
Alpha WebM 可以容纳原生视频元素,但透明度需要在导出和播放过程中都得以保留。在导出前,显示棋盘预览只是初步检查。
对于生成的简短的 AI 绿幕片段,最快速的方法通常是在浏览器中直接进行键控和编码。
浏览器工作流程
EasyLottie 本地解码 MP4/MOV/WebM,应用 WebGL 颜色键,并在浏览器支持时,记录带有 alpha 的 VP8 WebM。
该工具检查 WebM 录制支持,并禁用已知的不支持的路径,包括 Firefox。 导出的视频仍然需要在您计划支持的浏览器中进行播放检查。
如果 WebM 格式不适用,相同的 keyed 结果可以导出为 Lottie ZIP、透明 GIF,或 PNG 序列。
完成任务
使用 Chromium 浏览器
开始使用基于 Chromium 的浏览器。该工具会检查所需的录制 API,并禁用已知的不支持的导出路径;测试在您的目标用户使用的浏览器上的 alpha 播放。
删除 MP4 或 MOV
上传一段绿幕或纯色背景的视频片段。
拉出关键
对背景采样和容差、柔化、去溢出和堵塞进行调整。
选择 WebM
选择透明 WebM 输出,并设置尺寸、帧率和质量。
下载并测试
导出 WebM 并在目标页面背景中进行测试。
常见用例
着陆页循环
使用 Alpha WebM,可在 Chromium 偏多的受众中,实现平滑的透明英雄或功能片段。
AI 视频叠加
将生成的“主体在绿色”片段转换为一个位于产品UI顶部的叠加效果。
原型资源
在投入生产动画流程之前,创建透明动效片段,用于实验。
常见问题
为什么选择透明的 MP4?
标准浏览器 MP4 播放无法可靠地保留 alpha。 WebM 采用 VP8 alpha 格式,是 Chromium 浏览器上的实用格式。
为什么在 Firefox 中禁用 WebM 格式?
此工具在 Firefox 中禁用其 VP8 预览路径,因为该流程可能会导致透明度丢失。请选择其他输出,或使用支持 Chromium 浏览器的浏览器。
Safari 是否可以播放透明的 WebM 格式文件?
Safari 的支持不可靠。对于依赖 Safari 的用户,建议使用 PNG 序列,或评估其他交付方式。
是否已上传任何内容?
编号:解码、密钥和编码在浏览器中本地运行。
我可以从同一个文件中导出 Lottie 吗?
是的。您可以将输出切换到 Lottie ZIP、透明 GIF,或 PNG 序列。