摘要
我们让 Kimi K2.7 Code 和 Claude Fable 5 各生成了 12 个落地页。Kimi 的成本低 94%，几乎每个页面的得分都与对手只差几分。开源模型不只是更便宜，在质量上也确实有竞争力，而且差距缩小的速度比大家想象的要快。
我们做了一个实验，让 Kimi K2.7 Code 和 Claude Fable 5 各自生成 12 个落地页，进行并排对比。总体而言，Kimi K2.7 Code 的成本比 Fable 5 低约 94%，产出质量相近，尤其是在我们通过设计类 MCP 为 Kimi 提供了合适的上下文之后。
我们把实验结果发布在了 OVSC 网站上，同时附上了 Claude Opus 4.8、Claude Fable 5 和 Kimi K2.7 Code 生成的所有版本。平均而言，Kimi 比 Fable 便宜约 16 倍，比 Opus 便宜约 8 倍。
在 OVSC 网站上，你可以浏览所有落地页，并查看总成本、token 用量和生成时间的明细。
为了说明这个实验是怎么做的，我们先建立了一条基线，看看仅凭提示词，模型能产出什么。
提示词
我们先选了一小组涵盖不同类别的落地页提示词，包括 B2B SaaS、屋顶私酒吧（speakeasy）和一款 SQL 查询开发者工具。以下是我们用过的部分提示词：
- 构建一个面向“将 SQL 查询转换为图表”的开发者工具的落地页。
- 构建一个屋顶秘密酒吧（speakeasy）鸡尾酒吧的落地页——装饰艺术风格，金箔与祖母绿配色，1920 年代的魅力。
- 构建一个 B2B SaaS 创业公司的落地页——一款团队项目管理 & 协作工具（任务、时间线、团队工作流、集成）。
我们把同样的提示词分别交给 Kimi K2.7 Code 和 Claude Fable 5。
下面是两个模型在收到 “Build a landing page for a developer tool that turns SQL queries into charts.” 这条提示词后生成的页面。
遗憾的是，两个模型做出的落地页都有明显的 AI 生成痕迹。
即便如此，这也为我们提供了一条有用的基线，让我们知道每个模型仅凭一句简单提示词能产出什么。要把设计进一步提升，就得给模型更明确的创意方向，而我们发现最有效的办法是搭建一个自定义 MCP 服务器。
设计灵感 MCP 服务器
我们搭建了一个自定义 MCP 服务器，提供设计出色的落地页截图，以及单个 UI 元素和其他视觉参考。由于 Kimi K2.7 Code 是多模态模型，我们可以把这些图片和文字一起直接放进提示词。
这让结果发生了明显变化。Kimi 不再只凭一句简短的提示词来生成版式，而是可以参照具体的范例，领会其中的视觉语言，再把这些模式应用到新页面上。实际效果是，页面的层次更清晰，字体排印更好，整体构图也更用心。
下面是 Rooftop Speakeasy 落地页的前后对比：
有了设计灵感的加持，Kimi 生成的页面加载更快，不再出现图片裂开的占位符，字体的可读性也好得多。
设计改善之后，我们接下来想看看成本。
每个落地页的成本
使用 Kimi K2.7 Code 这类开源模型的优势之一就是成本。比如，这个 B2B SaaS 落地页用 Kimi 生成只花了 4 美分，而同样的提示词用 Claude Fable 要 1.09 美元，贵了将近 27 倍。
平均而言，用 Kimi K2.7 Code 生成的落地页，成本比 Claude Fable 5 这类专有模型生成的低约 16 倍。
使用生成式编程智能体时，你很少只生成一个版本的落地页。更常见的做法是生成许多变体，用来探索不同的设计方向、文案和页面元素，然后对其中有潜力的版本反复迭代，经过多轮试验和调整不断打磨。来回折腾的次数一多，价格差距很快就会累积起来，哪怕只是一个简单的 SaaS 落地页也是如此。
如果用 Kimi K2.7 Code 生成 100 个页面，与使用 Claude Fable 5 这类专有模型相比，大约能省下 94 美元。
成本更低是显而易见的优势，但我们还想找到一种方法来比较结果的质量。
对比结果
生成落地页之后，我们想要一种系统化的方式来比较 Kimi 和 Fable。我们看的不只是代码本身，而是每个页面的整体质量，包括定位、视觉方向、内容结构、工艺细节、响应式表现和技术实现。为此，我们给 GPT-5.5 一份评分细则，让它审阅每个页面的截图和源代码并打分，最终给出 0 到 100 的总分。
以下是各个落地页的得分：
| 页面 | Fable | Fable + MCP | Kimi | Kimi + MCP |
|---|---|---|---|---|
| SQL Charts | 86 | 91 | 82 | 86 |
| 长文文章 | 86 | 83 | 82 | 85 |
| 建筑作品集 | 91 | 92 | 88 | 79 |
| 睡眠应用 | 92 | 94 | 80 | 80 |
| 学做饭应用 | 94 | 92 | 86 | 81 |
| 独立书店 | 95 | 92 | 89 | 89 |
| 电子音乐 | 91 | 91 | 85 | 85 |
| 辣酱品牌 | 91 | 93 | 86 | 87 |
| Rooftop Speakeasy | 93 | 92 | 86 | 85 |
| 香水世家 | 91 | 91 | 88 | 83 |
| 声音克隆应用 | 88 | 90 | 83 | 84 |
| B2B SaaS | 84 | 90 | 80 | 81 |
在这两个例子中，Claude Fable 的得分都更高，但差距相对较小。Kimi 在设计、结构和整体页面质量上依然有竞争力，而运行成本低得多。对于这类工作流，我们认为这样的取舍是合理的。
最后的思考
像 Kimi K2.7 Code 这样的开源模型，已经能够生成有用的落地页，但我们的实验表明，提示词只是其中的一部分。没有更好的上下文，Kimi 和 Claude Fable 往往都只能做出精致但千篇一律的结果。
最大的提升来自通过自定义 MCP 服务器为 Kimi 提供视觉灵感。一旦它可以参照截图和设计参考，页面就变得更易读、结构更清晰，视觉上也更有章法。
再加上成本更低，开源模型就成了这类工作流的务实之选。如果你能给模型更好的输入，并以低成本反复迭代，就能走得出乎意料地远。
你可以在 Together AI Playground 中试用 Kimi K2.7 Code 这样的开源模型。