論文の概要: DesignBench: A Comprehensive Benchmark for MLLM-based Front-end Code Generation
- arxiv url: http://arxiv.org/abs/2506.06251v1
- Date: Fri, 06 Jun 2025 17:21:21 GMT
- ステータス: 翻訳完了
- システム内更新日: 2025-06-09 17:28:43.56763
- Title: DesignBench: A Comprehensive Benchmark for MLLM-based Front-end Code Generation
- Title（参考訳）: DesignBench:MLLMベースのフロントエンドコード生成のための総合ベンチマーク
- Authors: Jingyu Xiao, Ming Wang, Man Ho Lam, Yuxuan Wan, Junliang Liu, Yintong Huo, Michael R. Lyu,
- Abstract要約: MLLM(Multimodal Large Language Models)は、フロントエンドの自動化において顕著な機能を示す。
DesignBenchは、自動フロントエンドエンジニアリングにおけるMLLMの機能を評価するためのベンチマークである。
- 参考スコア（独自算出の注目度）: 31.237236649603123
- License: http://arxiv.org/licenses/nonexclusive-distrib/1.0/
- Abstract: Multimodal Large Language Models (MLLMs) have demonstrated remarkable capabilities in automated front-end engineering, e.g., generating UI code from visual designs. However, existing front-end UI code generation benchmarks have the following limitations: (1) While framework-based development becomes predominant in modern front-end programming, current benchmarks fail to incorporate mainstream development frameworks. (2) Existing evaluations focus solely on the UI code generation task, whereas practical UI development involves several iterations, including refining editing, and repairing issues. (3) Current benchmarks employ unidimensional evaluation, lacking investigation into influencing factors like task difficulty, input context variations, and in-depth code-level analysis. To bridge these gaps, we introduce DesignBench, a multi-framework, multi-task evaluation benchmark for assessing MLLMs' capabilities in automated front-end engineering. DesignBench encompasses three widely-used UI frameworks (React, Vue, and Angular) alongside vanilla HTML/CSS, and evaluates on three essential front-end tasks (generation, edit, and repair) in real-world development workflows. DesignBench contains 900 webpage samples spanning over 11 topics, 9 edit types, and 6 issue categories, enabling detailed analysis of MLLM performance across multiple dimensions. Our systematic evaluation reveals critical insights into MLLMs' framework-specific limitations, task-related bottlenecks, and performance variations under different conditions, providing guidance for future research in automated front-end development. Our code and data are available at https://github.com/WebPAI/DesignBench.
- Abstract（参考訳）: MLLM(Multimodal Large Language Models)は、ビジュアルデザインからUIコードを生成するような、フロントエンドの自動化エンジニアリングにおいて、注目すべき機能を示している。
しかし、既存のフロントエンドUIコード生成ベンチマークには、以下の制限がある。 1) フレームワークベースの開発は、現代のフロントエンドプログラミングにおいて支配的になるが、現在のベンチマークは、主流の開発フレームワークを組み込まない。
2) 既存の評価はUIコード生成タスクのみに重点を置いているが,実際のUI開発には,編集の精細化や修正の問題など,いくつかのイテレーションが伴っている。
3)最近のベンチマークでは一次元評価が採用されており,タスクの難易度,入力コンテキストの変動,コードレベルでの詳細な分析などの要因が調査されていない。
これらのギャップを埋めるために、自動フロントエンドエンジニアリングにおけるMLLMの能力を評価するためのマルチフレーム・マルチタスク評価ベンチマークであるDesignBenchを紹介する。
DesignBenchは、バニラHTML/CSSとともに広く使用されている3つのUIフレームワーク(React、Vue、Angular)を含み、現実世界の開発ワークフローにおける3つの重要なフロントエンドタスク(生成、編集、修復)を評価している。
DesignBenchには、11のトピック、9の編集タイプ、6の課題カテゴリにまたがる900のWebページサンプルが含まれており、複数の次元にわたるMLLMパフォーマンスの詳細な分析を可能にしている。
本稿では,MLLMのフレームワーク固有の制限,タスク関連ボトルネック,パフォーマンスの変動について,さまざまな条件下で重要な知見を提示し,フロントエンドの自動開発における今後の研究の指針を提供する。
私たちのコードとデータはhttps://github.com/WebPAI/DesignBench.comで公開されています。
関連論文リスト
- MERA Code: A Unified Framework for Evaluating Code Generation Across Tasks [56.34018316319873]
我々は,最新のLLMをロシア語で評価するためのベンチマークであるMERA Codeを提案する。
このベンチマークには、8つのプログラミング言語にまたがる11の評価タスクが含まれている。
我々はオープンなLLMとフロンティアAPIモデルを評価し、非英語言語における実用的なコーディングタスクの観点からそれらの制限を分析した。
論文 参考訳（メタデータ） (2025-07-16T14:31:33Z) - DesignCoder: Hierarchy-Aware and Self-Correcting UI Code Generation with Large Language Models [17.348284143568282]
DesignCoderは、階層的かつ自己修正の自動化コード生成フレームワークである。
複雑なネストUI階層を理解し予測するMLLMの能力を向上するUI Grouping Chainsを導入する。
また、生成したコードのエラーを特定し、修正するモデルの能力を改善するための自己補正機構も組み込んでいます。
論文 参考訳（メタデータ） (2025-06-16T16:20:43Z) - FrontendBench: A Benchmark for Evaluating LLMs on Front-End Development via Automatic Evaluation [17.64876163735292]
FrontendBenchは、人間と大規模言語モデル(LLM)が共同開発したベンチマークである。
このベンチマークは、5つのレベルのWebコンポーネントにまたがる、148の厳密なプロンプト-テストケースペアで構成されている。
自動評価フレームワークはサンドボックス環境内で生成されたコードを実行し、事前に定義されたテストスクリプトを使用して結果を評価する。
論文 参考訳（メタデータ） (2025-06-16T03:20:31Z) - WebUIBench: A Comprehensive Benchmark for Evaluating Multimodal Large Language Models in WebUI-to-Code [57.45181837786448]
MLLM(Multimodal Large Language Models)は、複雑なWebアプリケーション開発を実行するAIソフトウェアエンジニアとして機能する可能性がある。
既存のベンチマークは、通常、サブ能力の評価を提供し、Webページ生成結果のみに焦点を当てない。
WebUIパーセプション、HTMLプログラミング、WebUI-HTML理解、WebUI-to-Codeの4つの主要な領域でMLLMを評価するために体系的に設計されたベンチマークであるWebUIBenchを提案する。
論文 参考訳（メタデータ） (2025-06-09T14:46:02Z) - FullFront: Benchmarking MLLMs Across the Full Front-End Engineering Workflow [27.208918000210797]
FullFrontは、MLLM(Multimodal Large Language Models)を評価するために設計されたベンチマークである。
FullFrontは、現実世界のWebページをクリーンで標準化されたHTMLに変換する、新しい2段階のプロセスを採用している。
論文 参考訳（メタデータ） (2025-05-23T02:16:11Z) - Assessing and Advancing Benchmarks for Evaluating Large Language Models in Software Engineering Tasks [13.736881548660422]
大規模言語モデル(LLM)は、ソフトウェア工学(SE)で人気が高まっている。
この分野での有効性を 理解するためには 有効性の評価が不可欠です
本稿では、191ベンチマークの徹底的なレビューを行い、どのベンチマークが利用可能か、どのようにベンチマークを構築しているか、これらのベンチマークの将来展望の3つの主要な側面に対処する。
論文 参考訳（メタデータ） (2025-05-13T18:45:10Z) - MC-Bench: A Benchmark for Multi-Context Visual Grounding in the Era of MLLMs [61.56904387052982]
本稿では,マルチコンテキストの視覚的グラウンド化という新しい視覚的グラウンド化タスクを提案する。
オープンなテキストプロンプトに基づいて、複数の画像にまたがる関心のインスタンスをローカライズすることを目的としている。
我々は20以上の最先端MLLMと基盤モデルをベンチマークし、潜在的にマルチコンテキストの視覚的グラウンド化機能を有する。
論文 参考訳（メタデータ） (2024-10-16T07:52:57Z) - VisualWebBench: How Far Have Multimodal LLMs Evolved in Web Page Understanding and Grounding? [115.60866817774641]
MLLM(Multimodal Large Language Model)は、Web関連のタスクにおいて有望であることを示す。
Webドメインにおけるパフォーマンス評価は、包括的なベンチマークが欠如しているため、依然として課題である。
benchは、さまざまなWebタスクにわたるMLLMの機能を評価するために設計されたマルチモーダルベンチマークである。
論文 参考訳（メタデータ） (2024-04-09T02:29:39Z) - Prompting Large Language Models to Tackle the Full Software Development Lifecycle: A Case Study [72.24266814625685]
DevEvalでソフトウェア開発ライフサイクル全体にわたって、大きな言語モデル(LLM)のパフォーマンスを調査します。
DevEvalは4つのプログラミング言語、複数のドメイン、高品質なデータ収集、各タスクに対して慎重に設計および検証されたメトリクスを備えている。
GPT-4を含む現在のLLMは、DevEvalで提示される課題を解決できないことが実証研究によって示されている。
論文 参考訳（メタデータ） (2024-03-13T15:13:44Z) - Design2Code: Benchmarking Multimodal Code Generation for Automated Front-End Engineering [74.99736967448423]
私たちは、このタスクのための最初の実世界のベンチマークであるDesign2Codeを構築します。
テストケースとして484の多様な実世界のWebページを手作業でキュレートし、自動評価指標のセットを開発する。
我々の詳細なブレークダウンメトリクスは、入力されたWebページから視覚要素をリコールし、正しいレイアウト設計を生成するモデルがほとんど遅れていることを示している。
論文 参考訳（メタデータ） (2024-03-05T17:56:27Z) - SEED-Bench-2: Benchmarking Multimodal Large Language Models [67.28089415198338]
MLLM(Multimodal large language model)は、最近、テキストだけでなく、インターリーブされたマルチモーダル入力の画像を生成できることを実証した。
SEED-Bench-2は、正確な人間のアノテーションを持つ24Kの多重選択質問で構成されており、27次元にまたがっている。
我々は,23個の著名なオープンソースMLLMの性能を評価し,貴重な観察結果を要約した。
論文 参考訳（メタデータ） (2023-11-28T05:53:55Z)
関連論文リストは本サイト内にある論文のタイトル・アブストラクトから自動的に作成しています。
指定された論文の情報です。
本サイトの運営者は本サイト（すべての情報・翻訳含む）の品質を保証せず、本サイト（すべての情報・翻訳含む）を使用して発生したあらゆる結果について一切の責任を負いません。