論文の概要: DOne: Decoupling Structure and Rendering for High-Fidelity Design-to-Code Generation
- arxiv url: http://arxiv.org/abs/2604.01226v1
- Date: Thu, 12 Mar 2026 03:47:24 GMT
- ステータス: 翻訳完了
- システム内更新日: 2026-04-06 02:36:13.218863
- Title: DOne: Decoupling Structure and Rendering for High-Fidelity Design-to-Code Generation
- Title(参考訳): DOne: 高忠実度設計・コード生成のための構造とレンダリングの分離
- Authors: Xinhao Huang, Jinke Yu, Wenhao Xu, Zeyi Wen, Ying Zhou, Junzhuo Liu, Junhao Ji, Zulong Chen,
- Abstract要約: DOneは、要素レンダリングから構造理解を分離するエンドツーエンドのフレームワークである。
HiFi2Codeは、既存のデータセットよりもはるかに高いレイアウトの複雑さを特徴とするベンチマークである。
人間の評価は、高い視力で生産性が3倍向上することを確認する。
- 参考スコア(独自算出の注目度): 35.535141410383325
- License: http://arxiv.org/licenses/nonexclusive-distrib/1.0/
- Abstract: While Vision Language Models (VLMs) have shown promise in Design-to-Code generation, they suffer from a "holistic bottleneck-failing to reconcile high-level structural hierarchy with fine-grained visual details, often resulting in layout distortions or generic placeholders. To bridge this gap, we propose DOne, an end-to-end framework that decouples structure understanding from element rendering. DOne introduces (1) a learned layout segmentation module to decompose complex designs, avoiding the limitations of heuristic cropping; (2) a specialized hybrid element retriever to handle the extreme aspect ratios and densities of UI components; and (3) a schema-guided generation paradigm that bridges layout and code. To rigorously assess performance, we introduce HiFi2Code, a benchmark featuring significantly higher layout complexity than existing datasets. Extensive evaluations on the HiFi2Code demonstrate that DOne outperforms exiting methods in both high-level visual similarity (e.g., over 10% in GPT Score) and fine-grained element alignment. Human evaluations confirm a 3 times productivity gain with higher visual fidelity.
- Abstract(参考訳): ヴィジュアル言語モデル(VLM)は、設計からコード生成において有望であることを示しているが、それらは高レベルの構造的階層をきめ細かな視覚的詳細で整合させ、レイアウトの歪みや一般的なプレースホルダーをもたらす「全体的ボトルネック障害」に悩まされている。
このギャップを埋めるために、我々は要素レンダリングから構造理解を分離するエンドツーエンドフレームワークであるDOneを提案する。
DOneは、(1)複雑な設計を分解し、ヒューリスティックな収穫の限界を避けるための学習されたレイアウトセグメンテーションモジュール、(2)UIコンポーネントの極端なアスペクト比と密度を扱う特殊なハイブリッド要素検索モジュール、(3)レイアウトとコードをブリッジするスキーマ誘導生成パラダイムを紹介する。
パフォーマンスを厳格に評価するために、既存のデータセットよりもはるかに高いレイアウトの複雑さを特徴とするHiFi2Codeというベンチマークを導入する。
HiFi2Codeの大規模な評価では、DOneは高レベルの視覚的類似性(例えば、GPTスコアの10%以上)ときめ細かい要素アライメントの両方においてエグジットメソッドよりも優れていた。
人間の評価は、高い視力で生産性が3倍向上することを確認する。
関連論文リスト
- Omni-I2C: A Holistic Benchmark for High-Fidelity Image-to-Code Generation [59.87131391492088]
我々は,複雑な構造化デジタルグラフィックスを実行可能なコードに変換する上で,LMM(Large Multimodal Models)の能力を評価するために設計されたベンチマークであるOmni-I2Cを提案する。
真のユーザソースのケースを組み込むことで、このベンチマークは広範囲のデジタルコンテンツにまたがる。
評価の結果,主要なLMM間の性能差が顕著であることがわかった。
論文 参考訳(メタデータ) (2026-03-18T09:10:04Z) - Architecture-Aware Multi-Design Generation for Repository-Level Feature Addition [53.50448142467294]
RAIMは、リポジトリレベルの機能追加のための、多設計およびアーキテクチャ対応のフレームワークである。
複数の多様な実装設計を生成することで、線形パッチから切り離される。
NoCode-bench Verifiedデータセットの実験では、RAIMが新しい最先端のパフォーマンスを確立することが示されている。
論文 参考訳(メタデータ) (2026-03-02T12:50:40Z) - DesignAsCode: Bridging Structural Editability and Visual Fidelity in Graphic Design Generation [21.789797121277896]
DesignAsCodeはHTML/CSSを使ったプログラミングタスクとしてグラフィックデザインを再定義する新しいフレームワークである。
DesignAsCodeは、構造的妥当性と美的品質の両方において、最先端のレンダリングベースラインを大幅に上回っている。
論文 参考訳(メタデータ) (2026-02-06T05:10:19Z) - VSA:Visual-Structural Alignment for UI-to-Code [29.15071743239679]
視覚テキストアライメントにより組織化された資産を合成するための多段階パラダイムであるbfVSA(VSA)を提案する。
私たちのフレームワークは、最先端のベンチマークよりもコードのモジュール化とアーキテクチャの一貫性を大幅に改善します。
論文 参考訳(メタデータ) (2025-12-23T03:55:45Z) - VCU-Bridge: Hierarchical Visual Connotation Understanding via Semantic Bridging [49.55286536996476]
視覚的意味理解の人間的な階層を運用するフレームワークであるVCU-Bridgeを提案する。
このフレームワーク上に構築したHVCU-Benchは、階層的視覚的意味理解のためのベンチマークであり、明確なレベルの診断を行う。
論文 参考訳(メタデータ) (2025-11-22T17:01:03Z) - MLLM-Based UI2Code Automation Guided by UI Layout Information [17.177322441575196]
3つのキーモジュールを含む実世界のWebページイメージからUIコードを生成するMLLMベースの新しいフレームワークを提案する。
評価のために、Snap2Codeという350の現実世界のWebサイトを含む新しいベンチマークデータセットを構築しました。
論文 参考訳(メタデータ) (2025-06-12T06:04:16Z) - GLDesigner: Leveraging Multi-Modal LLMs as Designer for Enhanced Aesthetic Text Glyph Layouts [53.568057283934714]
本稿では,コンテンツ対応のテキストロゴレイアウトを生成するVLM(Vision-Language Model)ベースのフレームワークを提案する。
本稿では,複数のグリフ画像を同時に処理するための計算コストを削減する2つのモデル手法を提案する。
本モデルでは,既存の公開データセットの5倍の広義のテキストロゴデータセットを2つ構築する。
論文 参考訳(メタデータ) (2024-11-18T10:04:10Z) - Prototype2Code: End-to-end Front-end Code Generation from UI Design Prototypes [13.005027924553012]
ビジネスニーズでエンドツーエンドのフロントエンドコード生成を実現するPrototype2Codeを紹介します。
Prototype2Codeでは、設計リンティングをワークフローに組み込んで、断片化された要素や知覚グループの検出に対処する。
階層構造を最適化し、UI要素の型をインテリジェントに認識することで、Prototype2Codeはより読みやすく構造的にクリアなコードを生成する。
論文 参考訳(メタデータ) (2024-05-08T11:32:50Z) - SGTR+: End-to-end Scene Graph Generation with Transformer [42.396971149458324]
シーングラフ生成(SGG)は、その構成特性のため、困難な視覚的理解課題である。
これまでのほとんどの作業ではボトムアップ、2段階またはポイントベースの1段階のアプローチを採用していた。
本稿では、上記の問題に対処する新しいSGG法を提案し、そのタスクを二部グラフ構築問題として定式化する。
論文 参考訳(メタデータ) (2024-01-23T15:18:20Z)
関連論文リストは本サイト内にある論文のタイトル・アブストラクトから自動的に作成しています。
指定された論文の情報です。
本サイトの運営者は本サイト(すべての情報・翻訳含む)の品質を保証せず、本サイト(すべての情報・翻訳含む)を使用して発生したあらゆる結果について一切の責任を負いません。