mcpField
A
alpha-cutout

alpha-cutout

github.com/moh4696创意与媒体377214 次安装5 天前更新
代码仓库

关于 alpha-cutout

alpha-cutout 通过让主体置于纯色背景板上拍摄，再逐帧去除背景，制作透明视频和图像素材。它面向需要将动画主体合成到网页设计中的创作者，支持播放和滚动控制所需的多种输出格式。

主要功能

  1. 01选择抠像背景颜色
  2. 02逐帧去除背景
  3. 03导出叠层 MP4、透明 WebM 或图像
  4. 04用 canvas 播放叠层透明视频
  5. 05在多种背景上检查抠像效果

适用场景

  1. 01将角色合成到网页中
  2. 02制作透明循环视频素材
  3. 03创建用于滚动控制动画的帧

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/moh4696/open-3d-skills --skill alpha-cutout

安装后在 Claude Code 中输入/alpha-cutout确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

agents/
openai.yaml
assets/
alpha-video.js
scripts/
key.py
plate.py

详细介绍

Alpha 抠像

图生视频模型永远不会返回 alpha。一个应该站在巨型标题和太阳圆盘之间的角色，或一个应该悬浮在页面上的瓶子，都需要逐帧移除背景，而且要足够干净，确保在任何页面颜色上都不会出现边缘杂色。这个技能采用电影工作室的做法：让主体置于纯色背景上拍摄，然后逐帧提取遮罩。

工具

文件功能
scripts/plate.py将抠出的主体放置在留有顶部空间的色键底板上；挑选与主体冲突最少的键色
scripts/key.py将视频片段或静帧抠像为堆叠式 MP4、VP9 alpha WebM、RGBA WebP 帧或 PNG
assets/alpha-video.js在 canvas（WebGL）上播放带透明度的堆叠 alpha MP4，并提供用于拖动预览的 seek()

需要 Python 3.9+、pip install numpy opencv-python-headless pillow，以及 PATH 中的 ffmpeg。

流程

  1. 从静帧中抠出主体。 任何背景移除工具都可以。检查它漏掉了什么：细小物体（空中的球、球拍线、头发）经常会消失。手动把它们补回来。

  2. 制作底板。

    python3 scripts/plate.py subject.png plate.png --size 1350x1800 --fit 0.8

    脚本会报告主体与洋红色、绿色和蓝色键色接近的部分各占多少，并挑选最干净的颜色。通常洋红色最合适：皮肤、衣物、产品或植物中几乎没有纯洋红色。绿色对植物和绿色产品无效；蓝色对牛仔布和天空无效。主体特意以硬边贴上去：与底板颜色预先混合的柔边会让模型学着画出杂色边缘。

    为动作留出空间。发球需要头顶上方有空间；转身需要侧面有空间。让底板的宽高比与视频模型的输出宽高比一致，以免画面被裁切。

  3. 在底板上生成。 将底板用作起始帧（要制作无缝循环时也用作结束帧；参见 motion-assets）。提示词必须提到底板，否则模型会自行编造背景：

    背景必须保持完全平坦、均匀、纯色的色度键洋红色（精确 RGB 255, 0, 255），并填满整个画面；不能有阴影、地面、渐变、暗角或场景。相机固定不动。

    提示词的作用胜过图像。 如果提示词中残留“白色背景”，无论底板是什么，生成的都会是白色背景。每次编辑后都要重新检查提示词。

  4. 进行抠像。

    python3 scripts/key.py clip.mp4 --png check/ --frame-list 0,40,80,120   # inspect first
python3 scripts/key.py clip.mp4 --stacked hero-1080.mp4 --width 1080
python3 scripts/key.py clip.mp4 --stacked hero-720.mp4 --width 720      # phones
python3 scripts/key.py clip.mp4 --frames serve/lg --width 960 --start 0 --end 78

    --png 会输出每帧测得的底板颜色。模型会让底板颜色产生漂移：纯洋红色可能在中途变成浅粉色（250, 178, 243），而主体仍保持原有颜色。因此，键色会从每帧自身的边框中逐帧测量，而不是只设置一次。如果主体接触顶部边缘，测量就会出错，脚本会提示这一点。

    随后逐像素处理：alpha 根据像素键色超出底板颜色的程度计算，边缘像素会与底板颜色反混合（F = (C - (1 - a) K) / a），残留的溢色会被限制。反混合很重要。普通色键或向中性色夹取，会把洋红色边缘混合色变成棕褐色；在白衬衫上看起来就像鲑红色轮廓。反混合则能还原真实的边缘颜色。

  5. 在三种背景上检查：近黑色、页面的浅色，以及品牌中最鲜艳的颜色。合成 --png 输出，并以 100% 和 400% 缩放查看边缘。重点检查头发、手指、细小道具、运动模糊，以及底板漂移最严重的那一帧。

修复

现象处理方法
主体周围有一圈细细的轮廓使用 --erode 1（很少需要用到 2）。模型将边缘复制到了图像中
亮部或闪亮部位出现孔洞该颜色与键色太接近。换用其他键色重新生成（plate.py --key）
整个背景泛粉色或绿色色板渐变比平时更强；检查测得的色板颜色，并略微调高 --solid
片段中途某个细节变了颜色（帽子变成绿色）这是模型漂移，不是键控故障。为这些帧中的该色相重新着色，或重新生成
压缩后主体周围出现彩色线条已处理：透明像素下的颜色是向外延展的主体自身边缘色，因此色度子采样没有外部颜色可供渗入。--fill 只设置远离主体处的颜色

选择哪种输出

输出可播放平台适用场景
--stacked MP4 + assets/alpha-video.js所有浏览器，包括 Safari 和 iOS循环播放的主视觉、角色，以及任何需要播放的内容
--webm VP9 alphaChrome、Edge、Firefox。不支持 Safari无需支持 Safari 的普通 <video> 标签
--frames WebP 序列所有平台滚动控制的动画（参见 scroll-film）：每个滚动位置对应精确的一帧，无寻帧延迟

堆叠式 alpha 会将帧高加倍（上方为颜色，下方为蒙版），再通过着色器将两者重新组合，因此它是普通 H.264：可在所有设备上通过硬件解码，文件大小约为纯颜色视频的 1.3 倍。提供两种宽度（1080 和 720），并根据视口选择。

import { AlphaVideo } from "./alpha-video.js";
const hero = new AlphaVideo(document.querySelector("canvas.hero"), innerWidth > 900 ? "hero-1080.mp4" : "hero-720.mp4");
hero.onready = () => document.body.classList.add("hero-ready");
function frame() { hero.draw(); requestAnimationFrame(frame); }
requestAnimationFrame(frame);

播放器会在离开屏幕时自动暂停，并且只有视频画面前进后才会上传纹理。若要进行滚动控制，请使用 { loop: false, autoplay: false } 创建播放器，并在滚动处理程序中调用 hero.seek(seconds)。

请从支持 HTTP Range 请求的服务提供视频（frame-capture 技能中的 serve.py 支持；python3 -m http.server 不支持），否则无法寻帧。

减少动态效果

当 prefers-reduced-motion: reduce 生效时，显示一张去除键色的静帧（使用 --png 导出合适的帧，再转换为 WebP），而不是循环播放。

评论

支持 Markdown