Building Better UI With AI (Without Creating Slop)

Most AI-generated interfaces suffer from the same problem: they look technically correct but lack product thinking, visual hierarchy, and design intent.

In this workshop, we'll explore how to use AI as a UI production system rather than a magic design button. Participants will learn how to brief AI like a creative director, gather and analyse references, select the right component libraries, and build structured feedback loops that continuously improve the quality of generated interfaces.

Using tools and ecosystems such as shadcn/ui, shadcn blocks, shadcn space, Magic UI, Aceternity, React Bits, Tailark, Cursor, Claude, ChatGPT, v0, Codex, and similar platforms, attendees will build a polished interface while learning a workflow they can reuse in their own projects.

What attendees will learn

• How to avoid common AI-generated UI anti-patterns and "slop"
• How to transform product ideas into effective AI design briefs
• How to use references as design vocabulary without directly copying
• How to choose between shadcn/ui primitives, blocks, registries, and third-party component ecosystems
• How to select the right AI model or tool for ideation, research, implementation, and critique
• How to prompt AI for information architecture and component planning before writing code
• How to improve hierarchy, spacing, typography, density, responsive behaviour, and interaction states
• How to convert successful prompting patterns into reusable workflows and repeatable design systems

Requirements

You will need:

• A laptop with a modern web browser
• VS Code, Cursor, or a similar code editor
• Node.js installed
• Basic Git and GitHub familiarity
• Access to at least one AI coding tool such as Cursor, Claude, ChatGPT, Codex, v0, Lovable, Bolt, Replit, or similar
• A React + Tailwind setup or willingness to use the provided starter project

Recommended knowledge:

• Basic HTML, CSS, and JavaScript
• Some familiarity with React components
• Basic Tailwind CSS knowledge
• Prior experience with shadcn/ui is helpful but not required

Target audience

Developers, design engineers, indie makers, startup founders, and product-minded builders who want their AI-assisted interfaces to look more intentional, polished, and product-specific.

This workshop is particularly valuable for people already using tools such as Cursor, Claude Code, Codex, ChatGPT, v0, Lovable, or similar AI development environments and who want to move beyond generating generic UI towards creating professional-quality products.