Kimi K2.7 Code vs Claude Fable 5: Landing pages that cost 94% less
TL;DR · AI 摘要
Kimi K2.7 Code在生成落地页时成本比Claude Fable 5低94%，且质量接近。
核心要点
- Kimi K2.7 Code生成落地页的成本比Claude Fable 5低94%。
- 使用设计灵感MCP服务器后，Kimi生成的页面质量显著提升。
- Kimi K2.7 Code在生成速度和可读性方面表现优于Claude Fable 5。
结构提纲
按章节快速跳转。
- §引言
文章比较了Kimi K2.7 Code和Claude Fable 5在生成落地页时的成本和质量。
- ·实验设计
文章通过12个落地页的生成实验，比较了Kimi K2.7 Code和Claude Fable 5的表现。
- ›成本对比
Kimi K2.7 Code生成落地页的成本比Claude Fable 5低94%。
使用设计灵感MCP服务器后，Kimi K2.7 Code生成的页面质量显著提升。
- ›结果分析
Kimi K2.7 Code在生成速度和可读性方面表现优于Claude Fable 5。
思维导图
用一张图看清主题之间的关系。
查看大纲文本（无障碍 / 无 JS 友好）
- Kimi K2.7 Code vs Claude Fable 5
- 成本对比
- Kimi K2.7 Code成本低94%
- Claude Fable 5成本高
- 质量对比
- Kimi K2.7 Code质量接近Claude Fable 5
- 设计灵感MCP服务器提升Kimi质量
金句 / Highlights
值得收藏与分享的关键句。
Kimi K2.7 Code cost about 94% less than Fable 5 and yielded similar-quality output.
With design inspiration, Kimi produced pages that loaded faster, avoided broken-image placeholders, and used far more readable typography.
The gap between open-source models and commercial models is closing faster than people realize.
Kimi K2.7 Code 与 Claude Fable 5：成本降低 94% 的落地页
摘要
我们通过 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%，并且在给予 Kimi 正确的上下文和设计 MCP 之后，输出质量相当。
我们在 OVSC 网站上发布了我们的研究结果，包括由 Claude Opus 4.8、Claude Fable 5 和 Kimi K2.7 Code 生成的所有变体。平均而言，Kimi 的成本约为 Fable 的 1/16，约为 Opus 的 1/8。
OVSC 网站允许您探索所有落地页，并查看总成本、令牌使用情况和生成时间的详细分析。
为了了解我们是如何进行这项实验的，我们首先建立了一个基准，看看模型仅凭提示语能生成什么内容。
提示语
我们从几个不同类别的落地页提示语开始，包括 B2B SaaS、屋顶秘密酒吧和一个用于 SQL 查询的开发工具。这是我们使用的一些提示语示例：
- 为一个能够将 SQL 查询转换为图表的开发工具创建一个落地页。
- 为一个屋顶秘密酒吧鸡尾酒吧创建一个落地页——装饰艺术风格、金箔和翡翠、1920 年代的魅力。
- 为一个 B2B SaaS 初创公司创建一个落地页——一个团队项目管理与协作工具（任务、时间线、团队工作流程、集成）。
我们将相同的提示语提供给了 Kimi K2.7 Code 和 Claude Fable 5。
以下是当被要求“为一个能够将 SQL 查询转换为图表的开发工具创建一个落地页”时，这些模型生成的页面。
Claude Fable 5；Kimi K2.7 Code
不幸的是，这两个模型生成的落地页都明显具有 AI 生成的特征。
尽管如此，这为我们提供了一个有用的基准，即每个模型仅凭简单的提示语能生成什么内容。为了进一步推动设计，我们需要给模型更强的创意方向，而我们发现最有效的方法是使用自定义的 MCP 服务器。
设计灵感 MCP 服务器
我们设置了一个自定义的 MCP 服务器，提供了一些设计良好的落地页截图，以及单个 UI 元素和其他视觉参考。由于 Kimi K2.7 Code 是多模态的，我们可以将这些图像直接包含在提示语中，与文本一起。
这显著改变了结果。Kimi 不再仅凭简短的提示语生成布局，而是可以从具体的例子中学习，捕捉视觉语言，并将这些模式应用到新的页面上。实际上，结果具有更强的层次结构、更好的排版和更有意的构图。
以下是屋顶秘密酒吧落地页的前后对比：
Kimi K2.7 Code 仅凭提示语；Kimi K2.7 Code 搭配设计灵感 MCP 服务器
有了设计灵感，Kimi 生成的页面加载速度更快，避免了破损图像的占位符，并使用了更易读的排版。
一旦设计得到改善，我们接下来想探索的是成本。
每个落地页的成本
使用像 Kimi K2.7 Code 这样的开源模型的优势之一是成本。例如，使用 Kimi 生成这个 B2B SaaS 的落地页仅花费了 4 美分，而使用 Claude Fable 生成相同提示的费用为 1.09 美元，几乎是前者的 27 倍。
Claude Fable：总费用 1.09 美元；Kimi K2.7：总费用 4 美分
平均而言，我们使用 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
长文文章
83
85
架构作品集
92
88
79
睡眠应用
94
80
学习烹饪应用
81
独立书店
95
89
电子音乐
辣酱品牌
93
87
屋顶秘密酒吧
香水品牌
语音克隆应用
90
84
B2B SaaS
在两个示例中，Claude Fable 的得分更高，但差距相对较小。Kimi 在设计、结构和整体页面质量方面仍然具有竞争力，而运行成本却低得多。对于这种工作流程，我们认为这种权衡是合理的。
最后想法
像 Kimi K2.7 Code 这样的开源模型已经能够生成有用的落地页，但我们的实验表明，提示本身只是整个问题的一部分。在没有更好上下文的情况下，Kimi 和 Claude Fable 倾向于生成经过润色但通用的结果。
最大的改进来自于通过自定义的 MCP 服务器为 Kimi 提供视觉灵感。一旦它能够从截图和设计参考中工作，页面就变得更加易读、结构更清晰、视觉上也更有意图。
结合较低的成本，这使得开源模型成为这种工作流程的实用选择。如果你能够为模型提供更强的输入并以低成本进行迭代，你将能够取得令人惊讶的成果。
你可以在 Together AI Playground 中尝试像 Kimi K2.7 Code 这样的开源模型。