发布动效 · 架构画布v1.0.1

发布动效 · 架构画布

Agent 运行日志滚动到就绪卡片，点击后打开画布，云架构自动组装，一张已应用卡片确认变更。把每一行文字换成你的产品文案，保留浅色简洁的蓝色发布动效风格，在本机渲染一段 10.6 秒的 1080p 或 4K MP4。

画面内容

Agent 运行日志滚动到就绪卡片，点击后打开画布，云架构自动组装，一张已应用卡片确认变更。 场景时长 10.6 秒，1920×1080，柔和的浅色背景，蓝色是唯一的强调色，Logo 保持原色。

可修改的文字

插槽	默认内容	最多字符
eyebrow	Claude Code	17
headline	One prompt. A real architecture.	41
prompt	Build the backend for our new signup flow	53
step-1	Read 14 files in the app	31
step-1-meta	0.6s	10
step-2	Wrote the signup API and email worker	48
step-2-meta	+312 lines	16
step-3	Ran the test suite	24
step-3-meta	22 passed	15
step-4	Planned 7 cloud resources	32
step-4-meta	3 groups	14
ready-title	Architecture is ready	27
ready-sub	Review it on the canvas before you ship	50
cta	Open canvas	17
agent-name	Claude Code	17
agent-status	Working	13
agent-status-done	Done	10
canvas-title	AWS · Production	22
canvas-meta	7 resources · 3 groups	28
group-1	Edge	10
group-2	Services	14
group-3	Data	10
node-1	Cloudflare CDN	20
node-1-sub	Caches the signup page	28
node-2	Load balancer	19
node-2-sub	Spreads traffic	21
node-3	Signup API	16
node-3-sub	2 containers	18
node-4	Auth service	18
node-4-sub	Sessions and tokens	25
node-5	Email worker	18
node-5-sub	Welcome emails	20
node-6	Users database	20
node-6-sub	Encrypted at rest	23
node-7	Session cache	19
node-7-sub	Under 5 ms reads	22
result-title	Change applied	20
result-sub	7 resources are live in production	44
result-badge	Applied	13
result-foot-left	Deployed by Claude Code	29
result-foot-right	4 min 12 s	16

制作你的版本

1. 告诉 Agent 你要这个场景，并提供产品名、标题和想替换的文字。
2. Agent 用你的文字运行生成脚本，预览工程并渲染 MP4。
3. 检查开头、中段和结尾画面，若有换行别扭的句子就缩短后重新渲染。

运行要求

需要 Node.js 22 或更新版本、FFmpeg 和 HyperFrames CLI，全部在本地运行。