支付宝发布UI-UG：全新多模态大模型实现UI理解与生成的完美融合

在移动互联网时代，用户界面（UI）不仅是用户与数字世界的连接桥梁，更直接影响到用户体验和业务转化效果。随着AI技术的发展，越来越多的学术与产业界开始关注如何提升UI设计与开发的效率。为了进一步推进UI领域的技术创新，支付宝体验技术部发布了首个将UI理解与UI生成两大核心能力结合的垂直多模态大模型——UI-UG（A Unified MLLM for UI Understanding and Generation）。

UI-UG通过独特的模型架构和创新的训练策略，成功解决了传统UI理解与生成任务的局限性，为行业带来了全新的解决方案。现如今，UI-UG-7B模型已在HuggingFace和Github上开源，供开发者和研究人员使用和探索。

UI-UG模型的核心创新：UI理解与生成的结合

UI-UG模型的最大创新在于将UI理解与UI生成两项任务融合为一个统一的框架。传统上，这两项任务常常是独立进行训练和优化的，但UI-UG认为，理解与生成是相辅相成、信息共享的共同体：

UI理解：模型通过深刻理解参考图片的布局、色彩、文字内容及元素类别，从而提取出UI高层次结构信息。
UI生成：模型需要根据文本描述或参考图片生成结构化的UI代码，而这种生成任务所训练出的结构化思维，正是理解任务中的关键。

实验数据也证明，UI-UG通过将理解与生成结合进行混合训练，相比单独训练，效果得到了显著提升。

UI-UG的四大核心能力

UI-UG模型不仅是UI理解和生成的集大成者，它还具备四大核心能力，能够全面覆盖UI的主要应用场景：

指代（Referring）：模型能够准确描述图片中特定区域的UI内容，如识别按钮、图标、弹窗等，并提取OCR文字和颜色值。例如，它能够准确回答“描述一下这个区域的UI类型”。
检测（Grounding）：全面检测图片中的所有UI元素，定位特定类型的元素，并识别基础组件（如文本、图片、icon）及交互元素（如关闭按钮、返回按钮）等，为自动化操作提供基础。
描述（Captioning）：为整张UI图片生成结构化的描述信息，遵循特定格式规范，为后续分析和生成任务提供信息支持。
生成（Generation）：基于文本描述和参考图片，UI-UG能够生成特定UI DSL代码，支持动态数据绑定和渐进式渲染。在支付宝内部实测中，卡片级UI生成速度可达到5秒，效率提升显著。

技术突破：数据、训练与优化的三重创新

UI-UG的创新不仅体现在模型架构上，还涉及到数据构建、训练优化等多个方面：

数据构建：
UI-UG基于海量业务场景构建了全新的数据集，包括超过30,000张UI页面，涵盖多个业务领域，确保了数据的多样性和代表性。特别强化了对交互元素的标注，并通过CV模型预标注和人工校验模式，确保了数据质量。
两阶段训练：
- 监督微调（SFT）阶段：基于Qwen2.5-VL-7B模型进行微调，使用18万条VQA数据训练。
- 强化学习阶段：通过强化学习方法，优化UI理解和生成任务中的各项指标，提升了模型在指代、定位和生成任务中的表现。

实验验证：UI-UG领跑UI领域

在与多个模型的对比实验中，UI-UG在UI理解和UI生成任务中都表现出色：

在UI理解任务中，UI-UG在指代任务和定位任务的准确率上明显优于传统的视觉模型，并超越了闭源模型如GPT-4o、Claude 3.7等。
在UI生成任务中，UI-UG不仅生成质量接近数据源模型Qwen2.5-VL-72B，而且生成速度提升了4-6倍，响应时间仅为5-6秒，大大优于其他通用大模型的20-30秒响应时间。