Code2World：基于可渲染代码生成的GUI世界模型 Code2World: A GUI World Model via Renderable Code Generation
将GUI下一状态预测转化为HTML代码生成，用渲染感知强化学习实现高保真视觉模拟
前置知识
GUI世界模型 (GUI World Model)
GUI世界模型是一种能够模拟GUI环境动态变化的模型，它可以在不实际执行操作的情况下预测用户操作后的界面状态。类似于物理引擎能预测物体运动轨迹，GUI世界模型能预测点击、滑动等操作后屏幕会变成什么样。这种能力对于GUI Agent的规划和决策至关重要，因为它允许agent在执行前'预演'多个可能的操作，选择最优方案。
本文的核心就是构建一个高质量的GUI世界模型，理解这个概念是理解论文动机和方法的基础
Vision-Language Model (VLM)
视觉语言模型是能够同时处理图像和文本的大规模多模态模型，如Qwen3-VL、GPT-4V等。这类模型通过在大规模图文数据上预训练，学会了跨模态理解能力，能够根据图像回答问题、生成描述或执行指令。在GUI领域，VLM可以直接'看'屏幕截图并理解界面内容，无需依赖结构化元数据。
本文使用Qwen3-VL-8B作为骨干网络，VLM的能力直接决定了代码生成和视觉理解的质量
Renderable Code Generation (可渲染代码生成)
这是一种将视觉状态预测转化为代码生成任务的范式。传统方法直接预测像素（图像生成）或文本描述（语言生成），而可渲染代码生成则是生成HTML/CSS等结构化代码，然后通过浏览器渲染引擎确定性地转换为可视化界面。这种方法的优势在于：代码本身保证了结构可控性，渲染过程保证了视觉保真度，两者兼得。
这是本文的核心创新点——将GUI模拟问题重新定义为代码生成问题，突破了文本表示和像素表示各自的局限
Group Relative Policy Optimization (GRPO)
GRPO是一种强化学习算法，最初由DeepSeek-Math提出用于数学推理任务。它的核心思想是：对于每个输入，从当前策略采样一组输出（如4个），计算每个输出的奖励，然后用组内奖励的均值和标准差来归一化优势函数。这样做的好处是不需要额外训练一个价值网络（critic），大大降低了训练复杂度和内存开销。本文将GRPO应用于GUI世界模型的训练，用渲染结果作为奖励信号。
GRPO是本文Render-Aware RL的优化算法基础，理解它才能理解训练流程
VLM-as-a-Judge
用VLM作为评判者来自动评估生成质量的方法。传统评估指标如CLIP、DINO等基于嵌入相似度，对像素级变化敏感但缺乏语义理解；而SSIM、LPIPS等又过于关注纹理细节。VLM-as-a-Judge利用VLM的推理能力，从语义层面判断生成结果是否正确，比如判断'点击按钮后是否打开了正确的弹窗'。本文用这种方式同时作为RL的奖励信号和评估指标。
本文的奖励函数和评估指标都依赖VLM-as-a-Judge，这是方法可行性的关键
研究动机
当前的GUI Agent在执行操作时缺乏'预见能力'，就像一个人蒙着眼睛走路，只能走一步看一步。人类在点击按钮前会在脑海中预想点击后的效果，从而提前判断操作是否正确。但现有的GUI Agent直接执行操作，如果当前步骤出错，往往需要多步修正才能恢复，甚至直接导致任务失败。这在高风险场景下尤其危险——比如确认支付或删除关键数据时，操作是不可逆的。现有两类GUI世界模型各有致命缺陷：文本方法（如用LLM预测状态变化的文字描述）丢失了关键的视觉空间信息，研究表明视觉反馈能显著增强agent的推理能力；像素方法（如用扩散模型生成未来截图）在连续像素空间中难以建模GUI离散状态的精确转换，特别是在文本丰富的界面中难以保持细粒度的结构可控性。最终，这两种表示都无法同时实现高保真视觉模拟和精确结构可控性。
本文的目标是本文的目标是构建一个高质量的GUI世界模型，具体而言要同时满足两个要求：(1) 精确的下一UI预测——模型必须在状态转换过程中同时实现高视觉保真度并严格遵循交互逻辑；(2) 有效的GUI Agent增强——世界模型必须能够作为即插即用的模块，实际提升现有GUI agent的导航成功率。作者希望通过引入一种新的表示范式，从根本上解决视觉保真度和结构可控性之间的矛盾。
与已有工作不同的是，本文的独特切入角度是观察到一个被忽视的事实：GUI本身就是由程序代码（如HTML/CSS）原生创建的。基于这个洞察，作者提出了一个范式转换：将GUI模拟视为可渲染代码生成问题。与抽象的文本描述或原始像素不同，符号化代码天然保证了结构可控性，同时可以通过确定性渲染实现高保真度可视化。这种代码表示巧妙地统一了文本表示的语义精确性和像素表示的视觉丰富性，找到了一个两全其美的中间地带。这是此前研究者未曾探索过的第三条路径。
核心方法
Code2World的核心思路可以用一个类比来理解：如果把GUI比作一栋建筑，传统的文本方法只描述'建筑变高了'，像素方法试图用画笔精确描绘新建筑的每一个细节，而Code2World则是生成一份建筑蓝图（HTML代码），然后用确定性的施工（浏览器渲染）来得到精确的建筑成品。具体技术路线分为三个阶段：首先，构建AndroidCode数据集，将GUI轨迹转化为高质量HTML代码，解决数据稀缺问题；其次，通过两阶段训练优化模型——先用监督微调（SFT）让模型学会HTML语法和UI布局规则（冷启动），再用Render-Aware强化学习（RARL）以渲染结果为奖励信号，对齐文本代码生成与视觉现实；最后，通过'提议-模拟-选择'的推理模式，将Code2World作为即插即用的模拟器增强现有GUI Agent。
本文最核心的创新是Render-Aware强化学习（RARL）策略。现有方法的根本问题是：SFT阶段将代码仅视为文本，模型虽然学会了生成语法正确的HTML，但对最终渲染出的视觉效果是'盲'的——它不知道自己生成的代码渲染出来长什么样。RARL的关键洞察是：用渲染后的最终视觉结果作为学习信号，而不是仅仅依赖代码文本本身。具体来说，它设计了双重奖励：视觉语义奖励（R_sem）用VLM评估渲染结果与真实截图的结构布局是否一致，但容忍风格差异（因为代码生成用语义占位符替代真实图片）；动作一致性奖励（R_act）用VLM评估状态转换是否符合操作逻辑（比如点击返回按钮是否真的回到了上一页）。这两个奖励分别从'看起来对'和'逻辑上对'两个维度约束模型，防止奖励黑客——如果只用R_sem，模型可能学会'画'出好看的界面但逻辑错误；如果只用R_act，可能逻辑正确但渲染质量差。这种双奖励设计是与已有方法最本质的区别。
方法步骤详情
整个方法分为数据构建和模型优化两大步骤。数据构建阶段（AndroidCode）：(1) 从AndroidControl数据集获取原始GUI轨迹（截图+动作坐标）；(2) 用GPT-5将截图翻译为结构化HTML代码，施加严格约束——标准化根容器固定尺寸、用语义占位符替代不可靠的图片URL（如[IMG: Red Shoe]）、用内联SVG渲染UI图标；(3) 渲染生成的HTML并与真实截图计算SigLIP相似度，超过0.9阈值的直接保留，低于阈值的触发修订循环——将真实截图、渲染图像和当前代码反馈给GPT-5进行视觉比较和代码修正，最多迭代1次。模型优化阶段：(1) 冷启动SFT——使用70%的AndroidCode数据对Qwen3-VL-8B进行全参数微调，冻结视觉编码器和多模态投影器，学习率2e-5，训练2个epoch，最大序列长度24576 tokens；(2) Render-Aware RL——使用剩余30%数据，采用GRPO算法，每个提示采样4个候选输出，学习率1e-6，KL散度惩罚系数0.01，R_sem和R_act等权重组合。
技术新颖性
Code2World的技术新颖性体现在三个层面。首先是范式层面的创新：这是首个将GUI世界建模视为可渲染代码生成的工作，开辟了继文本表示和像素表示之后的第三条技术路线。此前没有研究者系统地探索过用HTML/CSS作为GUI状态的中间表示。其次是训练策略的创新：Render-Aware RL是首个将渲染结果作为RL奖励信号来优化代码生成模型的尝试。虽然RLHF已被广泛用于语言模型，但将其应用于GUI代码生成并设计视觉-逻辑双重奖励是全新的。第三是评估框架的创新：作者提出了四维度VLM-as-a-Judge评估协议（动作依从性、动作可识别性、元素对齐、布局完整性），专门针对GUI世界模型设计，弥补了通用图像生成指标（如CLIP、DINO）在GUI场景下的不足。
实验结果
实验结果表明Code2World-8B以仅8B参数量达到了与GPT-5和Gemini-3-Pro-Image等顶级商业模型相当的性能，在GUI世界建模任务上树立了新的开源标杆。在下一UI预测任务上（Table 1），Code2World在Android Control（ID设置）上的动作依从性（Sad）达到94.28，超过GPT-5的94.02和Gemini-3-Pro-Image的92.63；动作可识别性（Sid）达88.64，仅次于GPT-5的90.15；元素对齐（Sele）71.35和布局完整性（Slay）70.32均优于大多数基线。在GUI Odyssey（OOD跨应用设置）上，Code2World展现出卓越的泛化能力，Sad维持在92.73，Sid达78.22，相比开源基线的性能衰减要小得多。特别值得注意的是，Code2World甚至能模拟时间流逝——在一次状态转换中捕捉到了时间从5:46变为5:47的细节，展现了其强大的世界建模能力。在下游agent增强实验中（Table 2），Code2World使Qwen2.5-VL-7B的Grounding准确率提升5.23，使Mobile-Agent-v3-7B的Type准确率达到最佳。在AndroidWorld在线评估中（Figure 5），Code2World为所有评估模型都带来了一致的性能提升，其中Gemini-2.5-Flash的成功率从41.4%提升到50.9%（+9.5%），Qwen3-VL-8B提升了22.9%，GLM-4.6V-Flash提升了22.2%。消融实验（Table 3, Figure 6）进一步验证了各组件的贡献：单独使用SFT即可将Sad从59.20提升到78.45，R_sem主要提升视觉质量（SigLIP从71.50到76.10），R_act主要提升功能逻辑（Sad从78.45到88.20），两者结合的完整模型达到最优。
查看结构化数据
| 任务 | 指标 | 本文 | 基线 | 提升 |
|---|---|---|---|---|
| 下一UI预测 - Android Control (ID) | 动作依从性 Sad | 94.28 | GPT-5: 94.02, Gemini-3-Pro-Image: 92.63 | 超过GPT-5 0.26，超过最强开源GLM-4.6V-106B 2.66 |
| 下一UI预测 - Android Control (ID) | 元素对齐 Sele | 71.35 | Gemini-3-Flash: 74.52, GPT-5: 74.13 | 仅次于两个商业模型，超过所有开源模型 |
| 下一UI预测 - GUI Odyssey (OOD) | 动作依从性 Sad | 92.73 | GPT-5: 93.45, Gemini-3-Pro-Image: 88.50 | 与GPT-5差距仅0.72，展现强大泛化能力 |
| 离线导航 - AndroidControl-High | 成功率 SR | Mobile-Agent-v3+Code2World: 68.41, Qwen2.5-VL-7B+Code2World: 66.47 | Mobile-Agent-v3: 67.20, Qwen2.5-VL-7B: 65.16 | +1.21, +1.31 |
| 在线导航 - AndroidWorld | 任务成功率 SR | Gemini-2.5-Flash+Code2World: 50.86% | Gemini-2.5-Flash: 41.38% | +9.48% (相对提升22.9%) |
局限与改进
尽管Code2World取得了显著成果，但仍存在几个重要局限性。首先，代码生成范式本身存在信息损失：为了保证确定性渲染，模型使用语义占位符替代真实图片（如用[IMG: Red Shoe]替代真实鞋子图片），这意味着生成的界面在纹理和视觉细节上无法完全还原真实场景。虽然这在结构布局上是可接受的，但在需要精确视觉匹配的场景中可能成为瓶颈。其次，VLM-as-a-Judge的评估和奖励机制存在主观性——依赖另一个VLM来判断生成质量，可能引入系统性偏差，特别是在边界情况下的判断可能不够稳定。第三，当前模型仅在Android平台的英语界面上训练和评估，对iOS、Web或其他语言界面的泛化能力尚未验证。第四，数据构建依赖GPT-5进行截图到代码的翻译和修订，成本较高且受限于GPT-5的代码生成质量上限。最后，模型在OOD设置下的视觉质量指标（如SigLIP从ID的79.44下降到OOD的74.40，DINO从49.18下降到46.43）表明跨应用泛化仍有提升空间。
独立分析的弱点
从独立分析的角度，Code2World存在几个值得关注的弱点。第一，占位符策略的信息瓶颈：当前方法用[IMG: description]替代真实图片，虽然保证了结构可控性，但丢失了大量视觉信息。在电商、社交媒体等高度依赖图片内容的应用场景中，这种抽象可能导致预测失真。改进方向可以探索轻量级图像生成模块，在保持结构可控的前提下补充关键视觉元素。第二，奖励函数的设计局限：R_sem和R_act都依赖VLM-as-a-Judge，计算开销大且存在判断偏差。特别是R_sem要求VLM'容忍风格差异'，这个模糊的指令可能导致评估标准不一致。可以考虑引入更客观的结构化指标（如DOM树编辑距离）作为辅助奖励。第三，单步预测的局限性：当前模型只预测一步状态转换，但在真实GUI导航中，agent需要规划多步操作序列。将单步预测扩展到多步预测链（如预测未来3-5步的状态序列）将更实用。第四，训练数据的覆盖度：AndroidCode仅80K样本，且主要来自AndroidControl数据集，应用覆盖有限。大规模扩展数据集（如从应用商店自动采集）可能显著提升泛化能力。
未来方向
基于Code2World的成果，未来研究可以在多个方向延伸。作者明确提出的是将Code2World作为GUI Agent的虚拟沙箱，用于评估高风险操作（如支付确认、数据删除）的安全性，这在AI安全领域具有重要价值。此外，几个有前景的方向包括：(1) 多模态融合——将代码生成与轻量级图像生成结合，用代码控制结构、用扩散模型补充纹理，实现更完整的视觉预测；(2) 跨平台泛化——将当前Android专属的方法扩展到iOS（SwiftUI）、Web（React/Vue）等更多平台，构建通用的GUI世界模型；(3) 交互式训练——利用在线环境的实时反馈进行持续学习，而非仅依赖离线数据集；(4) 长期规划——将单步预测扩展为多步规划，支持更复杂的任务分解；(5) 高效推理——当前每次预测都需要完整的HTML生成和渲染，探索更轻量的代码表示（如增量更新的DOM diff）可以大幅提升推理速度。
复现评估
从复现评估角度看，Code2World的可复现性较好。作者在论文中提供了详细的实现细节：使用Qwen3-VL-8B-Instruct作为骨干模型，SFT阶段使用LLaMA-Factory框架，RL阶段使用EasyR1框架，所有实验在8块NVIDIA H20 GPU（96GB显存）上完成。数据集方面，AndroidCode的构建流程有详细描述（Algorithm 1），使用GPT-5作为代码生成和修订的多模态编码器。不过存在几个复现门槛：(1) 依赖GPT-5 API进行数据合成，成本较高且受限于API访问；(2) 训练需要8块高端GPU，对算力有一定要求；(3) 渲染器的精确实现未完全开源（虽然HTML渲染是标准化的）；(4) VLM-as-a-Judge的具体提示词已在附录中详细给出，这有助于评估指标的复现。总体而言，有中等以上算力资源的研究者应该能够复现核心结果，但数据合成步骤可能需要较多API调用费用。
论文图表
