多模态大模型在根据静态截图生成网页代码(Image-to-Code)方面已展现出不俗能力,这让许多人对AI自动化前端开发充满期待。
然而,一个网页的真正价值远不止于其静态布局。用户的点击、筛选、表单提交,乃至游戏中的每一步操作,都构成了其核心的交互功能。这些动态、有状态的交互逻辑,恰恰是传统静态评测无法触及的盲区。
为了填补这一关键空白,上海人工智能实验室联合浙江大学等机构的研究者,提出了IWR-Bench——一个旨在更真实地评估LVLM交互式网页重建能力的评测基准。
IWR-Bench的核心转变在于,它不再提供静态截图,而是要求模型观看一段记录了完整用户操作流程的视频,并结合网页所需的全部静态资源(如图片、图标、子视频等),去理解并复现整个页面的动态行为。任务的复杂性跨度很大,从简单的浏览功能,到需要逆向工程游戏规则的2048、订机票等应用。
这项任务的难度远超预期。在对28个主流模型的全面测试中,即便是表现最好的模型GPT-5,其综合得分也仅有36.35分。这一结果清晰地指出了当前模型的核心短板,IWR-Bench不仅为领域提供了一个更具挑战性的新目标,也为未来的研究指出了一个新的方向。
核心亮点:
△10个代表性模型在IWR-Bench任务上的评测总览
现有的网页代码生成基准(如Design2Code、WebSight)主要聚焦于静态截图转代码(image2code),而IWR-Bench则专注于动态视频转可交互网页代码(video2code):
传统任务: 给AI一张网页截图 → 生成HTML/CSS代码
IWR任务: 给AI一段用户操作视频 + 网页静态资源 → 生成包含完整交互逻辑的代码
值得一提的是,每个任务都提供了完整的静态资源(图片、图标、视频等),并且所有文件名都经过匿名化处理(如logo.png → asset_001.png),迫使模型必须依靠视觉匹配而非语义推理。静态资源的引入,也为直接基于渲染结果而非HTML代码进行评测提供了关键帮助。
下图为IWR-Bench任务和评测总览,模型输入包括(a)用户交互视频,(b)爬取的静态资源的缩略图与文件路径,要求模型输出html代码。评测时,通过agent在浏览器上基于(c)标注的操作轨迹进行操作,以实现基于检查点的自动化评分。
IWR任务对模型的三大核心挑战包括:
IWR任务的规模和覆盖范围如下:
IWR-Bench采用了一套严格的自动化评测协议,通过编程代理(基于browser-use库)来模拟真实用户的网页操作。
交互功能分数(IFS):衡量功能正确性
视觉保真度分数(VFS):衡量视觉还原度 - 结合低级特征(OCR文本相似度、DINO结构相似度)
△IWR-Bench在28个模型上的评测结果
研究人员从中得到了三个关键发现。
首先,功能实现是最大瓶颈。
所有模型的VFS都显著高于IFS,这揭示了一个核心问题:
模型能够较好地复现静态视觉效果,但在生成事件驱动逻辑方面严重不足。
例如,GPT-5能够达到64.25%的视觉保真度,但功能正确性仅为24.39%——这意味着即使页面”看起来对”,实际操作时有75%以上的功能无法正常工作。
其次,thinking版本带来部分提升。
“thinking”版本模型普遍表现更好:
但提升幅度有限,说明基础模型能力仍是决定性因素。
另外,现在的专有视频理解模型效果不如通用多模态模型。
专门针对视频理解训练的模型(如VideoLLaMA3、InternVideo)表现垫底,而通用的多模态大模型表现更优。这表明,该任务与传统的视频理解任务具有显著的差异性。
IWR-Bench的推出,标志着AI从“看懂静态网页”到“理解动态交互”的关键一步。36分的成绩告诉我们:这条路还很长。这不仅是对AI多模态能力的一次全面体检,更是为多模态能力涌现指明了下一阶段的攻坚方向。
IWR-Bench由上海人工智能实验室联合浙大、2077AI、港中文、斯坦福等单位共同完成,第一作者陈杨是浙江大学硕士生,通讯作者为上海人工智能实验室沈宇帆、石博天。
论文链接:
https://arxiv.org/abs/2509.24709
代码地址:
https://github.com/L-O-I/IWR-Bench
数据地址:
https://huggingface.co/datasets/IWR-Bench/IWR-Bench
项目主页:
https://l-o-i.github.io/IWR-Bench/
文章来自于微信公众号“量子位”。
【开源免费】AutoGPT是一个允许用户创建和运行智能体的(AI Agents)项目。用户创建的智能体能够自动执行各种任务,从而让AI有步骤的去解决实际问题。
项目地址:https://github.com/Significant-Gravitas/AutoGPT
【开源免费】MetaGPT是一个“软件开发公司”的智能体项目,只需要输入一句话的老板需求,MetaGPT即可输出用户故事 / 竞品分析 / 需求 / 数据结构 / APIs / 文件等软件开发的相关内容。MetaGPT内置了各种AI角色,包括产品经理 / 架构师 / 项目经理 / 工程师,MetaGPT提供了一个精心调配的软件公司研发全过程的SOP。
项目地址:https://github.com/geekan/MetaGPT/blob/main/docs/README_CN.md
【开源免费】screenshot-to-code是一个可以将网页截图或者原型图片直接转化成前端代码的AI工具。这个项目非常有想象力的让AI提高了前端的开发效率。
项目地址:https://github.com/abi/screenshot-to-code?tab=readme-ov-file
在线使用:https://screenshottocode.com/