Introduction

数日前、OpenDesign プロジェクトからのベンチマーク数値が開発者のフィードに浮上しました。新たにプレビューされた DeepSeek V4.1 Flash を自動 UI 評価スイートに対して実行したところ、このモデルは日常的なインターフェース生成で 100 点満点中 81.2 点を記録しました。これは GPT-6 Astra が設定したスコア(82.7)の 98 パーセントに匹敵し、Claude Fable 5.1(80.3)をわずかに上回っています。 ネガティブな要素は請求書にあります。DeepSeek の実行には 5.3 分かかり、API token の費用は 0.023 ドルでした。一方、Astra は 11.1 分かかり 1.61 ドルかかりました。Fable は 12.8 分かかり 3.66 ドルかかりました。評価された 13 モデルのうち 11 モデルが DeepSeek よりも低いスコアを記録した一方で、完了したタスクあたりの料金は最大 150 倍も高くなりました。

限られた月間予算で開発者ツールをブートストラップしている人にとって、これらの数値は注目に値します。ここ 1 年間、フロントエンド生成においてはフロンティアクローズドモデルがほぼ独占状態を維持していました。安価な汎用チップ上で実行されるオープンウェイトモデルが、本番環境に対応する HTML、CSS、およびコンポーネントの状態をわずか 2 セントで生成できるとき、ソフトウェア出荷のベースライン計算は直ちに変化します。

OpenDesign Arena ベンチマークを支える数値

OpenDesign Arena の評価では、13 のモデルを対象に同一のインターフェース構築プロンプトでテストを実施しました。抽象的なロジックや競技プログラミングのパズルをテストするのではなく、オープンソースのデザインワークスペースにおける実際のユーザーセッションからプロンプトを抽出しました。nexu-io/open-design のメンテナーは、各モデルに対して Web アプリ、モバイルアプリ、デスクトップソフトウェア、ダッシュボード、マーケティング Web サイトという 5 つの特定のアプリケーションシナリオを実行するヘッドレス・テスト・ハーネスを構築しました。

総合ランキングでは、品質の面で DeepSeek V4.1 Flash が 2 位となり、首位の GPT-6 Astra にわずか 1.5 ポイント差まで迫りました。品質、コスト、レイテンシを総合的に評価するアリーナアルゴリズムでは、V4.1 Flash が総合指数 78.8 でトップのオプションにランクインしています。DeepSeek V4 Flash は 68.6、GPT-5.6 Sol は 65.7、Gemini 3.8 Flash は 64.7、そして Claude Fable 5.1 は高いコストと生成レイテンシのために 52.1 まで低下しました。

OpenDesign Arena のランディングページには、DeepSeek V4.1 Flash のパフォーマンス評価カードが表示されており、競合する商用エンドポイントとデザイン品質を比較しています:

OpenDesign Arenaランディングページのパフォーマンス評価カード
OpenDesign Arenaランディングページのパフォーマンス評価カード

世代間の違いは、生の出力を確認すると明らかになります。DeepSeek V4.1 Flash の要件充足度スコアは 30 点満点中平均 28.4 点を記録し、GPT-6 Astra の 26.5 点や Claude Fable 5.1 の 27.1 点を上回りました。生の視覚的洗練度とデザイン品質においては、Astra が 70 点満点中 56.2 点で、DeepSeek の 52.8 点に対してわずかにリードを保っています。Astra の生のビジュアルスコアのほぼ 98 パーセントを達成しながら、資金支出はわずか約 1.4 パーセントに抑えているというこのモデルは、公式 OpenDesign プラットフォームでカタログ化されているフロントエンド生成タスクの経済的現実を根本から変えるものです。

所要時間の面では、日々のワークフローにおいてさらに説得力のある結果が出ています。DeepSeek の平均実行時間は 5.3 分でした。これに対し、Astra は 11.1 分、Claude Fable 5.1 は 12.8 分とかかりました。エンジニアがターミナルに座ってエージェントのプロトタイプ作成を待つ間、6 分の時間の差は、集中力を維持できるか、あるいはソーシャルメディアに気を取られてしまうかを決定づけます。

OpenDesign チームは、初期の公表においてこれらの主要な数値を次のようにまとめています:

Loading tweet...

ワークスペースをテストしたコミュニティメンバーからも、スピードの向上を称賛する声が上がりました。Reddit の r/SideProject での活発な評価スレッドでは、軽量モデルが、重量級のプロプライエタリモデルと比較して、どれほど迅速に動作するレイアウトを返すかが初期のアダプターたちによって指摘されました。毎朝 10 種類のバリエーションを試作するチームにとって、生成ループごとに 6 分を節約することは、スプリント全体を通じて大きな時間の節約につながります。開発者は、レイアウトの token 解決のために最先端のエージェントを何時間も待つのではなく、複数のインターフェースブランチを並行して立ち上げ、破滅的な API スロットリングやワークフローの中断なしに、リアルタイムで構造的なバリエーションを反復処理できます。

人間の審査員なしでベンチマークがインターフェース品質を測定する方法

自動化された UI ベンチマークは、視覚的な品質が主観的なものになりがちなため、失敗することがよくあります。恣意的な人間の投票や表面的な HTML タグの数に頼ることを避けるため、OpenDesign のテストフレームワークは評価を厳格な機械的フェーズに分割しています。まず、ハーネスがランタイムチェックを実行します。生成されたコードはヘッドレスな Chromium インスタンスで直接読み込まれます。もしアーティファクトに、空白のビューポート、壊れたインポート、レンダリングされていない markdown ブロック、またはコンソールでのキャッチされていない JavaScript の例外が表示された場合、その実行には自動的にゼロが与えられます。スイートは再試行や欠落した構文の修正を許可しません。

実行をクリアしたアーティファクトは、100 点満点の基準で評価されます。要件の充足度が 30 点を占めます。システムは DOM ツリーを検査し、指示書で要求された特定のコンポーネント(インタラクティブなモーダル状態、フォーム検証バインディング、テーブルの列ソート、レスポンシブレイアウトのラッパー)を検証します。残りの 70 点では、レイアウト階層、色の調和、アクセシブルなコントラスト比、コンポーネントの準拠性、モバイルおよびデスクトップのブレークポイント間でのレスポンシブ適応を含む 5 つのカテゴリでデザイン構造を測定します。自動チェックにより、色の輝度差を計算して厳格な WCAG AA コントラスト基準を強制し、重なり合った絶対配置要素にフラグを立て、375px、768px、1440px のビューポート幅にわたるレイアウト動作を評価します。

OpenDesign チームは、このテスト哲学に関するコミュニティからの質問に対し、OpenDesign の X での発表で公式なアップデートを行いました:

Loading tweet...

80 点以上のスコアを獲得したアーティファクトは、納品可能な品質とみなされます。テストカタログ全体を通じて、DeepSeek V4.1 Flash は 57.7 パーセントの納品率を維持しました。GPT-6 Astra は 60.0 パーセントに達し、Claude Fable 5.1 は 56.7 パーセントを記録しました。このオープンウェイトモデルは、トークンあたりの料金が 50 倍も高い既存の商用モデルよりも、致命的な回帰(リグレッション)の発生率が低くなりました。

また、このフレームワークは Anthropic Claude Code スキル規則のようなエージェント基準を使用して構造的整合性を追跡し、生成されたアーティファクトがクリーンなファイルの分離とモジュール化されたコンポーネントの境界に従うことを保証します。

トップティアの間でこれらの次元がどのようにバランスを取っているかを視覚化するため、OpenDesign は 5 次元レーダー比較を公開しました:

5つの評価次元における DeepSeek V4.1 Flash、GPT-6 Astra、Claude Fable 5.1 のレーダー比較
5つの評価次元における DeepSeek V4.1 Flash、GPT-6 Astra、Claude Fable 5.1 のレーダー比較

機械的な妥当性と構造的完全性に焦点を当てることで、このベンチマークは、開発者が推測に頼ることなく自動化されたデザインエージェントを評価するための再現可能なパスを提供します。エンジニアリングチームは、定性的な視覚的印象に頼る代わりに、AI モデルが有効なセマンティックタグ、予測可能なレスポンシブステートマシン、および動的な本番データの負荷の下でも崩壊しない安定したコンポーネント階層を生成しているかどうかを検証できます。

token エコノミクスと 70 倍の価格差

フロンティア AI モデルのユニットエコノミクス(単位あたりの経済性)は、資金力のないスタートアップにとって深刻な障壁となります。5 人の開発者チームで従量制のフロンティアモデルを使用するエージェント型コーディングツールを運用すると、毎月 1,500 ドルを超えるコストがかかることがあります。開発者エージェントがインターフェースを反復処理する際、ツールは複数のターンをループし、ファイルの読み込み、ビルドコマンドの実行、ブラウザ DOM ツリーの検査、ファイル全体の書き換えを行います。

ベンチマークデータによると、Claude Fable 5.1 を使用して単一の完全な Web アプリケーションプロトタイプを生成する場合のコストは、平均して 3.66 ドルから 5.55 ドルになります。同じタスクのコストは、GPT-6 Astra では 1.61 ドルから 1.87 ドル、GPT-5.6 Sol では 0.537 ドル、そして DeepSeek V4.1 Flash では 0.023 ドルから 0.030 ドルです。価格のギャップは 2 桁に及び、OpenDesign ドキュメントポータルで公開されている比較でもこの大きな格差が強調されています。

モデルの平均品質スコアをコストと直接比較した散布図を見ると、モデル間の乖離がいかに激しいかがよくわかります:

高価格帯に集中するフロンティアモデルを示す、モデル品質対アーティファクトあたりコストの散布図
高価格帯に集中するフロンティアモデルを示す、モデル品質対アーティファクトあたりコストの散布図

DeepSeek は、高いキャッシュヒット率と高速な生成速度を組み合わせることで、この数値を達成しています。テストにおいて、V4.1 Flash は 89.0 パーセントのプレフィックスキャッシュヒット率を維持しました。150 万 input token を処理しつつ、29,000 output token を生成しました。実行ハーネスに関する DeepSeek のドキュメントには、オフピーク時の入力キャッシュヒットが 100 万 token 当たり 0.003 ドル、キャッシュされていない入力が 100 万 token 当たり 0.15 ドル、出力 token が 100 万 token 当たり 0.60 ドルと記載されています。

プロンプトキャッシングにより、マルチターンのエージェント会話全体での重複計算が防止されるため、コンテキストウィンドウを温存するためのコストはごくわずかです。独立したテストにおけるデコードのスループットは、生の生成パスで秒間 350 から 427 token を記録しました。

OpenDesign のメンテナーは、モデルの実行全体にわたるこのコスト効率の優位性を分析しています:

Loading tweet...

午後に 10 個のインターフェースのアイデアをテストする一人の創業者にとって、DeepSeek で合計 25 セントを使うことは、Claude Fable に 35 ドル使うよりもはるかにお得です。そのマージンによって、インフラ、顧客獲得、あるいはドメイン名への投資資金を確保できるようになります。数百回のコンポーネント反復を伴う数週間のエンジニアリングスプリントの過程で、俊敏なプロダクトチームは、合成デザインの請求額を数百ドルからポケットマネー程度まで削減でき、アーリーステージのチームがインタラクティブなプロトタイピングやユーザーリサーチの実験に取り組むアプローチを根本から変えることができます。

ランディングページ、Web アプリ、ダッシュボード間のタスクの内訳

総合スコアは重大な欠陥を覆い隠してしまうことがあります。クリーンなランディングページを生成できるモデルでも、データ量の多い管理画面用テーブルの構築には苦戦するかもしれません。OpenDesign チームは 5 つの特定のインターフェース形式にわたるモデルのパフォーマンスを分離し、各生成カテゴリにおける明確な動作プロファイルを明らかにしました。

ランディングページやマーケティング Web サイトにおいて、DeepSeek V4.1 Flash は 79.3 点を獲得して 4 位となり、GPT-6 Astra のすぐ上に位置しました。このモデルは、ヒーロータイポグラフィ、flexbox の配置、レスポンシブな CTA(Call to Action)セクション、SVG アイコンの配置を視覚的な崩れなく処理しました。デスクトップソフトウェアのプロトタイプでは、84.4 点で 3 位タイとなりました。モバイルインターフェースでは、82.5 点で 5 位を維持し、タッチターゲット、シートドロワー、親指で操作しやすいナビゲーションバーをきれいに管理しました。

複雑なデータダッシュボードや管理パネルに目を向けると、内訳は変化します。DeepSeek は 76.1 点で 10 位に順位を下げました。複雑なデータグリッドの配置、マルチフィルタークエリのサイドバー、ネストされたデータ視覚化ウィジェットに苦戦しました。スタイリングのセンスよりも空間推論が重要となる情報量の多い密集したテーブルでは、GPT-6 Astra のようなモデルの方がはるかに優れたパフォーマンスを発揮しました。

メンテナーは、タスク別の内訳分析においてこのカテゴリ別の違いを強調しています:

Loading tweet...

ランディングページのランキングとダッシュボードのランキングの比較ビューを見ると、その乖離がはっきりとわかります:

ランディングページと管理用インターフェースの比較ランキングを示すダッシュボード
ランディングページと管理用インターフェースの比較ランキングを示すダッシュボード

プロジェクトのスタジオプロトタイプギャラリーを確認すると、このモデルがコンシューマー向けフローをどれほどうまく処理しているかがわかります。逆に、複雑なライブダッシュボードの例を調べると、空間ロジックにおいて依然として慎重な監視が必要な理由がわかります。OpenDesign アプリケーションでマーケティング資料や顧客のサインアップジャーニーを構築する場合、ビジュアルスタイリングが予測可能なコンポーネントパターンに従うため、軽量なフラッシュアーキテクチャが優れています。対照的に、複雑なエンタープライズダッシュボードでは、リレーショナルテーブルの配置、ネストされたステータスメトリック、複雑なレスポンシブフィルターが必要となり、推論能力の高いフロンティアアーキテクチャが優位性を維持します。モデルがどこで苦戦するかを知ることで、パイプラインでのタスクのルーティング方法がわかります。コンシューマー向けアプリの画面、マーケティングファネル、モバイルビューの処理には DeepSeek V4.1 Flash を使用し、20 状態のチャートを持つエンタープライズ向けアナリティクスインターフェースが必要な場合は、より強力な空間構造を持つモデルにジョブをルーティングしてください。

ローカルハーネスでオープンウェイトを実行するエンジニアリングの現実

ほとんどの議論では、モデルを抽象的なドロップイン代替品として扱っています。しかし本番環境では、モデルの重みと同じくらい、オーケストレーションを行うクライアントが重要になります。公式の nexu-io/open-designは、マイルストーンの発表で述べられているように、116 日以内に 90,000 GitHub スターを突破しました。これは、プロプライエタリなクラウドベンダーへの依存を避け、ローカルで制御可能な開発ツールに対する強い需要を示しています。

OpenDesign は、統合された Node デーモンを備えたローカルファーストのデスクトップアプリケーションとして動作し、ローカルのコーディングエージェント CLI に直接接続します。DeepSeek V4.1 Flash を実行するには、正確なクライアント設定が必要です。ハーネスがプロンプトキャッシングのプレフィックスを誤って処理したり、基本的な操作に対して推論エフォートを高いままにしたりすると、生成速度が低下し、コストが何倍にも膨れ上がります。エコシステムは、公式の Codex プラグインディレクトリ統合によってさらに拡大し、リアルタイムのビジュアルキャンバスを一般的な開発環境に直接もたらしました。

OpenDesign のドキュメントでは、ローカルエージェントのコマンドラインツール全体での幅広い互換性が説明されています:

サポートされているローカルコーディングエージェント CLI を示す OpenDesign リポジトリのドキュメント
サポートされているローカルコーディングエージェント CLI を示す OpenDesign リポジトリのドキュメント

もう一つの重要な要素はキャッシュの衛生管理です。エージェントが動的なタイムスタンプやランダムなリクエスト ID をプロンプトプレフィックスに注入すると、プロバイダー側のキーバリューキャッシュが失われます。キャッシングが機能している場合、入力 token のコストは数セントの端数になります。キャッシュミスが発生すると、その価格は 50 倍に急騰します。システムプロンプト、ブランドガイドライン、共有ツール定義をコンテキストバッファの先頭に固定しておくことが、実行コストをわずか数セントに抑える秘訣です。

テックレビュアーの WorldofAI は、セットアッププロセスを順を追って説明し、ライブコンポーネントジェネレーターの実際の動作を紹介しました:

ローカル実行ハーネスを使用することで、開発者は、1 シートあたり月額 200 ドルを定期的に超える従量制のフロンティアサブスクリプションを回避できます。オープンソースのオーケストレーターと低コストの推論エンドポイントを組み合わせることで、インディーズ開発者はエンタープライズ向けのオーバーヘッドを発生させることなく、本番ソフトウェアを構築できます。さらに、ローカルの状態を維持することで、独自のブランド資産、未公開のクライアントワイヤーフレーム、および内部デザイン token が、プロプライエタリな外部ストレージシステムにストリーミングされることなく、開発者の物理マシン上に完全に保持されます。