UICoder: Finetuning Large Language Models to Generate User Interface Code through Automated Feedback

TL;DR

This paper presents UICoder, a method that fine-tunes large language models to generate better user interface code by using automated feedback to create high-quality training data, improving performance without human labeling.

Contribution

The paper introduces an automated feedback loop for fine-tuning LLMs on UI code, reducing reliance on human feedback and proprietary models, and demonstrating improved performance on open-source models.

Findings

Models outperform baseline open-source models

Approach approaches proprietary model performance

Automated data filtering enhances code quality

Abstract

Large language models (LLMs) struggle to consistently generate UI code that compiles and produces visually relevant designs. Existing approaches to improve generation rely on expensive human feedback or distilling a proprietary model. In this paper, we explore the use of automated feedback (compilers and multi-modal models) to guide LLMs to generate high-quality UI code. Our method starts with an existing LLM and iteratively produces improved models by self-generating a large synthetic dataset using an original model, applying automated tools to aggressively filter, score, and de-duplicate the data into a refined higher quality dataset. The original LLM is improved by finetuning on this refined dataset. We applied our approach to several open-source LLMs and compared the resulting performance to baseline models with both automated metrics and human preferences. Our evaluation shows the resulting models outperform all other downloadable baselines and approach the performance of larger proprietary models.