論文の概要: WAFFLE: Multi-Modal Model for Automated Front-End Development

• arxiv url: http://arxiv.org/abs/2410.18362v1
• Date: Thu, 24 Oct 2024 01:49:49 GMT
• ステータス: 翻訳完了
• システム内更新日: 2024-11-28 17:07:39.720926
• Title: WAFFLE: Multi-Modal Model for Automated Front-End Development
• Title（参考訳）: WAFFLE:フロントエンド自動開発のためのマルチモーダルモデル
• Authors: Shanchao Liang, Nan Jiang, Shangshu Qian, Lin Tan,
• Abstract要約: We introduced Waffle, a new fine-tuning strategy that using a structure-ware attention mechanism to improve LLMs's understanding of HTML's structure。 Waffleで微調整されたモデルでは、HTMLマッチが9.00pp(パーセント)、CW-SSIMが0.0982、CLIPが32.99pp、LLEMが27.12ppである。
• 参考スコア（独自算出の注目度）: 10.34452763764075
• License: http://creativecommons.org/licenses/by-nc-nd/4.0/
• Abstract: Web development involves turning UI designs into functional webpages, which can be difficult for both beginners and experienced developers due to the complexity of HTML's hierarchical structures and styles. While Large Language Models (LLMs) have shown promise in generating source code, two major challenges persist in UI-to-HTML code generation: (1) effectively representing HTML's hierarchical structure for LLMs, and (2) bridging the gap between the visual nature of UI designs and the text-based format of HTML code. To tackle these challenges, we introduce Waffle, a new fine-tuning strategy that uses a structure-aware attention mechanism to improve LLMs' understanding of HTML's structure and a contrastive fine-tuning approach to align LLMs' understanding of UI images and HTML code. Models fine-tuned with Waffle show up to 9.00 pp (percentage point) higher HTML match, 0.0982 higher CW-SSIM, 32.99 higher CLIP, and 27.12 pp higher LLEM on our new benchmark WebSight-Test and an existing benchmark Design2Code, outperforming current fine-tuning methods.
• Abstract（参考訳）: これは、HTMLの階層構造とスタイルの複雑さのため、初心者と経験豊富な開発者の両方にとって困難である。 LLMのためのHTMLの階層構造を効果的に表現すること、そして、UI設計の視覚的性質とHTMLコードのテキストベースのフォーマットとのギャップを埋めることである。 これらの課題に対処するために、我々は、構造化対応の注意機構を使用して、LLMのHTML構造理解を改善する新しい微調整戦略であるWaffleと、LLMのUIイメージとHTMLコードに対する理解を整合させる対照的な微調整アプローチを紹介する。 Waffleで微調整されたモデルでは、HTMLマッチが9.00pp(パーセント)、CW-SSIMが0.0982、CLIPが32.99pp、LLEMが27.12ppに向上した。

関連論文リスト

• AICC: Parse HTML Finer, Make Models Better -- A 7.3T AI-Ready Corpus Built by a Model-Based HTML Parser [54.623900859999424]
  我々は、コンテンツ抽出をシーケンスラベリング問題として再構成する新しい抽出パイプラインであるMinerU-HTMLを紹介する。 MainWebBenchでは、7,887の注釈付きWebページ、MinerU-HTML 81.8%のROUGE-N F1をTrfilaturaの63.6%と比較した。
  論文  参考訳（メタデータ） (2025-11-20T14:15:23Z)
• HiMo-CLIP: Modeling Semantic Hierarchy and Monotonicity in Vision-Language Alignment [13.584710249222105]
  HiMo-CLIPは、エンコーダアーキテクチャを変更することなくCLIPスタイルのモデルを強化する表現レベルフレームワークである。 HiMo-CLIPは2つの重要なコンポーネントを導入している: 階層分解(HiDe)モジュール。 複数の画像テキスト検索ベンチマークの実験は、HiMo-CLIPが強いベースラインを一貫して上回っていることを示している。
  論文  参考訳（メタデータ） (2025-11-10T03:04:36Z)
• WebGen-V Bench: Structured Representation for Enhancing Visual Design in LLM-based Web Generation and Evaluation [12.981748587257194]
  WebGen-Vは、データ品質と評価を向上させる命令-HTML生成のための新しいベンチマークとフレームワークである。 WebGen-Vは、(1)現実世界のWebページを継続的に収集する非有界でエージェント的なクローリングフレームワーク、(2)メタデータ、ローカライズされたUIスクリーンショット、およびフォーマットされたテキストと画像アセットを統合する構造化されたセクションワイドなデータ表現、(3)テキスト、レイアウト、ビジュアルを整列したセクションレベルのマルチモーダル評価プロトコルである。
  論文  参考訳（メタデータ） (2025-10-17T04:37:37Z)
• VisCodex: Unified Multimodal Code Generation via Merging Vision and Coding Models [82.05514464090172]
  マルチモーダルな大言語モデル(MLLM)は、視覚的およびテキスト的理解の統合を著しく進歩させてきた。 しかし、マルチモーダル入力からコードを生成する能力は依然として限られている。 視覚とコーディング言語モデルをシームレスにマージする統合フレームワークであるVisCodexを紹介します。
  論文  参考訳（メタデータ） (2025-08-13T17:00:44Z)
• 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)
• UICopilot: Automating UI Synthesis via Hierarchical Code Generation from Webpage Designs [43.006316221657904]
  本稿では,Webページの設計から階層的なコード生成によってユーザインタフェース(UI)を自動生成する手法を提案する。 UICopilotの基本的な考え方は、生成プロセスを2つのステージに分解することである。 実験の結果、UICopilotは、自動評価と人的評価の両方において、既存のベースラインを大幅に上回っていることがわかった。
  論文  参考訳（メタデータ） (2025-05-15T02:09:54Z)
• ILLUME+: Illuminating Unified MLLM with Dual Visual Tokenization and Diffusion Refinement [68.05833403672274]
  既存の統一モデルでは、理解、生成、編集という3つの基本的な機能を統一モデルで扱うのに苦労している。 ILLUME+は、きめ細かいテクスチャとテキスト整合したセマンティクスを保存できる統合されたデュアルビジュアルトークンーであるDualViTokを導入した。 また、画像デトケナイザとして拡散モデルを用いて、生成品質と高効率超解像を実現する。
  論文  参考訳（メタデータ） (2025-04-02T17:45:00Z)
• HtmlRAG: HTML is Better Than Plain Text for Modeling Retrieved Knowledge in RAG Systems [62.36019283532854]
  Retrieval-Augmented Generation (RAG) は知識能力の向上を目的としている。 RAGは、検索された知識のフォーマットとして、平易なテキストの代わりにHTMLを使用する。 我々は,情報の損失を最小限に抑えつつ,HTMLの短縮化を図るため,HTMLのクリーニング,圧縮,プルーニング戦略を提案する。
  論文  参考訳（メタデータ） (2024-11-05T09:58:36Z)
• EMMA: Efficient Visual Alignment in Multi-Modal LLMs [56.03417732498859]
  EMMAは、視覚的およびテキスト的エンコーディングを効率的に融合するために設計された軽量なクロスプラットフォームモジュールである。 EMMAは複数のタスクのパフォーマンスを最大9.3%向上させ、幻覚に対する堅牢性を大幅に向上させる。
  論文  参考訳（メタデータ） (2024-10-02T23:00:31Z)
• Web2Code: A Large-scale Webpage-to-Code Dataset and Evaluation Framework for Multimodal LLMs [112.89665642941814]
  MLLM(Multimodal large language model)は、画像、ビデオ、オーディオなどのモダリティにおいて顕著な成功を収めている。 現在のMLLMは、Webページのスクリーンショットを理解し、対応するHTMLコードを生成するのに驚くほど貧弱です。 命令チューニングのための大規模Webページ・ツー・コードデータセットを新たに構築したベンチマークを提案する。
  論文  参考訳（メタデータ） (2024-06-28T17:59:46Z)
• Automatically Generating UI Code from Screenshot: A Divide-and-Conquer-Based Approach [51.522121376987634]
  ウェブページデザインのUIコードへの変換を自動化するための分割型アプローチであるDCGenを提案する。 DCGenはまず、スクリーンショットを管理可能なセグメントに分割し、各セグメントについて記述を生成し、その後、スクリーンショット全体のUIコードに再組み立てする。 実世界のWebサイトとさまざまなMLLMで構成されたデータセットを用いて広範囲なテストを行い、DCGenが競合するメソッドに比べて最大14%の視覚的類似性を実現していることを示す。
  論文  参考訳（メタデータ） (2024-06-24T07:58:36Z)
• PosterLLaVa: Constructing a Unified Multi-modal Layout Generator with LLM [58.67882997399021]
  本研究では,グラフィックレイアウトの自動生成のための統合フレームワークを提案する。 データ駆動方式では、レイアウトを生成するために構造化テキスト(JSONフォーマット)とビジュアルインストラクションチューニングを用いる。 我々は、大規模な実験を行い、パブリックなマルチモーダルレイアウト生成ベンチマーク上で、最先端(SOTA)性能を達成した。
  論文  参考訳（メタデータ） (2024-06-05T03:05:52Z)
• DesignProbe: A Graphic Design Benchmark for Multimodal Large Language Models [35.10231741092462]
  精巧なグラフィックデザインは、きめ細かいデザイン要素(色、フォント、レイアウト)から全体的なデザインまで、2段階の調和を実現するのが一般的である。 MLLM(Multimodal Large Language Models)の急速な開発に伴い,設計におけるMLLMの能力を調べるためのベンチマークであるDesignProbeを確立する。
  論文  参考訳（メタデータ） (2024-04-23T07:31:19Z)
• WebCode2M: A Real-World Dataset for Code Generation from Webpage Designs [49.91550773480978]
  本稿では256万のインスタンスからなる新しいデータセットであるWebCode2Mを紹介する。 WebCode2Mの有効性を検証するため,WebCoderという名称のVision Transformer(ViT)に基づくベースラインモデルを導入し,公正比較のためのベンチマークを確立する。 ベンチマークの結果、我々のデータセットは、Webページの設計からコードを生成するMLLMの能力を大幅に改善することを示した。
  論文  参考訳（メタデータ） (2024-04-09T15:05:48Z)
• Unlocking the conversion of Web Screenshots into HTML Code with the WebSight Dataset [8.581656334758547]
  我々は、200万組のHTMLコードとそれに対応するスクリーンショットからなるデータセットであるWebSightを紹介する。 この分野での研究を加速するため、私たちはWebSightをオープンソースにしました。
  論文  参考訳（メタデータ） (2024-03-14T01:40:40Z)
• Hierarchical Multimodal Pre-training for Visually Rich Webpage Understanding [22.00873805952277]
  WebLMは、WebページにおけるHTMLの構造的モダリティとテキストのみをモデリングする制限に対処するために設計されたマルチモーダル事前学習ネットワークである。 本稿では,テキスト,構造,画像モダリティ間の相互作用を効果的にモデル化するための事前学習タスクを提案する。 実験の結果、事前学習されたWebLMは、いくつかのWebページ理解タスクにおいて、従来の最先端の事前学習モデルを大幅に上回っていることが示された。
  論文  参考訳（メタデータ） (2024-02-28T11:50:36Z)
• Understanding HTML with Large Language Models [73.92747433749271]
  大規模言語モデル(LLM)は、様々な自然言語タスクにおいて例外的な性能を示している。 我々は,HTML 理解モデル (微調整 LLM ) と,その機能に関する3つのタスクの詳細な分析に貢献する。 本稿では,標準自然言語コーパスで事前訓練されたLLMが,HTML理解タスクに極めて適していることを示す。
  論文  参考訳（メタデータ） (2022-10-08T07:27:17Z)

関連論文リストは本サイト内にある論文のタイトル・アブストラクトから自動的に作成しています。

指定された論文の情報です。
本サイトの運営者は本サイト（すべての情報・翻訳含む）の品質を保証せず、本サイト（すべての情報・翻訳含む）を使用して発生したあらゆる結果について一切の責任を負いません。