Design-System-Aware Development with AI: Evaluating Productivity and Design Consistency
For industrial front-end developers using design systems, this provides empirical evidence that AI tools can significantly accelerate development and improve design fidelity.
This paper reports a controlled experiment showing that DS-aware AI assistance reduces front-end development time by 46.7% to 69.4% and improves task completeness and design consistency compared to manual or DS-only development.
Design Systems (DS) help standardize front-end development, yet developers still face challenges when translating high-fidelity mockups into consistent, production-ready interfaces. Although AI-assisted tools have emerged as a potential solution, empirical evidence on their effectiveness within DS-centered workflows remains limited. This paper reports a controlled experiment conducted at a large Brazilian enterprise that compares manual development, DS-only development, and DS-aware AI-assisted development across Angular, iOS, and Android stacks. Results from two experimental cycles show that AI assistance significantly reduced time-to-delivery (by 46.7% to 69.4%), increased task completeness, and decreased performance variability. Analysis of break patterns further suggests reduced workflow friction and smoother task execution. These findings provide empirical evidence that DS-aware AI tools can significantly accelerate development, improve design fidelity, and yield practical benefits for industrial front-end workflows.