Agent systems powered by large language models (LLMs) have demonstrated
impressive performance on repository-level code-generation tasks. However, for
tasks such as website codebase generation, which depend heavily on visual
effects and user-interaction feedback, current code agents rely only on simple
code execution for feedback and verification. This approach fails to capture
the actual quality of the generated code. In this paper, we propose
WebGen-Agent, a novel website-generation agent that leverages comprehensive and
multi-level visual feedback to iteratively generate and refine the website
codebase. Detailed and expressive text descriptions and suggestions regarding
the screenshots and GUI-agent testing of the websites are generated by a visual
language model (VLM), together with scores that quantify their quality. The
screenshot and GUI-agent scores are further integrated with a backtracking and
select-best mechanism, enhancing the performance of the agent. Utilizing the
accurate visual scores inherent in the WebGen-Agent workflow, we further
introduce \textit{Step-GRPO with Screenshot and GUI-agent Feedback} to improve
the ability of LLMs to act as the reasoning engine of WebGen-Agent. By using
the screenshot and GUI-agent scores at each step as the reward in Step-GRPO, we
provide a dense and reliable process supervision signal, which effectively
improves the model’s website-generation ability. On the WebGen-Bench dataset,
WebGen-Agent increases the accuracy of Claude-3.5-Sonnet from 26.4% to 51.9%
and its appearance score from 3.0 to 3.9, outperforming the previous
state-of-the-art agent system. Additionally, our Step-GRPO training approach
increases the accuracy of Qwen2.5-Coder-7B-Instruct from 38.9% to 45.4% and
raises the appearance score from 3.4 to 3.7.