論文の概要: WebCode2M: A Real-World Dataset for Code Generation from Webpage Designs
- arxiv url: http://arxiv.org/abs/2404.06369v2
- Date: Sat, 22 Feb 2025 05:15:18 GMT
- ステータス: 翻訳完了
- システム内更新日: 2025-02-25 15:51:16.837572
- Title: WebCode2M: A Real-World Dataset for Code Generation from Webpage Designs
- Title(参考訳): WebCode2M:Webページデザインからコードを生成するリアルタイムデータセット
- Authors: Yi Gui, Zhen Li, Yao Wan, Yemin Shi, Hongyu Zhang, Yi Su, Bohua Chen, Dongping Chen, Siyuan Wu, Xing Zhou, Wenbin Jiang, Hai Jin, Xiangliang Zhang,
- Abstract要約: 本稿では256万のインスタンスからなる新しいデータセットであるWebCode2Mを紹介する。
WebCode2Mの有効性を検証するため,WebCoderという名称のVision Transformer(ViT)に基づくベースラインモデルを導入し,公正比較のためのベンチマークを確立する。
ベンチマークの結果、我々のデータセットは、Webページの設計からコードを生成するMLLMの能力を大幅に改善することを示した。
- 参考スコア(独自算出の注目度): 49.91550773480978
- License:
- Abstract: Automatically generating webpage code from webpage designs can significantly reduce the workload of front-end developers, and recent Multimodal Large Language Models (MLLMs) have shown promising potential in this area. However, our investigation reveals that most existing MLLMs are constrained by the absence of high-quality, large-scale, real-world datasets, resulting in inadequate performance in automated webpage code generation. To fill this gap, this paper introduces WebCode2M, a new dataset comprising 2.56 million instances, each containing a design image along with the corresponding webpage code and layout details. Sourced from real-world web resources, WebCode2M offers a rich and valuable dataset for webpage code generation across a variety of applications. The dataset quality is ensured by a scoring model that filters out instances with aesthetic deficiencies or other incomplete elements. To validate the effectiveness of WebCode2M, we introduce a baseline model based on the Vision Transformer (ViT), named WebCoder, and establish a benchmark for fair comparison. Additionally, we introduce a new metric, TreeBLEU, to measure the structural hierarchy recall. The benchmarking results demonstrate that our dataset significantly improves the ability of MLLMs to generate code from webpage designs, confirming its effectiveness and usability for future applications in front-end design tools. Finally, we highlight several practical challenges introduced by our dataset, calling for further research. The code and dataset are publicly available at our project homepage: https://webcode2m.github.io.
- Abstract(参考訳): WebページのデザインからWebページコードを自動的に生成することで、フロントエンド開発者の作業量が大幅に削減され、最近のMLLM(Multimodal Large Language Models)はこの領域で有望な可能性を示している。
しかし,本研究では,既存のMLLMの多くは,高品質で大規模な実世界のデータセットが欠如しているため,自動Webページコード生成の性能が不十分であることが判明した。
このギャップを埋めるために、WebCode2Mという256万のインスタンスからなる新しいデータセットを紹介し、それぞれが対応するWebページコードとレイアウトの詳細と共にデザインイメージを含む。
WebCode2Mは、現実世界のWebリソースをソースとして、さまざまなアプリケーションにわたるWebページコード生成のためのリッチで価値のあるデータセットを提供する。
データセットの品質は、美的欠陥やその他の不完全な要素を持つインスタンスをフィルタリングするスコアリングモデルによって保証される。
WebCode2Mの有効性を検証するため,WebCoderという名称のVision Transformer(ViT)に基づくベースラインモデルを導入し,公正比較のためのベンチマークを確立する。
さらに,構造的階層的リコールを測定するための新しい指標であるTreeBLEUを導入する。
ベンチマークの結果、我々のデータセットは、Webページデザインからコードを生成するMLLMの能力を大幅に改善し、フロントエンド設計ツールにおける将来のアプリケーションの有効性とユーザビリティを確認した。
最後に、データセットで導入されたいくつかの実践的な課題を強調し、さらなる研究を要求します。
コードとデータセットはプロジェクトのホームページで公開されています。
関連論文リスト
- DreamMask: Boosting Open-vocabulary Panoptic Segmentation with Synthetic Data [61.62554324594797]
オープンな語彙設定でトレーニングデータを生成する方法と、実データと合成データの両方でモデルをトレーニングする方法を探索するDreamMaskを提案する。
一般的に、DreamMaskは大規模なトレーニングデータの収集を著しく単純化し、既存のメソッドのプラグイン・アンド・プレイ・エンハンスメントとして機能する。
例えば、COCOで訓練しADE20Kで試験すると、ドリームマスクを装備したモデルは以前の最先端の2.1% mIoUよりも優れていた。
論文 参考訳(メタデータ) (2025-01-03T19:00:00Z) - RedPajama: an Open Dataset for Training Large Language Models [80.74772646989423]
我々は、オープンソースの言語モデルを前進させるために対処しなければならない3つの中核的なデータ関連課題を特定します。
例えば、(1)データキュレーションプロセス、(2)大量の高品質データへのアクセス、(3)データセットキュレーションと分析のためのアーティファクトとメタデータの可用性などである。
LLaMAトレーニングデータセットのオープンレプリケーションであるRedPajama-V1と、生の未フィルタリングテキストデータと品質信号とメタデータからなる巨大なWeb専用データセットであるRedPajama-V2をリリースする。
論文 参考訳(メタデータ) (2024-11-19T09:35:28Z) - Web-Scale Visual Entity Recognition: An LLM-Driven Data Approach [56.55633052479446]
Webスケールのビジュアルエンティティ認識は、クリーンで大規模なトレーニングデータがないため、重大な課題を呈している。
本稿では,ラベル検証,メタデータ生成,合理性説明に多モーダル大言語モデル(LLM)を活用することによって,そのようなデータセットをキュレートする新しい手法を提案する。
実験により、この自動キュレートされたデータに基づいてトレーニングされたモデルは、Webスケールの視覚的エンティティ認識タスクで最先端のパフォーマンスを達成することが示された。
論文 参考訳(メタデータ) (2024-10-31T06:55:24Z) - EDGE: Enhanced Grounded GUI Understanding with Enriched Multi-Granularity Synthetic Data [15.801018643716437]
本稿では,大規模視覚言語モデル(LVLM)のGUI理解と対話能力を,データ駆動型アプローチにより向上することを目的とする。
本稿では,Web上のWebページから大規模で粒度の高いトレーニングデータを自動的に生成する汎用データ合成フレームワークEDGEを提案する。
提案手法は,手動アノテーションへの依存を著しく低減し,研究者がWeb上で利用可能な膨大な公開リソースを活用して作業を進めることを可能にする。
論文 参考訳(メタデータ) (2024-10-25T10:46:17Z) - Data Formulator 2: Iteratively Creating Rich Visualizations with AI [65.48447317310442]
これらの課題に対処するためのLCMを利用した可視化システムであるData Formulator 2を提案する。
Data Formulator 2では、ユーザはUIと自然言語をブレンドして視覚化の意図を記述し、データ変換はAIに委譲される。
イテレーションをサポートするため、Data Formulator 2では、ユーザがイテレーション履歴をナビゲートし、以前の設計を新しい設計に再利用することで、毎回スクラッチから始める必要がない。
論文 参考訳(メタデータ) (2024-08-28T20:12:17Z) - PosterLLaVa: Constructing a Unified Multi-modal Layout Generator with LLM [58.67882997399021]
本研究では,グラフィックレイアウトの自動生成のための統合フレームワークを提案する。
データ駆動方式では、レイアウトを生成するために構造化テキスト(JSONフォーマット)とビジュアルインストラクションチューニングを用いる。
我々は,ユーザのデザイン意図に基づいて編集可能なポスターを生成する自動テキスト投稿システムを開発した。
論文 参考訳(メタデータ) (2024-06-05T03:05:52Z) - Sketch2FullStack: Generating Skeleton Code of Full Stack Website and
Application from Sketch using Deep Learning and Computer Vision [2.422788410602121]
大規模なWebサイトを設計し、それをコードに変換するには、経験豊富な開発者のチームが必要だ。
貴重なリソースを節約し、開発プロセス全体を短縮するでしょう。
論文 参考訳(メタデータ) (2022-11-26T16:32:13Z) - TRoVE: Transforming Road Scene Datasets into Photorealistic Virtual
Environments [84.6017003787244]
本研究では、シミュレーションデータセットに存在する困難とドメインギャップに対処する合成データ生成パイプラインを提案する。
既存のデータセットからアノテーションや視覚的手がかりを利用すれば、自動マルチモーダルデータ生成が容易になることを示す。
論文 参考訳(メタデータ) (2022-08-16T20:46:08Z)
関連論文リストは本サイト内にある論文のタイトル・アブストラクトから自動的に作成しています。
指定された論文の情報です。
本サイトの運営者は本サイト(すべての情報・翻訳含む)の品質を保証せず、本サイト(すべての情報・翻訳含む)を使用して発生したあらゆる結果について一切の責任を負いません。