CoGen: Creation of Reusable UI Components in Figma via Textual Commands
By: Ishani Kanapathipillai, Obhasha Priyankara
The evolution of User Interface design has emphasized the need for efficient, reusable, and editable components to ensure an efficient design process. This research introduces CoGen, a system that uses machine learning techniques to generate reusable UI components directly in Figma, one of the most popular UI design tools. Addressing gaps in current systems, CoGen focuses on creating atomic components such as buttons, labels, and input fields using structured JSON and natural language prompts. The project integrates Figma API data extraction, Seq2Seq models, and fine-tuned T5 transformers for component generation. The key results demonstrate the efficiency of the T5 model in prompt generation, with an accuracy of 98% and a BLEU score of 0.2668, which ensures the mapping of JSON to descriptive prompts. For JSON creation, CoGen achieves a success rate of up to 100% in generating simple JSON outputs for specified component types.
Similar Papers
GenComUI: Exploring Generative Visual Aids as Medium to Support Task-Oriented Human-Robot Communication
Human-Computer Interaction
Helps robots understand and follow spoken instructions.
The GenUI Study: Exploring the Design of Generative UI Tools to Support UX Practitioners and Beyond
Human-Computer Interaction
AI draws app screens from your words.
WeGen: A Unified Model for Interactive Multimodal Generation as We Chat
CV and Pattern Recognition
Creates unique art from simple ideas.