Building AI Apps · TRACK 03/04
AI UX Patterns
Designing for latency, uncertainty, and the occasional confident lie.
// THE TRACK
01 · START HEREAI UX PrinciplesLearn the handful of UX patterns that the best AI products all share — and why they work.BEGINNERChatbot UX PatternsLearn the specific UI patterns — streaming, typing indicators, error states, citations, copy, regenerate, and history — that make chatbot interfaces feel polished and trustworthy.INTERMEDIATEDesigning for LLM LatencyTurn multi-second model latency into a UX feature instead of a support ticket.BEGINNERCitations & SourcesMake AI answers verifiable with citation UI that links every claim back to its source.INTERMEDIATEError State DesignDesign failure states so a bad model response costs you a shrug, not a user.INTERMEDIATEGenerative UIUnderstand generative UI — letting the model return interactive components instead of plain text — and when it's worth the complexity.INTERMEDIATEHuman-in-the-Loop UXDesign the approval, edit, and undo steps that let users safely let AI take real actions on their behalf.INTERMEDIATEOptimistic UI for AIUse optimistic UI techniques so your AI app feels instant even while the model is still thinking.INTERMEDIATECopilotKitYou will understand what CopilotKit provides for building in-app copilots and generative UI in React or Angular, and how it relates to the AG-UI protocol.INTERMEDIATEassistant-uiYou will understand what assistant-ui offers as a React component library for AI chat, the primitives it provides, and where a composable chat UI kit fits in your app.INTERMEDIATETamboYou will understand how Tambo lets an agent choose which React components to render by registering them with Zod schemas, and how that differs from rendering plain text.INTERMEDIATEThesys C1You will understand what Thesys C1 is as a generative-UI platform, how its OpenAI-compatible endpoint returns interactive UI instead of text, and where that fits in an AI app.INTERMEDIATE