2025 · 期刊论文
分而治之:从截图生成界面代码
Divide-and-Conquer: Generating UI Code from Screenshots
沿视觉分隔线递归切分网页截图,由多模态模型为每个叶子片段生成 HTML/CSS,再将子片段代码逐级向上组装为完整页面;评估涵盖 GPT-4o、Gemini 与 Claude 系列模型以及一项小规模开发者研究。
研究范围与局限
该方法以 HTML/CSS 重建静态视觉布局,不重建交互、JavaScript 行为或后端逻辑。测试页面是将图片替换为占位图的自包含快照;主要评测从 348 个热门网站中抽取 111 个,另加 80 个更复杂的 GitHub Pages 页面,可用性研究仅有四名参与者。分割依赖人工设定的阈值,组装阶段仍可能错排元素。
与本合集的关联
提供按区域分解、从截图重建网站布局的方法,与以基准评测为主的网站论文互为补充。
发表与复核详情
- 发表载体
- Proceedings of the ACM on Software Engineering
- 发表状态
- 期刊论文
- 出版/提交日期
- 2025 年 6 月 19 日
- 日期依据
- ACM 向 Crossref 提交的元数据将在线及印刷版出版日期列为 2025 年 6 月 19 日;论文正文将期次标为 2025 年 7 月。
- arXiv 首次提交
- 2024 年 6 月 24 日
- arXiv
- 2406.16386
- 已复核的 arXiv 版本
- v3
- DOI
- 10.1145/3729364
这是 PACMSE 第 2 卷 FSE 专期的期刊论文,页码为 2099–2122(文章编号 FSE094)。正式标题取代了 arXiv 标题“Automatically Generating UI Code from Screenshot: A Divide-and-Conquer-Based Approach”。作者姓名以论文正文为准,正文与 Crossref 均写作“Michael Lyu”,arXiv 记录则为“Michael R. Lyu”。核查期间无法读取 ACM 数字图书馆版本;审阅文本为 24 页、ACM 排版的 arXiv v3。论文所链接的仓库在固定提交中没有许可证文件;完整数据集另存于 Hugging Face,未附数据集说明卡。
来源复核于
本合集仅做来源复核,未重新运行论文实验。请通过原始论文或 BibTeX 引用原作者。