readmereel 是做什么的?
你能将当前仓库转化成一个简短的开场视频。你来编写文字,脚本负责渲染视频。永远不要编写动画代码:所有场景都是固定模板。
1. 阅读仓库
首先阅读 README,然后读取包清单文件(package.json, pyproject.toml, Cargo.toml, go.mod)、docs 文件夹以及仓库中的图片文件。查找以下内容:
- 项目叫什么,以及用一句话描述它的功能
- 它解决了用户的什么痛点,用用户自己的话表达
- 它为用户做的三件事
- 用户首先运行的命令(安装或快速开始)
- 真实的截图或图表(
docs/,assets/,.github/,images/,screenshots/,以及 README 中指向仓库内文件的图片链接) - 一个 Logo(PNG 或 SVG)以及一个品牌色(从 Logo、README 徽章或 CSS 中获取)
- GitHub 地址(通过
git remote get-url origin获取)以及,如果gh可用,星标数量:gh repo view --json stargazerCount -q .stargazerCount
2. 编写 launch-video/story.json
在仓库根目录下创建文件夹 launch-video/,并写入 launch-video/story.json。路径均相对于仓库根目录。以下是字段及脚本强制执行的硬性限制:
| 字段 | 限制 | 编写方式 |
|---|---|---|
name | 24 个字符 | 与 README 中完全一致的产品名称 |
problem | 70 个字符 | 用户的痛点,而非产品本身:“所有 AI 演示看起来都一样”。目标约为 6-9 个词,便于观众阅读 |
promise | 60 个字符 | 用户获得的结果:“看起来像真人设计的幻灯片”。约 6-9 个词 |
features | 恰好 3 个 | 每个包含 { “title”, “detail”, “image” } |
功能 title | 40 个字符 | 一个结果,而非组件名称:“从不重复发送月份” |
功能 detail | 80 个字符 | 一句关于如何或为什么的普通句子,约 12 个词 |
功能 image | 可选 | 仓库中展示该功能的真实截图路径:PNG, JPG, WebP 或 SVG。动画 GIF 只显示单帧,不接受视频文件。优先选择文字足够大、在小尺寸下仍可阅读的图片;跳过那些大部分空白或不可读的图片。如果没有则留空。绝不自行创建或抓取。 |
install | 48 个字符 | 一条命令,一行,与 README 给出的完全一致;如果太长,使用最短的真实第一条命令。绝不要使用像 <your-username> 这样的占位符:使用 README 本身使用的真实示例值,例如 repoheat dashboard --user ratatui |
url | 60 个字符 | github.com/owner/repo:不要 https://, 不要 .git。将 git remote 输出(如 [email protected]:o/r.git 或 https://github.com/o/r.git)转换为 github.com/o/r |
stars | 星标数量,或 null。仅在 10 颗或以上时显示 | |
logo | 可选 | PNG 或 SVG Logo 的路径 |
accent | 十六进制颜色值,如 #0f766e;品牌色,否则留空 | |
music | 可选 | 仅当用户给你一个音频文件时(mp3, m4a, wav 或 ogg) |
endCard | 留空(true)。只有当用户要求不显示“由 readmereel 制作”字样时才设置为 false |
示例:
{
“name”: “agencyrecap”,
“problem”: “每月客户报告,手工制作并发送”,
“promise”: “每月客户报告自动发送”,
“features”: [
{ “title”: “每月品牌 PDF”, “detail”: “你的 Logo 和颜色,按你选择的日期发送给每位客户”, “image”: “docs/images/report-page-2.png” },
{ “title”: “一站式面板”, “detail”: “查看哪些报告已发出,一键重新发送”, “image”: “docs/images/dashboard.png” },
{ “title”: “永不重复发送”, “detail”: “当 Google 或电子邮件失败时暂存并重试,然后通知你” }
],
“install”: “docker compose up -d”,
“url”: “github.com/taufiquebuilds/agencyrecap”,
“stars”: null,
“accent”: “#0f766e”
}
此表中未列出的任何字段都会被拒绝,因此拼写错误会被捕获。文案规则:短词,无浮夸用语(“革命性”、“增效”、“无缝”、“解锁”),无 emoji,无感叹号,句子式大小写,数字用阿拉伯数字。每一句声明都必须是仓库中有所体现的内容。
3. 向用户展示场景并等待
在渲染之前,将六个场景以编号列表形式展示出来,并请求“ok”或修改:
- 钩子(3 秒):
problem - 标题(3 秒):
name,promise - 功能 1(4 秒):标题,详情,图片文件或“文字卡片”
- 功能 2(4 秒):同上
- 功能 3(4 秒):同上
- 安装 + 星标(7 秒):
install, “在 GitHub 上点赞”,url
4. 渲染
scripts/render.mjs 位于包含此 SKILL.md 的文件夹中。计算其绝对路径,并从仓库根目录运行以下命令:
node <此技能文件夹的绝对路径>/scripts/render.mjs launch-video/story.json
需要 Node 22+ 和 ffmpeg,如果缺少,脚本会打印如何安装。每次运行都需要访问网络:npm(HyperFrames)、一次性 Chrome 下载、Google Fonts 和 GSAP CDN。渲染需要 3-10 分钟,因此请使用至少 15 分钟的超时时间运行该命令,或者在后台运行并等待其完成。如果沙箱阻止网络,请要求用户允许,或者将上述确切命令提供给用户,请他们自己运行。
添加 --draft 参数以获得更快速、低质量的渲染,适用于用户只想快速预览的情况。
如果打印出故事问题或布局问题,请修复 story.json(缩短指定文本的长度)并重新运行。如果渲染失败,请阅读 launch-video/render.log 末尾的内容。
5. 交接
告知用户所生成的内容:
launch-video/video-16x9.mp4:适用于 README、Product Hunt、Show HN、YouTubelaunch-video/video-9x16.mp4:适用于 X、LinkedIn、Instagram Reels、TikToklaunch-video/video.gif:粘贴到 README 顶部,使用launch-video/wide/和launch-video/tall/:可编辑的 HyperFrames 项目。每次运行都会重建,因此在 HyperFrames Studio 中编辑之前,请先将其复制到其他地方(cd launch-video/wide && npx --yes [email protected] preview)
为用户提供你运行的确切绝对命令(包含其 launch-video/story.json 路径),以便他们无需智能体即可重新渲染。之后若要修改文字,他们只需编辑 story.json 并再次运行相同的命令。建议将 launch-video/wide/, launch-video/tall/ 和 launch-video/render.log 添加到 .gitignore 中。如果没有任何功能具有真实图片,请说明在仓库中添加截图可以使视频更具说服力。
