Designer tool lets users shape AI-generated user interfaces

GUIDE: Designer-in-the-loop Authoring of Conformant Generative User Interfaces

Human-Computer Interaction

Summary

Creating user interfaces with AI is tricky because designers can’t always see or control what the AI will produce. The authors introduce a system called GUIDE that helps designers inspect and tweak AI-generated interfaces as they build them. GUIDE learns from the designer’s feedback and uses a new way to score how well the AI’s designs match the designer’s goals. Tests showed GUIDE works well compared to other methods, and designers liked it because it gave them more control over the AI’s output.

What this means in practice

  • For ui/ux design teams: Improve control and alignment of AI-generated interfaces to brand and design requirements during design workflows.
  • For product designers: Interactively refine interface designs generated on demand by AI to better meet user needs and context.

Authors

Hyewon Lee, Ziying Wang, Aiden Moy, Saran Nagubandi, Jason Wu

Abstract

Generative User Interfaces (GenUIs) enable applications to generate interfaces on demand from user needs and context. Like conventional UIs, they must still reflect designers' intent and conform to requirements such as brand identity. Unlike conventional UIs, designers cannot directly specify or see every interface a GenUI may produce, making design intent harder to enforce. We introduce GUIDE (GenUI Development Environment), a system that lets designers continuously inspect and refine GenUI behavior as they create and edit interfaces. GUIDE uses designers' modifications and interactions to adapt GenUIs through prompt optimization and a novel adaptive conformance scoring model. We validate GUIDE's scoring model and system. The scoring model matched or outperformed proprietary LLM baselines on held-out comparisons of real and synthetic application screens. In a study with 12 UI/UX practitioners, participants found GUIDE effective and usable and significantly preferred aligned outputs over a strong baseline using exemplars and a model-generated design.md.