Get your free personalized podcast brief

We scan new podcasts and send you the top 5 insights daily.

For generative UI, designers move from defining exact layouts to creating a "skill" that guides the AI. This skill defines a design language, references tokens, and suggests best practices, steering the model's output without over-constraining it.

Related Insights

As AI automates UI generation, a designer's strategic value shifts. Instead of designing pixels, they will architect user experiences by defining which components are fixed for consistency (like a login flow) and which are flexible canvases for AI-driven personalization (like a user dashboard).

To iterate faster with AI, have it describe design approaches in text first. This allows for quick evaluation of the core concepts, enabling you to reject bad ideas before wasting time and resources on generating full user interfaces for them.

Enhancing an AI's capabilities doesn't always require coding or API integrations. A 'skill' can simply be a highly detailed, well-structured prompt. For example, a 'front end design' skill works by providing the AI with a comprehensive set of design principles, guiding it away from generic outputs.

To improve generative UI, designers create a "golden set" of 10-20 ideal prompts and their desired outcomes. They repeatedly run the model against this set, identify failures, tweak the guiding "skill," and iterate, creating a flywheel for quality improvement.

At OpenAI, the first question is "Can we solve this with the model (tokens) instead of pixels?" This treats the AI as the primary design material, pushing designers to think about interaction and behavior before creating bespoke user interfaces.

As AI models become proficient at generating high-quality UI from prompts, the value of manual design execution will diminish. A professional designer's key differentiator will become their ability to build the underlying, unique component libraries and design systems that AI will use to create those UIs.

OpenAI is developing a "dynamic user interface library" designed so the AI model can interpret and compose UI elements itself. This forward-thinking approach anticipates a future where the model assembles bespoke interfaces for users on the fly.

To avoid generic or poor-quality AI-generated designs, use "Taste Skills." These are installable modules for AI agents (like in Codex) that provide stylistic rules, knowledge of animation libraries, and design principles, ensuring the final output has a professional aesthetic quality.

To avoid generic, 'purple AI slop' UIs, create a custom design system for your AI tool. Use 'reverse prompting': feed an LLM like ChatGPT screenshots of a target app (e.g., Uber) and ask it to extrapolate the foundational design system (colors, typography). Use this output as a custom instruction.

Designing for AI is less about crafting pixel-perfect UIs in Figma and more about creating the underlying system or "harness." This involves enabling the agent to perform long-running tasks, verify its own work, and operate effectively within technical constraints, which is where the real design work lies.