論文の概要: Bridging Design and Development with Automated Declarative UI Code Generation

• arxiv url: http://arxiv.org/abs/2409.11667v1
• Date: Wed, 18 Sep 2024 03:04:12 GMT
• ステータス: 翻訳完了
• システム内更新日: 2024-09-19 19:19:53.394574
• Title: Bridging Design and Development with Automated Declarative UI Code Generation
• Title（参考訳）: 自動宣言型UIコード生成によるブリッジ設計と開発
• Authors: Ting Zhou, Yanjie Zhao, Xinyi Hou, Xiaoyu Sun, Kai Chen, Haoyu Wang,
• Abstract要約: 宣言的なUIフレームワークはモバイルアプリ開発で広く採用されており、コード可読性の改善やメンテナンスの容易化といったメリットを提供している。 マルチモーダルな大規模言語モデル(MLLM)の最近の進歩は、ユーザインターフェース(UI)設計から直接モバイルアプリコードを生成することを約束している。 本稿では,コンピュータビジョン(CV),MLLM,反復的コンパイラ駆動最適化を併用して,宣言型UIコードを設計から生成・洗練する自動アプローチであるDeclaUIを提案する。
• 参考スコア（独自算出の注目度）: 18.940075474582564
• License: http://arxiv.org/licenses/nonexclusive-distrib/1.0/
• Abstract: Declarative UI frameworks have gained widespread adoption in mobile app development, offering benefits such as improved code readability and easier maintenance. Despite these advantages, the process of translating UI designs into functional code remains challenging and time-consuming. Recent advancements in multimodal large language models (MLLMs) have shown promise in directly generating mobile app code from user interface (UI) designs. However, the direct application of MLLMs to this task is limited by challenges in accurately recognizing UI components and comprehensively capturing interaction logic. To address these challenges, we propose DeclarUI, an automated approach that synergizes computer vision (CV), MLLMs, and iterative compiler-driven optimization to generate and refine declarative UI code from designs. DeclarUI enhances visual fidelity, functional completeness, and code quality through precise component segmentation, Page Transition Graphs (PTGs) for modeling complex inter-page relationships, and iterative optimization. In our evaluation, DeclarUI outperforms baselines on React Native, a widely adopted declarative UI framework, achieving a 96.8% PTG coverage rate and a 98% compilation success rate. Notably, DeclarUI demonstrates significant improvements over state-of-the-art MLLMs, with a 123% increase in PTG coverage rate, up to 55% enhancement in visual similarity scores, and a 29% boost in compilation success rate. We further demonstrate DeclarUI's generalizability through successful applications to Flutter and ArkUI frameworks.
• Abstract（参考訳）: 宣言的なUIフレームワークはモバイルアプリ開発で広く採用されており、コード可読性の改善やメンテナンスの容易化といったメリットを提供している。 これらの利点にもかかわらず、UI設計を機能コードに変換するプロセスは困難で時間がかかる。 マルチモーダル大規模言語モデル(MLLM)の最近の進歩は、ユーザインターフェース(UI)設計から直接モバイルアプリコードを生成することを約束している。 しかし、このタスクへのMLLMの直接適用は、UIコンポーネントを正確に認識し、インタラクションロジックを包括的にキャプチャする際の課題によって制限される。 これらの課題に対処するために、コンピュータビジョン(CV)、MLLM、反復コンパイラ駆動最適化を相乗化して宣言型UIコードを設計から生成・洗練する自動化アプローチであるDeclaUIを提案する。 DeclarUIは、正確なコンポーネントセグメンテーション、複雑なページ間の関係をモデル化するためのページ遷移グラフ(PTG)、反復最適化を通じて、視覚的忠実度、機能的完全性、コード品質を向上させる。 この評価では、広く採用されている宣言型UIフレームワークであるReact Nativeのベースラインを上回り、96.8%のPTGカバレッジ率と98%のコンパイル成功率を達成した。 特に、DeclaUIは最先端のMLLMよりも大幅に改善され、PTGカバレッジレートが123%増加し、視覚的類似度スコアが55%向上し、コンパイル成功率が29%向上した。 さらに、FlutterやArkUIフレームワークへのアプリケーションの成功を通じて、DeclaUIの汎用性を実証します。

関連論文リスト

• Advancing vision-language models in front-end development via data synthesis [30.287628180320137]
  本稿では,高品質な画像テキストデータを合成し,フロントエンド開発における多様な特徴を捉えた反射型エージェントワークフローを提案する。 このワークフローは、実際のプロジェクトから自己完結型フットノートA textbfself-完結型コードスニペットを抽出し、対応するビジュアルアウトプットをレンダリングし、設計要素を機能コードにリンクする詳細な記述を生成する。 私たちは、合成データセットに基づいてトレーニングされた大規模なビジョン言語モデルであるFlameを構築し、$textpass@k$メトリックを使用してReactコードを生成する効果を実証しています。
  論文  参考訳（メタデータ） (2025-03-03T14:54:01Z)
• Comparative Analysis of Large Language Models for Context-Aware Code Completion using SAFIM Framework [5.312946761836463]
  大規模言語モデル(LLM)はコード補完に革命をもたらし、よりインテリジェントでコンテキスト対応な機能へと変貌を遂げた。 本稿では,Gemini 1.5 Flash, Gemini 1.5 Pro, GPT-4o, GPT-4o-mini, GPT-4 Turboなど,チャットベースのLLMの性能を評価する。
  論文  参考訳（メタデータ） (2025-02-21T06:32:31Z)
• ContextFormer: Redefining Efficiency in Semantic Segmentation [48.81126061219231]
  畳み込み法は、局所的な依存関係をうまく捉えるが、長距離関係に苦慮する。 ビジョントランスフォーマー(ViT)は、グローバルなコンテキストキャプチャでは優れるが、高い計算要求によって妨げられる。 我々は,リアルタイムセマンティックセグメンテーションの効率,精度,堅牢性のバランスをとるために,CNN と ViT の強みを活用したハイブリッドフレームワーク ContextFormer を提案する。
  論文  参考訳（メタデータ） (2025-01-31T16:11:04Z)
• Iris: Breaking GUI Complexity with Adaptive Focus and Self-Refining [67.87810796668981]
  インフォメーション・インフォメーション・インフォメーション・クロッピング(ISC)と自己精製デュアルラーニング(SRDL) Irisは850KのGUIアノテーションだけで、複数のベンチマークで最先端のパフォーマンスを実現している。 これらの改善は、WebとOSエージェントの両方の下流タスクで大幅に向上した。
  論文  参考訳（メタデータ） (2024-12-13T18:40:10Z)
• ShowUI: One Vision-Language-Action Model for GUI Visual Agent [80.50062396585004]
  グラフィカルユーザインタフェース(GUI)アシスタントの構築は、人間のワークフロー生産性を向上させるための大きな約束である。 デジタルワールドにおける視覚言語アクションモデル、すなわちShowUIを開発し、以下のイノベーションを特徴とする。 256Kデータを使用した軽量な2BモデルであるShowUIは、ゼロショットのスクリーンショットグラウンドで75.1%の精度を実現している。
  論文  参考訳（メタデータ） (2024-11-26T14:29:47Z)
• Explainable Behavior Cloning: Teaching Large Language Model Agents through Learning by Demonstration [15.786934863494785]
  本稿では,大規模言語モデル(LLM)と学習デモによる行動クローニングを組み合わせた新しいアプローチである,説明可能な行動クローニングLDMエージェント(EBC-LLMAgent)を提案する。 EBC-LLMAgentは3つのコアモジュールで構成されている: デモ生成 コード生成、UIマッピング。 多様なドメインからの5つの人気のあるモバイルアプリケーションに対する大規模な実験は、EBC-LLMAgentの優れた性能、タスク完了における高い成功率、目に見えないシナリオへの効率的な一般化、有意義な生成を実証している。
  論文  参考訳（メタデータ） (2024-10-30T11:14:33Z)
• EMMA: Efficient Visual Alignment in Multi-Modal LLMs [56.03417732498859]
  EMMAは、視覚的およびテキスト的エンコーディングを効率的に融合するために設計された軽量なクロスプラットフォームモジュールである。 EMMAは複数のタスクのパフォーマンスを最大9.3%向上させ、幻覚に対する堅牢性を大幅に向上させる。
  論文  参考訳（メタデータ） (2024-10-02T23:00:31Z)
• A Rule-Based Approach for UI Migration from Android to iOS [11.229343760409044]
  既存のAndroidアプリUIからiOSへのクロスプラットフォーム移行を可能にするGUIMIGRATORと呼ばれる新しいアプローチを提案する。 GuiMIGRATORは、UIスケルトンツリーを構築するために、Android UIレイアウト、ビュー、リソースを抽出し解析する。 GuiMIGRATORは、ターゲットコードテンプレートを使用して最終的なUIコードファイルを生成し、iOS開発プラットフォームでコンパイルされ、検証される。
  論文  参考訳（メタデータ） (2024-09-25T06:19:54Z)
• Inference Optimization of Foundation Models on AI Accelerators [68.24450520773688]
  トランスフォーマーアーキテクチャを備えた大規模言語モデル(LLM)を含む強力な基礎モデルは、ジェネレーティブAIの新たな時代を支えている。 モデルパラメータの数が数十億に達すると、実際のシナリオにおける推論コストと高いレイテンシーが排除される。 このチュートリアルでは、AIアクセラレータを用いた補完推論最適化テクニックに関する包括的な議論を行っている。
  論文  参考訳（メタデータ） (2024-07-12T09:24:34Z)
• CoCo-Agent: A Comprehensive Cognitive MLLM Agent for Smartphone GUI Automation [61.68049335444254]
  MLLM(Multimodal large language model)は、人間のような自律型言語エージェントが現実世界の環境と相互作用する可能性を示している。 包括的環境認識(CEP)と条件付き行動予測(CAP)の2つの新しいアプローチを備えた包括的認知型LLMエージェントCoCo-Agentを提案する。 AITW と META-GUI ベンチマークにおいて,我々のエージェントは実シナリオで有望な性能を示す新しい最先端性能を実現する。
  論文  参考訳（メタデータ） (2024-02-19T08:29:03Z)
• What Makes for Good Visual Instructions? Synthesizing Complex Visual Reasoning Instructions for Visual Instruction Tuning [115.19451843294154]
  マルチモーダル大言語モデル(MLLM)のゼロショット一般化能力向上のためのビジュアルインストラクションチューニング 本稿では,高品質な視覚的推論命令を自動生成するための体系的アプローチを提案する。 我々のデータセットは、MME-CognitionにおけるMiniGPT-4とBLIP-2の性能をそれぞれ32.6%、28.8%向上させるなど、比較したMLLMの性能を一貫して向上させる。
  論文  参考訳（メタデータ） (2023-11-02T15:36:12Z)
• EGFE: End-to-end Grouping of Fragmented Elements in UI Designs with Multimodal Learning [10.885275494978478]
  断片化された要素をグループ化することで、生成されたコードの可読性と保守性を大幅に向上させることができる。 現在の手法では、フラグメントされた要素をグループ化する手作りのルールを導入する2段階の戦略を採用している。 UIシークエンス予測によるエンドツーエンドのグルーピングフラグメンテッド要素の自動生成手法EGFEを提案する。
  論文  参考訳（メタデータ） (2023-09-18T15:28:12Z)
• SwiftSage: A Generative Agent with Fast and Slow Thinking for Complex Interactive Tasks [81.9962823875981]
  我々は、人間の認知の二重プロセス理論に触発された新しいエージェントフレームワークSwiftSageを紹介する。 フレームワークは、高速で直感的な思考を表すSwiftモジュールと、意図的な思考プロセスをエミュレートするSageモジュールの2つの主要なモジュールで構成されている。 ScienceWorldベンチマークの30タスクでは、SwiftSageはSayCan、ReAct、Reflexといった他のメソッドよりも大幅に優れています。
  論文  参考訳（メタデータ） (2023-05-27T07:04:15Z)

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

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