model-showdown

模型对决：同一份简报，三个 AI

一场人人都能亲自验证的公平测试。同一份简报，三个模型，各自首次尝试，使用同一个渲染器。

**开始之前：**如果存在，请先阅读 brand.md 和 MOTION.md。如果没有，请先运行 brand-intake，或询问十六进制颜色代码、字体和徽标文件。没有这些信息，绝不要说结果符合品牌规范。品牌规范适用于标题和标签，绝不适用于模型的输出。

第 1 步：询问四件事，然后等待

1. **简报，**逐字提供。每个模型收到的文本必须完全相同。
2. **三个模型，**名称必须与其制造商的写法完全一致，并说明用户如何访问每个模型（只能使用各自的账户）。
3. **每个模型的徽标文件，**作为附件提供。绝不要凭记忆重新绘制。
4. **标题，**分为两行短句。例如：“同一个提示词。”/“三个 AI 模型。”

第 2 步：公平测试规则

• **只尝试一次。**不重试、不修复，也不为你希望获胜的模型“再试一次”。
• **由模型编写 HTML，由你渲染。**将以下内容加入简报，确保没有模型获得更好的导出结果：

Deliver ONE self-contained index.html, [WIDTH] x [HEIGHT] px. Output the complete HTML only. A shared renderer will execute window.seek(t) and export each model's output at the same settings.
Implementation: deterministic window.seek(seconds), wrap modulo [SECONDS], every visual state derived from time. Automatic playback when not in ?render mode. Under ?render freeze until seek. Set window.__ready=true after initialisation. No external requests. Do not add controls, debug text, the model name or screenshots.

• 三个模型都使用相同的渲染器和相同的设置：尺寸相同、30fps、时长相同、编码器相同。
• **失败也要保留。**如果模型返回了损坏的 HTML 或没有返回内容，就在其面板中如实说明。绝不要换成后续尝试的结果。

第 3 步：排列画面

**Newsletter（16:9）：**三个面板并排，每个面板上方都用纯色条显示模型名称。

**Reel（1080 x 1920）：**三个 1080 x 360 的面板叠放在深色背景上，y 坐标分别为 540、900 和 1260。用 HTML 创建一个透明的 1080 x 1920 overlay.png，其中包含标题和三个标签，然后：

ffmpeg -y -i a.mp4 -i b.mp4 -i c.mp4 -loop 1 -i overlay.png -f lavfi -i anullsrc=r=48000:cl=stereo -filter_complex "color=c=0x0B0B0F:s=1080x1920:r=30:d=12[bg];[0:v]fps=30,scale=1080:360:force_original_aspect_ratio=increase,crop=1080:360,setsar=1[a];[1:v]fps=30,scale=1080:360:force_original_aspect_ratio=increase,crop=1080:360,setsar=1[b];[2:v]fps=30,scale=1080:360:force_original_aspect_ratio=increase,crop=1080:360,setsar=1[c];[bg][a]overlay=0:540[t1];[t1][b]overlay=0:900[t2];[t2][c]overlay=0:1260[t3];[t3][3:v]overlay=0:0,scale=out_color_matrix=bt709:out_range=tv,format=yuv420p[out]" -map "[out]" -map 4:a -t 12 -c:v libx264 -crf 18 -pix_fmt yuv420p -color_range tv -colorspace bt709 -color_primaries bt709 -color_trc bt709 -c:a aac -b:a 128k -movflags +faststart showdown-reel.mp4

将 d=12 和 -t 12 改为你的时长。裁剪会保留画面中心，因此请检查每个面板的一帧；如果动作偏离中心，就调整裁剪位置。

我吃过亏才学到的事

• **叠在视频画面上的徽标在浅色画面中会消失。**每个标签（徽标加模型名称）都放在各自面板左上角的深色圆角底板上。
• **安全区域。**标题位于 y 360 至 520 之间。任何文字或徽标都不能低于 y 1420，也不能进入右侧 120px 的区域，因为应用会在这里显示按钮和字幕。
• **标签使用完整的模型名称，**包括版本号。“Opus 5.5”，而不是“Claude”。
• **字幕以问题收尾。**我的结尾问道“你会发布哪一个？”，并给出了我自己的选择。

第 4 步：检查并导出

从视频中间截取一帧。每个标签在手机屏幕大小下都看得清吗？每个徽标都属于正确的公司吗？然后，在上传前运行 reel-export 中的检查。