WebVIA: Een webgebaseerd vision-language agentiekader voor interactieve en verifieerbare UI-naar-code-generatie
WebVIA: A Web-based Vision-Language Agentic Framework for Interactive and Verifiable UI-to-Code Generation
November 9, 2025
Auteurs: Mingde Xu, Zhen Yang, Wenyi Hong, Lihang Pan, Xinyue Fan, Yan Wang, Xiaotao Gu, Bin Xu, Jie Tang
cs.AI
Samenvatting
De ontwikkeling van gebruikersinterfaces (UI) vereist het vertalen van ontwerpmodellen naar functionele code, een proces dat repetitief en arbeidsintensief blijft. Hoewel recente Vision-Language Models (VLM's) de UI-naar-Code-generatie automatiseren, genereren ze alleen statische HTML/CSS/JavaScript-lay-outs zonder interactiviteit. Om dit aan te pakken, stellen we WebVIA voor, het eerste agent-gebaseerde raamwerk voor interactieve UI-naar-Code-generatie en -validatie. Het raamwerk bestaat uit drie componenten: 1) een verkenning-agent om UI-screenshots met meerdere statussen vast te leggen; 2) een UI2Code-model dat uitvoerbare interactieve code genereert; 3) een validatiemodule die de interactiviteit verifieert. Experimenten tonen aan dat WebVIA-Agent stabielere en nauwkeurigere UI-verkenning bereikt dan algemene agents (bijv. Gemini-2.5-Pro). Bovendien vertonen onze fijn afgestemde WebVIA-UI2Code-modellen aanzienlijke verbeteringen in het genereren van uitvoerbare en interactieve HTML/CSS/JavaScript-code, waarbij ze hun basis tegenhangers overtreffen op zowel interactieve als statische UI2Code-benchmarks. Onze code en modellen zijn beschikbaar op https://zheny2751-dotcom.github.io/webvia.github.io/{https://webvia.github.io}.
English
User interface (UI) development requires translating design mockups into functional code, a process that remains repetitive and labor-intensive. While recent Vision-Language Models (VLMs) automate UI-to-Code generation, they generate only static HTML/CSS/JavaScript layouts lacking interactivity. To address this, we propose WebVIA, the first agentic framework for interactive UI-to-Code generation and validation. The framework comprises three components: 1) an exploration agent to capture multi-state UI screenshots; 2) a UI2Code model that generates executable interactive code; 3) a validation module that verifies the interactivity. Experiments demonstrate that WebVIA-Agent achieves more stable and accurate UI exploration than general-purpose agents (e.g., Gemini-2.5-Pro). In addition, our fine-tuned WebVIA-UI2Code models exhibit substantial improvements in generating executable and interactive HTML/CSS/JavaScript code, outperforming their base counterparts across both interactive and static UI2Code benchmarks. Our code and models are available at https://zheny2751-dotcom.github.io/webvia.github.io/{https://webvia.github.io}.