做一支讲解视频，开剪映、找素材、调字幕？这个开源技能把整条流水线塞进了代码里。不烧显卡、不调视频模型，每一帧都是 HTML/SVG 画的，ffmpeg 压成 mp4。24 种视觉风格，白板、水墨、电影预告片随便挑。
它是什么
BB-Video 不是模型，是个 Agent 技能。你手上有 Claude Code、Codex、Cursor 这类 agent，装好它，说一句话就能出片。你只选风格这一项。旁白、分镜、配音、配乐、音效、排版、质检，全交给 agent。
24 种风格已经就位，白板、孔版印刷、水墨、折纸、波普、皮影、像素、日漫分镜、电影预告片、瑞士动态排版、暗调励志……横屏 16:9、竖屏 9:16 通吃。
它做的是「用代码画画」。每一帧都是 HTML/SVG/canvas 画的、只由时间决定的画面。在无界面 Chrome 里逐帧渲染，最后 ffmpeg 压成 mp4。
原理
关键点在这儿：每一帧只由时间决定。renderFrame(t) 给一个时间 t，画面就定死了。所以渲染结果每次都一样，可以并行，agent 也能在渲染整支片子前，先偷看任意一帧的截图。改一句旁白，不用整支重渲。具体哪一帧不对，单独看那一帧就行。对长视频来说，省的是实打实的时间。
管线很清爽。旁白脚本 script.json 丢给 tts.py，出音频加逐词时间轴。画画的代码 index.html 丢给 render.mjs，Chrome 逐帧截图，ffmpeg 合成。中途自动加字幕、配乐、音效，最后再查一遍跳帧、闪帧、空放。全程没有生成式视频模型，你本机的 Chrome 就够了。
这跟 Sora、可灵那条「烧卡出片」的路子，是反着来的。
能做什么
片子分两类，讲解和宣传。
讲解最顺手。现象能讲，比如天为什么是蓝的。解题也行，直接丢题目截图。单词、概念、历史典故、操作教程、冷知识、新闻数据，它都能做成片子。白板风格就是个代表。手写字、箭头、KaTeX 公式，还有一个会说话会指的卡通人，讲完拉远成一张带编号的「知识地图」。
宣传片更绝。给一个网址，它先调研网站。文字、数字、颜色都扒下来，再截素材。最后剪一支卡拍的宣传片，用的是产品真实的界面和品牌色。比如等距微缩世界那一支。一个包裹从仓库走到你家门口，镜头跟着它走完整个系统。路线画在地面上，每一站插一张计时卡。
电影预告片那支更野。代码画太空、行星、逆光剪影，青橙调色加胶片颗粒。黑底金属字卡一张一句，最后片名砸出来。
数据类也有解法。瑞士动态排版风格把数字当成海报元素。巨型数字、条形图、新旧对比，真实截图像海报一样加标注。
水墨风格则是手卷、笔触、印章，把唐诗《登鹳雀楼》演成一支国风短片。二十四种风格不是摆设。每一种都配了一支成品样片，仓库里能直接看。
全是内置的。edge-tts 配音（逐词对齐）、字幕、代码合成的配乐音效、封面、竖屏版。渲染前，它会查重叠、查出画。渲染后，再查跳帧和空放。你用什么语言提要求，视频就什么语言。横屏竖屏一次出两张，封面也顺手生成。
怎么上手
装法就一行：npx skills add BubbleBrainBB/BB-Video。或者 clone 下来，把 skills/bb-video 拷到 ~/.claude/skills/。
没有 npm 依赖。只要 Node.js 18+、Google Chrome 或 Chromium、ffmpeg、Python 3 加 edge-tts。
用法更简单：直接跟 agent 说「用皮影戏讲刘邦斩白蛇」「给 example.com 做支发布视频，横竖都要」。agent 先给你看事实、旁白和分镜，再配音、画、渲染。成片在 videos/out/，浏览器打开 index.html 还能拖进度预览。
值不值得用
适合谁。手里有 agent、要做讲解或宣传视频的开发者、教育者、独立创作者。可复现、可版本化、不烧钱，这样的出片流程它正中下怀。
不适合谁。想要照片级写实质感，或者完全不想碰命令行的。纯代码画的视觉上限，跟真视频模型比还有差距。
但话说回来，它解决的是一类很具体的问题。你有一堆要讲的干货，又不想学剪辑，它把门槛压到「会说人话」就行。但它把「视频生成」从烧卡大模型，拽回了程序员最舒服的一条路。
代码、确定性、零 API 账单。
写在最后
视频不一定非得烧显卡才出得来。把镜头交给代码，值得你跑通试试。
