Track papers across labs, topics, and trends.
Search papers, labs, and topics across Lattice.
The paper introduces AI Prototyper, an open-source Figma plugin that automates GUI prototyping using a decomposition and retrieval-augmented generation (RAG) approach. By transforming natural language descriptions into editable Figma layers, the tool enhances the prototyping process, enabling users to generate and refine GUI features efficiently. In a preliminary evaluation, participants using AI Prototyper created more prototypes in less time and received higher quality ratings compared to manual methods, demonstrating its effectiveness in streamlining GUI design.
Automating GUI prototyping with AI Prototyper not only accelerates the design process but also enhances the quality of outputs, outperforming traditional manual methods.
Graphical user interface (GUI) prototyping remains a time-consuming activity that demands both design expertise and considerable manual effort. As GUI prototypes are non-code artifacts that evolve alongside requirements throughout the development cycle, automating their generation is directly relevant to software maintenance and evolution. We present AI Prototyper, an open-source Figma plugin that automates GUI prototyping through a decomposition and retrieval-augmented generation (RAG) pipeline. Given a natural-language description of a desired screen, such as a login page or a product detail card, the plugin decomposes the request into discrete GUI features, retrieves matching components from a custom 32-primitive library, and renders each component as a fully editable Figma layer with auto-layout. The pipeline uses Gemini 2.5 Flash as its LLM back-end and a Node.js/Express service. Unlike existing decomposition-based tools, AI Prototyper introduces a human-in-the-loop editing step that lets users review, modify, or extend the generated feature list before rendering, uses a different technology stack and LLM family, and supports multilingual input, producing correctly labelled interfaces in Thai, English, and Mandarin Chinese. In a preliminary evaluation, participants using AI Prototyper completed more prototypes in a fixed time window than those working manually, and expert practitioners rated the AI-generated prototypes higher across nine quality dimensions. A demonstration video is available at https://youtu.be/pRoFAH7MQaE. The source code and component library are available at https://github.com/tongsalangsingha/AI-prototyper-tool