論文の概要: 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で公開されています。
関連論文リスト
- 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) - 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)
関連論文リストは本サイト内にある論文のタイトル・アブストラクトから自動的に作成しています。
指定された論文の情報です。
本サイトの運営者は本サイト(すべての情報・翻訳含む)の品質を保証せず、本サイト(すべての情報・翻訳含む)を使用して発生したあらゆる結果について一切の責任を負いません。