企业官网建设流程全解析

• AI 插件
• dsh-plugin
• 交互助手
• 桌面应用

dsh-pet 是一个一行命令装好即用的透明动画桌面宠物，内置上百个手绘风透明动画，还支持 DIY 素材链——用 AI 视频生成绿幕素材，再经一套 Python + ffmpeg 管线加工成可在浏览器与桌面透明播放的 VP9-Alpha webm。本文完整拆解 dsh-pet 桌面宠物 DIY 素材生成链的四个核心环节：水印填充 → 绿幕抠像 → 归一化 → 转码，帮新手从零做出属于自己的透明桌宠动画素材。

素材链全景图：4 步把绿幕视频变成透明 webm

dsh-pet 的完整生态是「提示词（配方）→ 素材生成链（引擎）→ 插件（成品）」三件套。DIY 素材链负责中间这一步，目录结构清晰对应：

video/（绿幕 mp4） → step01/（去水印） watermark_step01.py → step02/（透明 webm） chroma_step02.py 或 pr_import_step02.py → step03/（归一化母版） normalize_step03.py → step04/（播放变体） encode_thumbs.py → 放入 main-animation/webm/ 即成为新动画

四个环节全部支持断点续跑（输出文件比源新且能被 ffprobe 读到就跳过），4 个视频并行处理，且脚本统一使用工作区自带的 ffmpeg，零第三方依赖。只需装好 Python 3、numpy、scipy 即可运行。

准备：用 AI 生成绿幕源视频（step00）

素材链的起点是一段 1280×720 的绿幕 mp4。dsh-pet 把 AI 视频生成的「配方」固化成了提示词文档：桌面宠物 10 秒动作提示词.md，每个动作都包含动作概述 + 按秒分割的画面分解（0-3s / 3-7s / 7-10s）。

通用前缀里有几条硬性规范，直接决定了后续管线能否顺利跑通：

• 背景必须是纯绿幕 #00FF00，无阴影、无渐变，且各视频之间色值完全一致
• 人物位置/大小固定：头顶约在画面 20% 高度、脚底约在 85% 高度，不同视频之间不允许偏差
• 安全缓冲 ≥ 10% 画幅：任何身体部位或道具不得触碰画幅边缘
• 首尾帧都是标准正面站立：这是归一化环节「按站立帧测高」的锚点

用可灵、Runway、豆包等任意 AI 视频工具生成后，按动作名各存一个 mp4 放入video/目录即可（源视频不入库，官方在 Releases 提供打包压缩包）。

Step 1 去水印：用「第 5 近背景色」填充（step01）

AI 生成的视频通常带半透明水印，直接抠像会把水印残留进透明区域。watermark_step01.py 的解法很巧妙：

1. 生成精确水印 mask：用同片段的纯黑视频比对，亮度 > 阈值的像素即水印（工具脚本 make_mask_black.py），mask 以 watermark_mask_v5.mkv 形式保存，能覆盖水印的淡入淡出过程
2. 第 K 近邻取色填充：核心算法在 fill_nn.py——用 scipy 的distance_transform_edt算出每个水印像素到「非水印像素」的最近坐标，而本项目取K=5（第 5 近）：跳过紧贴水印边缘的像素（那里往往是淡入淡出未标记的「空洞」），从更远的真背景取色
3. 输出与原视频同尺寸同帧率的 libx264（crf 18）视频，交给下一步

一句话：不重绘、不修补，只把水印像素「借」邻近背景的颜色，既快又不会引入涂抹痕迹。

Step 2 绿幕抠像：HSV 色相判定让背景透明（step02）

chroma_step02.py 是链路里算法含量最高的一步。它没有用传统 chromakey（以绿幕为中心画色差圆），而是用HSV 色相判定：

流程是逐帧管道式处理：ffmpeg 解出 rgb24 帧 → numpy 向量化转 HSV → 按判定式生成 alpha 通道（背景 0 / 前景 255）→ 转 YUV 后写回 ffmpeg 编码为 webm。

效果不佳时走路线 B：对「含第三方物品 / 透明边缘复杂」的动作，在 PR 里手工抠像、导出带 alpha 的.mov（如 ProRes 4444 with Alpha）放入pr/，再跑 pr_import_step02.py 转成透明 webm覆盖该动作的自动抠像结果——两条路线产出同级 step02，后续步骤完全一致。项目作者的实际选择是全部动作都走路线 B（PR 手工抠像更精细），chroma_step02.py保留为「任何动作一键自动」的兜底。

Step 3 归一化：统一人物身高与站姿（step03）

不同视频间哪怕只有 1% 的人物大小差异，多动画连播时也会「跳尺寸」。normalize_step03.py 做三件事：

1. 测站立基准：取首尾各 5 帧（首尾帧是标准站立姿态），用非透明像素的x 中位数定水平中心（防止手持零食等扩展物把中心拉偏）、bbox 定高度与脚底位置
2. 整帧等比缩放 + 平移：缩放到统一站立高度900px，放到2160×1215（16:9）透明画布上水平居中、脚底对齐距底 100px 的基准线——人物不裁剪，底部多出的透明空白直接裁掉
3. 写params.json：记录每个视频的缩放比例与内容并集框，方便复查「动画内容是否被裁」

Step 4 转码：母版压缩成轻量播放变体（step04）

encode_thumbs.py 把 step03 母版压成640×360、CRF 40、24fps、无音轨的播放变体。为什么要压？播放时宠物只显示约 260px，640 宽度足够清晰；全量母版 172MB 超 npm 包体积上限，转码后仅约 10MB。这是典型的双轨设计：

• thumb（step04，640×360）→ 同步进插件包，运行时播放
• full（step03，2160×1215 母版）→ 不进包，留作高清存档

附赠脚本：GIF 预览与 macOS 兼容素材

链路上还有两个「周边」环节值得知道：

• encode_preview_gifs.py：把播放用 webm 转成 GIF 预览（palettegen/paletteuse 两遍法保留透明，透明区显示为页面底色），供 README 展示——因为 GitHub Markdown 里的<video>不播放，GIF 图片语法可以
• encode_hevc_alpha.sh：Safari/WKWebView 不认 webm alpha（会渲染成黑底），macOS 用户可把 webm 转成HEVC-with-Alpha 的 .mov——ffmpeg 只负责解码出 BGRA 帧，真正的编码交给 swift 程序调用苹果原生 AVFoundation API，Safari 原生支持

放入自己的宠物：透明 webm 怎么生效

step04 产物就位后，让它进入 dsh-pet 只需要一步——往动画素材目录放 VP9-Alpha 的 .webm 文件，文件名即动作名，优先于包内素材：

• 主宠物：$DSH_HOME/dsh-pet/main-animation/webm/你的动作.webm
• 新「种类」宠物（pet pack）：pet/种类名-animation/*.webm+ 同前缀的pet/种类名-config.json，获得独立动画池与素材

放进去后在界面右键宠物 → 重载配置即可让全部桌面宠物生效，不必回设置页点保存。之后就能在右键菜单「动作」里点播你的自定义动画，多只宠物同屏时各自独立播放、互不干扰：

常见坑位清单：一次跑通的关键点

整条链的设计思路可以概括为一句话：每一步只干一件事、产物落一个目录、断点可续跑——水印、抠像、归一化、转码互相解耦，任何一步效果不满意，只需重跑该步及之后。跑通一遍，你就拥有了从 AI 绿幕视频到透明 webm 的完整 DIY 素材生成能力。

• AI 插件
• dsh-plugin
• 交互助手
• 桌面应用