alchaincyf/huashu-motion

让你的agent一键直出商业级产品宣传片:会作曲,能指着画面改。Commercial-grade launch films by your coding agent — point at the frame to change it.

huashu-motion – AI 驱动的视频宣传片生成器

功能概述

  • 将简短的自然语言请求(例如 “为我的产品制作一个 30 秒宣传片,网站是 …”)转化为完整的、商业级的产品视频。
  • 代理首先读取产品信息,提出三个故事板方向,编写节奏/节拍表,创作音乐配乐,最后打开一个浏览器内编辑器,您可以在其中 点击 任何帧以请求精确编辑。
  • 支持全周期工作流:故事板 → 代码生成的动画(GSAP/Canvas/Three.js/SVG)→ 采样乐器音乐 → 可选配音 → 渲染/导出为 MP4、MOV(带 alpha)、WebM、GIF 或可共享的 HTML 页面。

工作原理

  1. 技能架构 – 该仓库以 Agent Skill 形式提供(兼容 Claude Code、Codex、WorkBuddy、Grok Bot、Muse、Dots 等)。安装技能(npx skills add alchaincyf/huashu-motion)会将 bin/om CLI 放入代理的技能目录。
  2. 提示到代码管道 – LLM 代理编写定义动画的 HTML/JS。所有视觉元素均由代码生成(GSAP、Canvas、Three.js、SVG);无需外部视频生成模型。
  3. 音乐生成 – 在 作曲家模式 下,代理编写 ABC 记谱法乐谱。CLI 使用真实乐器样本(如果未构建样本则使用合成声音)渲染它。12 种产品类型音乐模板库提供备用曲目。
  4. 配音与对齐 – 系统 TTS 或用户提供的音频文件可以使用 whisper.cpp 逐字对齐到时间线。
  5. 交互式编辑 – 在浏览器编辑器中按 C,点击一帧,输入评论。评论(包括时间戳、场景、元素、源代码行)通过 om inbox 发送回代理。代理仅更新受影响的代码块,并回复人类可读的摘要。
  6. 渲染 – Chrome/Chromium 实例并行渲染帧(默认最多 8 个)。FFmpeg 拼接帧并混合生成的音频。在 14 核 Mac 上,30 秒剪辑渲染约需 12-15 秒。

关键组件

  • cli/om – 命令行界面(项目创建、工作室编辑器、收件箱处理、声音工具、质量检查、渲染、导出)。
  • studio/ – 浏览器内编辑器,显示实时预览、时间线栏和可编辑属性面板。
  • templates/ – 十个入门模板(产品发布、数据驱动解说、白板、3Blue1Brown 风格等)。
  • references/library/ – 20 种精选的“运动语言”,描述不同产品类别的视觉风格,基于对 21 个真实发布视频的定量分析。
  • fonts/ – 27 种开源字体(中文粗体、衬线、展示)捆绑供立即使用。
  • runtime/ – 轻量级运行时辅助(OM.*),用于生成的 HTML 驱动动画和同步。

安装与要求

  • Node 22+、Chrome/Chromium/Edge、FFmpeg。
  • 可选:真实乐器样本包(om samples build 约 55 MB)、中文 TTS 模型(Kokoro,约 325 MB)、用于对齐的 whisper-cli。
  • 目前在 macOS 上测试;其他操作系统可能只需少量调整即可工作。

典型工作流

用户:"为我的产品制作一个 30 秒宣传片,网站是 xyz.com"
→ 代理读取网站,提出 3 个故事板选项
→ 代理编写节奏表、ABC 乐谱和完整的 HTML/JS 动画
→ `om studio` 打开可编辑预览
用户:点击帧,输入"让开场效果更流畅,专注于打字"
→ `om inbox` 传递评论,代理仅修补该代码块
→ 预览刷新,用户可以撤销(⌘Z)或直接编辑数字字段
→ `om render` → MP4/WEBM 导出

局限性

  • 视觉效果是代码生成的;不会自动创建逼真素材或 3D 模型。
  • 音乐和风格的质量取决于底层 LLM(Claude Code、DeepSeek Flash 等)。
  • 需要能够运行 Chrome 和 FFmpeg 的本地环境;不是纯云服务。

许可证 – 代码和文档采用 MIT 许可证;第三方资产保留其原始许可证(GSAP Standard、SIL OFL 字体、CC0/CC-BY 样本)。

适用对象

  • 产品营销人员或独立开发者,希望快速、可定制的宣传视频,而无需聘请设计机构。
  • AI 代理开发者,寻找一个具体的 Agent Skill 示例,连接 LLM 提示、代码生成和媒体渲染。

以上所有信息均直接取自仓库的 README。

相关

  • 项目
  • 项目
  • 项目
  • 项目