Optimizing Retrieval-Augmented Generation-Assisted User Interface Generation: A Comparative Study on Data Standardization for Brand Visual Consistency

The advancement of large language models (LLMs) has facilitated the generation of user interface (UI) code from natural language prompts, thereby supporting low-code development paradigms. Despite these capabilities, ensuring brand consistency remains a significant challenge, particularly when style data is unstructured. We investigated the impact of three data formats—plain text, structured cascading style sheets (CSS), and structured natural language (NL) guide—on the effectiveness of retrieval-augmented generation (RAG) in producing brand-consistent UI components, with No-RAG serving as the baseline for comparison. The findings indicate that RAG substantially enhances brand alignment. Although the structured NL guide yielded the highest CSS recall rate, participants expressed a preference for outputs derived from plain text, suggesting that the optimal data format may depend on specific design contexts and evaluative criteria.