Communitygithub.com

蒙太奇编辑器

将说话人视频(9:16 Reel、TikTok、Shorts 或付费广告)编辑成动感十足的动态图形剪辑——全屏面部镜头与“面板”交替出现,说话人缩小到底部卡片中,头部弹出,同时品牌宪章中的动画图形(官方 Logo、网站截图、聊天/电话模拟图、功能卡、Logo 揭晓)在上方播放——加上字幕、背景音乐、音效、推进/拉远镜头;然后打开一个本地的类 CapCut 编辑界面(场景列表、实时预览、每个动画的时间线、字幕、语音/音乐/效果轨道),用户可点击任意元素留下评论,由 Claude 处理。当用户发送说话视频要求“添加动态图形”、“为客户制作”、“作为广告”、“像产品演示那样”,或要求“编辑界面/时间线”、“调整音量”、“评论某个动画”时使用。

蒙太奇编辑器 是什么?

这个技能旨在将一段说话人视频(例如 TikTok、Reels 或普通广告素材)转变为专业的动态图形剪辑。它通过严格的分步工作流实现:首先预处理视频(人脸分割、文字转录),然后根据品牌宪章生成动态图形(官方 Logo、网站截图、自定义动画),最后组装成包含字幕、音效和背景音乐的完整视频。该技能的核心特色是其集成的本地编辑器:渲染完成后,它会启动一个类似 CapCut 的交互式界面,用户可以通过点击预览中的任何元素来“评论”它,从而精确控制动画、音量、字幕或场景顺序。Claude 会处理这些评论,自动修改底层代码(JavaScript 配置、JSON 文件)并重新构建预览。该技能严格遵循品牌规则(仅限官方 Logo、禁止编造数据)、广告安全区约束(顶部/底部留白)以及面向专业人士的 12 步工作流,确保输出符合行业标准的视频。它通过 Node.js、Python 和 bash 脚本与本地系统交互,支持多种语言(包括从右至左的阿拉伯语)。

兼容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/hakunadigitalpro-png/montage-editeur/tree/HEAD

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

动态图形剪辑 + 编辑界面

用用户的母语与用户交流。字幕必须使用说话人的原话(绝不转述)。

路径:ME = 本技能文件夹,W = 每个视频一个项目文件夹。所有脚本为 bash/python/node;scripts/env.sh 查找 ffmpeg、node、python、Chrome 和捆绑的引擎(engine/)。首次使用:参见 README.md → 安装(在技能文件夹中运行 npm install,pip install -r requirements.txt)。

规则(不可协商)

  1. 仅限官方 Logo:对于提及的任何品牌,一律使用其官方 Logo——绝不使用重新绘制的“灵感”图标。从品牌网站获取(capture_site.js)或询问用户。
  2. 品牌宪章:对于客户项目,从客户网站(captures/info.json)读取颜色、字体和 Logo,并在 parts/top.js 顶部写入调色板。对于用户自己的视频,询问一次其品牌宪章,然后保存在 theme.json + top.js 中。
  3. 网站截图:截取客户网站(完整页面,桌面端 + 移动端),并在面板中使用(滚动浏览器、裁剪后的官方插图)。Cookie 横幅必须隐藏,绝不接受。无法访问已登录的产品页面:告知用户,并提供集成用户提供的截图。
  4. 节奏:全屏 ↔ 面板(拉远镜头进入,推进镜头退出),在重音词上推进(大约每 2-3 秒一次),恰好一个标志性时刻(Logo/名称揭晓),背景音乐在语音下方压低,音效(每次缩放时的呼哨声、弹出声、点击声、打字声、揭晓时的冲击声),跳切时的闪光。
  5. 付费广告:顶部 14%(y < 270)和底部 y ≈ 1250 以下(Reels/TikTok UI)不要放置重要内容;字幕抬高(CAPDY);面板内不放字幕(面板将文字显示为标题);片尾卡 = 品牌 Logo + URL + 说话人的话;不得编造声明或数字。
  6. 字幕决不可遮盖面部。从左到右语言 → projet.json 中的 "sens": "ltr"(构建工具会修正词序);从右到左(阿拉伯语)→ "rtl"。品牌名称显示为药丸(fx: "pill",颜色在 projet.json → pill 中设置)。
  7. 混音:用户在编辑器中设置语音/音乐/效果。默认值:语音 100%,音乐 46%,效果 36%。始终将响度标准化至 -14 LUFS。
  8. 每个动画都是一个注册表元素(见下文),以便用户可以选择、移动、隐藏和评论它。注册表外不允许有动画。
  9. 锚点:每个 wS(card, word) 必须指向该动画所说明的词——运行 scripts/ancres.py 并读取表格;绝不猜测索引。

工作流

  1. 准备:bash $ME/scripts/preparer.sh <video> <W> <lang> "<Whisper 提示:专有名词>" → 复制源文件、全帧裁剪、帧、可能的切点、逐词转录。然后对背景中的人物进行抠像(约 1 秒/帧;不要同时运行 Whisper——会占用过多 RAM):python $ME/engine/mask.py u2net_human_seg <W> && python $ME/engine/make_head.py <W>。
  2. 客户(如果有):node $ME/scripts/capture_site.js <url> <W> → captures/、assets/logo-*.png、颜色/字体。查看截图;将有价值的视觉元素裁剪到 W/assets/ 中(插图、长页面用于滚动浏览器)。
  3. 字幕:编写 W/cartes.json(原词 + Whisper 时间戳;每张卡片 2-5 个词;hot、fx)→ python $ME/scripts/cartes.py <W>。模板:templates/cartes.EXAMPLE.json。
  4. 编辑计划:将脚本分成若干节拍(钩子、问题、产品、证明、行动号召……),为每节拍选择:全屏或面板、要展示的具体对象、一个标志性时刻、音效。编写 W/plan-montage.md(模板 templates/plan.EXAMPLE.md)并在制作动画前简要展示给用户。
  5. projet.json(模板 templates/projet.EXAMPLE.json):nom、titre、langue、sens、outro、vol、musique_gain、pill、coupes、cadrage(进入面板的镜头 → 测量窗口)、cadrage_force(如果蒙版捕获了背景)。然后 python $ME/scripts/framing.py <W>。
  6. 场景在 W/parts/ 中:top.js ← templates/top.EXAMPLE.js(调色板、CUTS/SEGB、PANELS、缩放 ZP、CAPDY);primitives.js ← templates/primitives.js;gfx.js ← templates/gfx.EXAMPLE.js(SCENES_ED,每个动画一个 EL(...),图层,片尾卡,字体)。
  7. 音效:W/sons.json(模板 templates/sons.EXAMPLE.json):musique {bpm, intro_filtree, coupure = 揭晓前的静音, accords} 和 events = [element|null, time|"fin+x", "sound[:param]", gain, [repeat, step]]。音效:pop, bulle, clic, shutter, succes, buzz, tick, touche, impact, tape, whoosh_in:dur, whoosh_out:dur, ding:freq:dur, shimmer:dur, riser:dur, souffle:dur。将每个音效链接到其元素,以便在移动或隐藏元素时音效随之调整。
  8. 锚点:python $ME/scripts/ancres.py <W>。
  9. 预览:python $ME/scripts/build.py <W> 然后 node $ME/engine/04_render_frames.js <W> preview t1 t2 … → 联系表 → 像苛刻的编辑一样审查(可读性?面部清晰?广告安全区域?),修复后再渲染。
  10. 渲染:bash $ME/scripts/rendu.sh <W>(后台运行,3-6 分钟)→ <nom>.mp4(+ .srt/.txt)、mixage/pistes/ 中的分轨音频、编辑器媒体文件。检查 MP4 的 6-8 帧、-14 LUFS、文件大小。
  11. 编辑器:运行 python $ME/scripts/editor_server.py <W> <port>(在 Claude Code 桌面版中:将其添加到 .claude/launch.json 并使用预览工具),打开 http://localhost:<port>/editeur/。验证预览、点击选择和播放功能是否正常。
  12. 查看评论:监控 W/comments.json,每个新评论(status == "à faire")输出一行(命令在 references/editor.md 中)。

处理评论

  1. 读取评论(target = el:<id> | scene:<id> | cap:<n> | audio:<track>,t,点击坐标 x、y)。
  2. 将状态设置为“处理中”:POST /api/comments/status {"id":…,"status":"en cours"}。
  3. 修改 parts/gfx.js 中的元素(或 top.js 中的缩放/面板、cartes.json 中的字幕、sons.json 中的音效),保持在品牌宪章和元素注册表范围内。如果请求模糊,应用最佳选项并在回复中提及替代方案。
  4. python $ME/scripts/build.py <W>(如果音效改变,则加上 sons.py)→ 编辑器会自动重新加载预览。检查 1-2 个预览帧。
  5. 状态“已完成”+ 简短的 reply(说明更改内容)——显示在编辑器中。提醒用户可以点击“渲染视频”。
  6. 通用偏好(“我永远不想要 X”)→ 将其添加到此文件的规则中。

元素注册表(与编辑器的契约)

EL(id, name, scene, layer, [x,y,w,h], ()=>[start,end], t=>{…draw…})

  • layer:'panel'(在面板内部绘制,位于弹出头部后方)· 'full'(全屏,位于前面)· 'none'(全局:闪光、片尾卡)。
  • 接收到的 t 是编辑器调整后的时间(EDITS.off);仅在自己的时间窗口内绘制;如果 EDITS.hide[id] 则隐藏。
  • 框 [x,y,w,h] 用于在预览中点击:请保持准确。
  • SCENES_ED = 编辑器左侧列出的场景(id、label、a、b、kind)。
  • 缩放:每个 ZP 条目对应元素 zoom<i>(可在编辑器中删除)。

项目文件

projet.json · cartes.json → caps.json(caps.orig.json = 编辑器基准)· sons.json · parts/{top,primitives,gfx}.js · framing.js · edits.json(编辑器设置:偏移、隐藏、字幕、音量)· comments.json · captures/、assets/ · mixage/pistes/ · editeur/ · <nom>.mp4/.srt/.txt。

相关技能