arXiv cs.CL· Shanchao Liang, Nan Jiang, Shangshu Qian, Lin Tan·· 11 小时前AI 评分31
Waffle：用结构感知注意力与对比微调提升多模态模型 UI 转 HTML 能力
WAFFLE: Finetuning Multi-Modal Models for Automated Front-End Development
AI 导读
Waffle 是一种新的微调策略，通过结构感知注意力机制增强 LLM 对 HTML 层级结构的理解，并用对比微调对齐 UI 图像与 HTML 代码。
正文 · AI 翻译
摘要：Web 开发涉及将 UI 设计转化为功能性的网页，由于 HTML 层级结构和样式的复杂性，这对初学者和经验丰富的开发者来说都可能很困难。尽管大型语言模型（LLM）在生成源代码方面已展现出潜力，但在 UI 到 HTML 代码生成中仍存在两大挑战：（1）如何有效地为 LLM 表示 HTML 的层级结构；（2）如何弥合 UI 设计的视觉特性与 HTML 代码基于文本的格式之间的差距。为应对这些挑战，我们提出了 Waffle，一种新的微调策略，它使用结构感知注意力机制来提升 LLM 对 HTML 结构的理解，并采用对比微调方法来对齐 LLM 对 UI 图像和 HTML 代码的理解。使用 Waffle 微调的模型在我们新的基准 WebSight-Test 和现有基准 Design2Code 上，HTML 匹配度最高提升 9.00 pp（百分点），CW-SSIM 提升 0.0982，CLIP 提升 32.99，LLEM 提升 27.12 pp，优于当前的微调方法。
| 学科： | 软件工程（cs.SE）；计算与语言（cs.CL）；计算机视觉与模式识别（cs.CV） |
| 引用为： | arXiv:2410.18362 [cs.SE] |
| （或本版本的 arXiv:2410.18362v4 [cs.SE]） | |
| https://doi.org/10.48550/arXiv.2410.18362 由 DataCite 颁发的 arXiv DOI |
提交历史
来自：Shanchao Liang [查看邮箱]
[v1]
2024年10月24日 星期四 01:49:49 UTC（5,906 KB）
[v2]
2025年6月24日 星期二 20:35:02 UTC（5,316 KB）
[v3]
2026年3月2日 星期一 21:03:26 UTC（5,311 KB）
[v4]
2026年10月20日 星期二 04:48:34 UTC（5,313 KB）
来源：arXiv cs.CL · arxiv.org