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% 安く、特に設計 MCP（Model Context Protocol）を用いて適切なコンテキストを Kimi に与えた後は、同程度の品質の出力が得られました。 私たちはその結果を [OVSC ウェブサイト](https://ovsc.vercel.app/) で公開しました。これには Claude Opus 4.8、Claude Fable 5、Kimi K2.7 Code が生成したすべてのバリアントも含まれています。平均すると、Kimi は Fable より約 16 倍、Opus より約 8 倍安価でした。 ![image](https://cdn.prod.website-files.com/69654e88dce9154b5f12070c/6a31c347b29697f82b9c10ee_Hassan%20screenshot%201%20.webp) OVSC ウェブサイトでは、すべてのランディングページと、総コスト、トークン使用量、生成時間の内訳を閲覧できます。 この実験がどのように行われたかを理解するために、まずはベースラインを設定し、プロンプトのみからモデルが何を生み出せるかを確認することから始めました。 ## プロンプトについて B2B SaaS、屋上スピアシー（隠れ家バー）、SQL クエリ用の開発者ツールなど、いくつかのカテゴリーにわたる小規模なランディングページ用プロンプトセットから開始しました。以下は使用したプロンプトの一例です： - SQL クエリをチャートに変換する開発者向けツールのランディングページを作成してください。 - ルーフトップの隠れ家カクテルバーのランディングページを作成してください。アールデコ様式、金箔とエメラルドグリーン、1920 年代の華やかさを表現したデザインです。 - B2B SaaS スタートアップのランディングページを作成してください。チームプロジェクト管理およびコラボレーションツール（タスク、タイムライン、チームワークフロー、統合機能）です。 同じプロンプトを Kimi K2.7 Code と Claude Fable 5 の両方に与えました。 「SQL クエリをチャートに変換する開発者向けツールのランディングページを作成してください」という指示に対して、これらのモデルが作成したページが以下に示されます。 ![image](https://cdn.prod.website-files.com/69654e88dce9154b5f12070c/6a31c448fbfebf9f36d55acf_Hassan%20screenshot%202.webp) Claude Fable 5; Kimi K2.7 Code残念ながら、両モデルとも作成したランディングページは明らかに AI 生成であることが認識できるものでした。 それでもなお、これは単純なプロンプトのみから各モデルが何を生み出せるかを示す有用なベンチマークとなりました。デザインをさらに推し進めるためには、モデルにより強いクリエイティブな指示を与える必要があり、そのために最も効果的だと見つけたのがカスタム MCP サーバー（Model Context Protocol Server）の活用です。 ## デザインインスピレーション用 MCP サーバー 私たちは、設計された優れたランディングページのスクリーンショットや、個別の UI 要素、その他の視覚的リファレンスを提供するカスタム MCP サーバーを構築しました。Kimi K2.7 Code はマルチモーダルモデルであるため、これらの画像をテキストと共にプロンプトに直接含めることができました。 これが結果を大きく変えました。短いプロンプトだけでレイアウトを生成するのではなく、Kimi は具体的な例から作業し、視覚的な言語を読み取り、そのパターンを新しいページに適用できるようになりました。実際には、結果はより明確な階層構造を持ち、タイポグラフィが改善され、意図的な構成となりました。 Rooftop Speakeasy のランディングページのビフォー・アフターをご覧ください： ![image](https://cdn.prod.website-files.com/69654e88dce9154b5f12070c/6a31c5ba54d5cb22f4ab17cd_Hassan%20screenshot%203.webp) Kimi K2.7 Code（プロンプトのみ）; Kimi K2.7 Code（デザインインスピレーション MCP サーバー使用） デザインインスピレーションを活用することで、Kimi はより高速に読み込まれるページを生成し、壊れた画像のプレースホルダーを回避し、はるかに読みやすいタイポグラフィを採用しました。 デザインの改善がなされた後、次に探求したかったのはコストです。 ## ランディングページあたりのコスト Kimi K2.7 Code のようなオープンソースモデルを使用する利点の一つはコストです。例えば、B2B SaaS 向けのこのランディングページは、Kimi ではわずか 4 セントでした。同じプロンプトを Claude Fable で使用した場合のコストは 1.09 ドルで、約 27 倍も高価になります。 ![image](https://cdn.prod.website-files.com/69654e88dce9154b5f12070c/6a31d0b868dbb5967e835b60_Hassan%20screenshot%204.webp) Claude Fable: 総コスト 1.09 ドル; Kimi K2.7: 総コスト 4 セント 平均して、Kimi K2.7 Code で生成したランディングページは、Claude Fable 5 のような専用モデルで生成されたもののおよそ 16 分の 1 のコストでした。 生成型コーディングエージェントを使用すると、ランディングページは通常1バージョンだけ生成されることは稀です。むしろ、さまざまなデザイン方向性、コピー、ページ要素を探求するために、多くのバリエーションを生成することが一般的です。その後、有望なものを特定し、実験と調整の繰り返しを通じて編集・洗練させていきます。このように往復するプロセスの中で、SaaS 用のランディングページのようなシンプルなものであっても、価格差はすぐに蓄積していきます。 Kimi K2.7 Code を使用して100ページのランディングページを生成した場合、Claude Fable 5 などの独自モデルを使用する場合と比較して、約94ドルの節約になります。 低コストは明確な利点でしたが、私たちは結果の品質を比較する方法も欲していました。 ## 結果の比較 ランディングページを生成した後、Kimi と Fable を体系的に比較する方法が必要でした。私たちはコードそのものだけでなく、各ページの全体的な品質、つまりポジショニング、ビジュアルの方向性、コンテンツ構造、職人技、レスポンシブ対応、技術的な実装までを含めて評価しました。そのため、GPT-5.5 に評価基準（ルブリック）を与え、各ページのスクリーンショットとソースコードをレビュー・採点させ、0から100までの最終スコアを割り当てました。 各ランディングページのスコアは以下の通りです： Page Fable Fable + MCP Kimi Kimi + MCP SQL Charts86918286 Long form article86838285 Architecture portfolio91928879 Sleep app92948080 Learn-to-cook app94928681 インディー書店95928989 電子音楽91918585 ホットソースブランド91938687 ルーフトップ・スピーキー93928685 香水ハウス91918883 ボイスクローンアプリ88908384 B2B SaaS84908081 Claude Fable は両方の例でより高いスコアを記録しましたが、その差は比較的狭いものでした。Kimi はデザイン、構造、および全体的なページ品質において競争力のある状態を保ちながら、実行コストはずっと低く抑えられていました。このようなワークフローにおいては、このトレードオフが妥当であると私たちは感じました。 ## 最終的な考察 Kimi K2.7 Code のようなオープンソースモデルはすでに有用なランディングページの生成が可能ですが、私たちの実験では、プロンプトだけでは不十分であることが示されました。より良い文脈がない限り、Kimi と Claude Fable の両方は、洗練されているが汎用的な結果を生み出す傾向がありました。 最大の改善点は、カスタム MCP サーバーを通じて Kimi にビジュアルインスピレーションを与えたことでした。スクリーンショットやデザインリファレンスから作業できるようになると、ページはより読みやすく、構造的になり、視覚的な意図が明確になりました。 これに低コストを組み合わせることで、オープンソースモデルはこの種のワークフローにおける実用的な選択肢となります。モデルにより強力な入力を与え、安価に反復できるのであれば、驚くほど遠くまで到達できます。 Kimi K2.7 Code のようなオープンソースモデルは、[Together AI Playground](https://api.together.ai/playground/moonshotai/Kimi-K2.7-Code) で試すことができます。

Kimi K2.7 Code と Claude Fable 5 の比較：ランディングページ作成コストが 94% 削減

背景や根拠まで確認しますか？

調べる

選ぶ

サイト