歪比巴卜 (Vibe 8b)Vibe 内容编辑器

一、产品架构与工作流 架构图 · 工作流 · WebUI

Agent 视频生成五阶段工作流

从项目策划到内容发布，全流程由 Agent 编排，多模态素材本地+云端并行批量生成。

四套模态专属工作流

除视频外，Vibe 8b 还为每种内容模态沉淀了独立工作流——共享 Trae 代码引擎，按模态特征定制流水线节点。

Trae 并非只扮演对话 Copilot，而是 Pipeline 核心控制节点（Runtime Engine）：RAG 知识库输入 → 读取 MEMORY.md 铁律规避已知冲突 → 生成声明式 Remotion/Pillow/TTS 脚本 → Node/Python/FFmpeg 本地渲染 → 二进制输出。agent-feedback.md 自检回环确保渲染异常时自动重构代码，二次生成。

WebUI 仪表盘工作台

用逐轮对话来操作 AI 做视频，相当繁琐、不精密，而且容易造成 token 浪费。本项目支持 WebUI 仪表盘工作台，支持团队协作，还可以切换不同皮肤，只需要安装浏览器插件以及接入 API，就可以在网页上指挥 Agent 干活。

① AI Content Studio — 4 卡片式工作流（公众号 Markdown / 数据视频 / 播客音频 / 交互网页）+ 底部 Remotion + TTS 多轨时间线 + RAG 提示词与边界设定

② AI Multimodal Studio — 节点式工作流（RAG → TTS → Pillow 画图 → Remotion 视频 → 音频混音）+ 实时 FPS / 显存 / CPU 监控 + 批量渲染队列

③ Local AI Content Generator — 左侧 Skill 模板库（图文设计 / 视频 / 音乐 / 代码 / 文档生成）+ 本地文件拖拽区 + 右侧 Terminal 实时显示 agent-feedback.md 自检日志（环境检查 / 字体问题修复 / H.264 透明通道修复 / BPM 配乐节拍校验）

三种 WebUI 形态，覆盖不同使用场景：① Content Studio 适合"非技术创作者"——4 卡片拖拽即生成；② Multimodal Studio 适合"重度数据/视频作者"——节点连接+实时监控，专业级生产工具；③ Local Content Generator 适合"AI 工程师"——代码生成+终端自检，零障碍接入 Vibe 8b 的能力底座。

二、项目概述 我们是谁 · 解决什么问题

我们是谁

歪比巴卜（Vibe 8b）是一个 Harness Agent 通用的多模态内容生成框架。不需要账号注册，不需要上传素材到云端——所有渲染在本地完成，隐私可控。核心理念：用代码生成驱动内容生产。基于 Trae 工作流，以 Remotion 4.x / Pillow 逐帧 / HTML 交互为渲染底座，覆盖图文、文章、播客、视频、交互网页等多种内容形态。

面向谁

需要快速把原始数据、知识库、脚本变成多平台适配内容的内容创作者与编辑——有选题有素材，但缺一条从策划到发布的全自动多模态生产线。核心用户：自媒体/新闻创作者、播客制作者、数据新闻编辑、内容 MCN 运营。

主要能力

效能对比：传统人工 vs Vibe 8b 自动生成

真实市场验证 · B 站爆款案例

该类型内容自 3 月份上线 B 站以来，经常占据热门榜单。其中视频《我一点也不用对福建杨梅果农感到抱歉》事件第二天就发布，达到 360 万播放——证明"知识 + 实时热点 + 数据可视化叙事"这条内容路径有真实可验证的市场需求。

该内容形式解决了过去知识类视频内容随机匹配动态内容仅白噪音的作用。如果做"回形针"类数据可视化，虽然知识密度高了，但后期成本又很重——单条视频动辄 1-2 周制作周期，跟不上热点。

B 站视频页实拍 —《我一点也不用对福建杨梅果农感到抱歉》 · 360 万播放 · 1.3 万弹幕 · 32.8 万点赞 · 9.4 万投币 · 4 万收藏 · 2026-05-23 上线 · 3 人正在看 · "明年还会有更多的人加入泡药行列" · 视频节点式叙事（循环罢了 → 猪栏必须改正 → 新青年学生 → 黑商得利 → 暴利诱惑 → 更多入局者 → 违规泡药蔓延）

三、创作思路 灵感 · 痛点 · 方向

灵感来源

我是一名内容制作人，长期和数据、多模态内容打交道。痛点很真实：把一份数据变成一条能在抖音跑量的视频、再变成一篇公众号文章、再变成一集播客——传统流程是"Excel 整理 → AE 手 K 动画 → 剪映配乐 → 手动写稿 → 单独录音 → 前端写页面"，一套完整的多模态输出至少需要跨 4-5 个工具链 + 多次格式转换。而内容的核心价值在"叙事准确 + 节奏到位"，不在"工具切换"。我想把"原始数据 + Trae 代码生成能力 + 多模态美学"结合起来，使一条 pipeline 同时输出五态内容。

想解决的问题

为什么做这个方向

学习工作赛道的核心是"真实生产力价值"。多模态内容生产是内容创作者每天都要干的重活——痛点都是我亲自踩过的，不是为参赛虚构。4 个 Skill 可跨主题复用，换数据源就能产出新内容，可延展性强。

Prompt 哲学 — 用户视角是导演

总体创作思路是：先定目标再补边界。我们希望的用户视角是导演。不论是创作视频还是什么，如果想追求更真实、更具创意，提示词越少越好，放手大胆交给 AI 去创造，束缚太多反而适得其反。

改变 Prompt 的使用方式——少讲复杂咒语或者乱七八糟的 skill，多让团队成员把目标、上下文、格式和限制写清楚，然后通过追问迭代。

一句短 prompt 往往就够了。任务更大或更重要时，把关键的几块信息带上：

四、多模态产出示例 5 种模态 · 7 个真实案例

以下展示一个完整的多模态产出案例：「Claude 防封号指北」——以同一份知识库数据为底，一次编排产出图文 / 交互网页 / 视频 / 播客四种模态。

① 文章 / 图文 · 公众号版

基于同一份 RAG 知识库生成的公众号长文。文章地址：https://mp.weixin.qq.com/s/CLq5U8Es548y_JLTWWiwzQ

文章封面 · 公众号版 — "实战指南" 标签 + 主标"Claude 防封号"+ 副标"风控模型 · 养号 SOP · 应急申诉全流程"

文章由 Vibe 8b 阶段 2「文案/脚本撰写」节点直接生成，Markdown 格式，公众号平台粘贴即可发布。

② 交互网页 · 9 段动态演示

同一份数据驱动的可交互数据可视化，含 9 段动态演示 + 关键数据指标。公网链接：https://72e3378afc2c441195e753febf8eded4.app.codebuddy.work

交互网页封面 — "做个正常人就不会封号"+ 4 个核心数据卡（145万被封 / 3.3% 申诉成功率 / ~30 天养号周期 / $20 Pro 起步）

由 Vibe 8b 阶段 3「网页生成」+ 阶段 4「网页合成」节点产出，纯 HTML+JS，可部署到任意静态托管。

③ MG 视频 · Bilibili 完整版

同一份数据生成的 9 段动态演示视频，已上传 Bilibili。视频链接：https://www.bilibili.com/video/BV1pRN26SEW8/

视频封面 — 同款"实战指南"封面风格（视频版竖屏排版）

由 Vibe 8b 阶段 3「视频生成」+ 阶段 4「视频合成」节点产出，Remotion 4.x 渲染，H.264 编码。

④ 播客 · 实战指南音频版

同一份 RAG 知识库，改走播客模态二次产出——四态同源。多角色 TTS（主持 + 风控解读员），BGM 随话题切换（养号期/高压期/申诉期三段情绪）。流程：生成素材库 → 润色脚本 → 选择声音与音效 → 点击生成。

公网链接：3000-8e673ce008934868b658deef29c132b7.e2b.ap-beijing.sandbox.cloudstudio.club（内嵌 HTML5 音频播放器）

播客封面 — "Claude 防封号" 实战指南 · Anthropic 风控模型 · 养号 SOP · 应急申诉全流程 · 4.4 MB MP3 / 96 kbps / ~5 分钟

由 Vibe 8b 阶段 2「配音生成」（TTS 多角色 + 音色克隆）+ 阶段 3「BGM 智能混音」+ 阶段 4「音频后处理」节点产出，MP3 导出。

案例 2 · 金银岛 RPG 冒险大转盘游戏

「拆解任意内容」是 Vibe 8b 的核心能力——一段文字、一个故事、任何叙事载体都能被拆解为多种模态产品。本例展示把经典小说《金银岛》拆为「notebooklm 式有声绘本 + RPG 冒险大转盘游戏」：可以和朋友一起大冒险，也可以录制游戏解说视频。该类型视频在抖音等平台 最高可达几十万点赞。

① 首页 · 路径选择 + 角色主线

玩家在三条主线中二选一：英雄线（EPIC 20 节点） / 反英雄线（DARK 18 节点） / 黑色幽默线（HUMOR 14 节点）。每条线对应一种叙事风格和角色走向，3 关键抉择决定结局。

首页 · 路径选择 — "如果你是 Jim Hawkins，每一步你怎么选？"+ 三条主线卡片

② 大转盘 · 战斗 + 抉择

核心玩法：转盘转动 → 随机触发事件 → 状态面板（财富/忠诚/名誉/技能/阵营）实时更新。HTML5 Canvas 自实现转盘动画，无 Winwheel.js 等外部依赖，单文件即可运行。

大转盘 — 状态面板 5 维属性条 + 蓝/灰扇区 + 中央"转动"按钮 + 稀有选项卡（退役海军孤儿）

③ 知识图谱 · D3 力导向布局

把整本《金银岛》55 节点、104 条关系线用 D3.js v7.8.5 力导向 渲染成知识图谱：人物 / 事件 / 地点 / 概念 / 势力 5 类节点分类上色，点击节点展开详情。

知识图谱 — 5 类节点（人物/事件/地点/概念/势力）+ 5 类边线 + 中心"吉姆·霍金斯"辐射全图

案例 3 · 哈基米体型 TOP10 · 猫科战力排名图文

人工智障做的猫科战力排名——从狞猫到西伯利亚虎，用同一份猫科体型数据同时产出图文和视频两种模态，图文可做抖音/小红书竖屏长图，视频可发抖音。视频点赞量 26.4 万。

猫科战力排名 TOP10 — 点击图片跳转抖音视频 · 狞猫 / 巴西种群 / 南非云豹 / 喜马拉雅 / 西伯利亚猞猁 / 帕米尔雪豹 / 南非猎豹 / 波斯豹 / 潘基山美洲金猫 / 潘塔纳尔美洲虎 / 阿特拉斯狮 / 西伯利亚虎 · 26.4 万赞

案例 4 · 全球信仰体系变迁 · 三态同源

同一份 1925-2025 全球宗教人口数据，一次编排产出公网网页 + 抖音视频两种模态。网页含 1978 时间轴滑块 + 10 大宗教排名 + 详情卡 + 家族分类 + 世界地图分布；视频版含倒计时 + 排名轮播 + 关键数据角标。

交互网页 — "全球宗教发展史 1925-2025" · 1978 年时间轴 · 10 大宗教排名 · 家族分类 · 世界分布地图

抖音视频 — "百年信仰变迁 1925-2025" · 罗马天主教 4.1 亿领先 · 1946 年定格 · 408 赞

视频内帧 — "百年信仰变迁 · 1925-2025 宗教人口排名" · 印度教 25 亿居首 / 伊斯兰教 18 亿 / 天主教 15 亿（百年增速 +14.1%）

案例 5 · 与鱼龙同游 · 史前生物科普交互网页

基于史前生物数据，用 Vibe 8b 阶段 3「网页生成」+ 阶段 4「网页合成」一次性产出海洋探险交互页：起源·演化·起源·力学·市场·格局 五主题，"第三盛世 - 2.5亿年前 · 覆盖全球海洋 · 6%演化阶段 · 8种推进模式" + 3D 鱼龙渲染。

与鱼龙同游 — 第一种登陆地球的巨型生物 · 统治地球 1.5 亿年 · 3D 鱼龙 + 星空背景 · "开始探索"入口

案例 6 · 世界杯历届进球数 · 双版本视频

同一份 1930-2022 世界杯 22 届 964 场 2720 球的数据，一次编排产出两种视频版本：① 完整版（深色主题，多届累计 2148 球）② 单届聚焦版（浅色主题，1969 单届 773 球）。

完整版 — 1930-2022 累计 2148 球 · 巴西 236 / 德国 229 / 阿根廷 144 · 2022 卡塔尔冠军阿根廷

单届聚焦版 — 1969 墨西哥 · 累计 773 球 · 巴西 96 / 西德 68 / 匈牙利 70 · 第 9 届历史瞬间

案例 7 · 世界杯 TOP10 强国 · 旗舰作品

6 个数据新闻项目里完成度最高的旗舰作品——1930-2022 共 23 届世界杯 TOP10 强队累计积分折线动画 + 13 国人均年收入对比。1080×1920 竖屏 30fps 60s MP4，含中国彩蛋、缺席届虚线、Year flip card、Event card 同步推进等所有机制。

1994 / 第 15 届 / 美国 — 巴乔罚失点球 · 巴西 24 年后再夺冠 · 巴西 15 次 / 德国 13 次 / 意大利 13 次 / 阿根廷 15 次 · 折线生长 + 人均收入对比

五、TRAE 实践过程 Session ID · 截图 · 赋能节点

整个项目从架构设计、渲染脚本、BGM 合成、自检机制到多轮迭代，均由 TRAE 辅助完成。

关键任务 Session ID（不少于 3 个）

开发关键步骤截图（不少于 3 张）

截图 1Claude 防封号指北：TRAE 读取记忆后 9 段脚本 + agent-feedback.md 子 Agent 系统性错误清单
含 7 项硬规则（ffmpeg 临时文件 / 描边起点 / font.getbbox 偏大 / draw.text y 是 baseline 非 top-left / mask bbox / 描画不 paste 纯绘 / 链接不可靠）

截图 2金银岛 RPG 项目交付：TRAE Work 一次性产出 195.4KB 单文件 HTML 应用，6 项功能验证全部通过
含 路径选择 / 钩子弹窗 / 转盘旋转 / 选项卡片 / 状态面板 / 知识图谱 / 结局展示

截图 3世界杯总进球数视频生成：TRAE Work 14m17s · 两轮渲染迭代
首轮 1440×2560 / 60fps / 35551778 字 → 二轮 y=280→y=1150 优化竖版布局（870 帧 / 35128897 字）+ TTS 转录文案生成

开发关键步骤已展示 3 张实际 TRAE Work 对话截图，覆盖视频与交互网页两个主力模态。

TRAE 在关键节点的赋能

① 识破并规避 BGM 策略混用：宗教排名项目第一版 BGM 用了 120 BPM 卡点，但折线是连续平滑动画，混用导致 3 轮迭代浪费。TRAE 在后续项目启动时主动读取 MEMORY.md 铁律，建议改用 ambient + 5 个 highlight cue，直接跳过踩坑阶段。

② 用 numpy 扫描像素替代 font.getbbox：Pillow 的 font.getbbox 对汉字偏大 50+px。TRAE 设计 _element_bbox 函数用 numpy 扫描非透明像素，彻底解决布局自检不准的问题。

③ 定位 H.264 alpha 噪声过滤：视频出现 X 框但 PNG 单帧正常。TRAE 定位到 alpha < 255 被当噪声过滤，建议入场动画 alpha 始终保持 255。

④ 指令理解失误的教训沉淀：v12 时 TRAE 把"仅调换"过度发挥成"换数据源"，整版作废白渲染 1800 帧。复盘后提炼"用户原话是契约，'仅 X' 是边界"写入 MEMORY.md。

六、体验验证清单

• 体验页 tab 产品架构：SVG 架构图清晰展示三种形态 + 六项核心能力 + 五种内容模态
• 体验页 tab WebUI 工作台：三种 WebUI 形态（Content Studio 卡片式 / Multimodal Studio 节点式 / Local Generator 终端式）覆盖非技术创作者到 AI 工程师全角色
• 体验页 tab Agent 工作流：视频五阶段流程图完整 + 文章/图文/交互网页/播客四套模态专属工作流，节点和箭头对齐，阶段 3 并行节点可见 8 种素材生成
• 体验页 tab 多模态产出：七个真实产出案例（图文 / 文章 / 播客 / 视频 / 交互网页）覆盖 5 种模态
• 图文 demo 可打开 AI 行业增长报告（ECharts 交互图表离线可用）
• 交互网页 demo 可打开 React 论文评阅仪表盘
• Claude 防封号指北案例 4 tab 可切换：文章/图文 · 交互网页 · MG 视频 · 播客（公网链接，HTML5 音频播放器）
• 能力底座 Trae 代码引擎 + 四个 skill 完整列出