|
| 1 | +# AG‑UI: The Agent–User Interaction Protocol |
| 2 | + |
| 3 | +*A horizontal standard to bring AI agents into user‑facing frontend applications.* |
| 4 | + |
| 5 | +AG‑UI is the boundary layer where agents and users meet. It standardizes how agent state, UI intents, and user interactions flow between your model/agent runtime and your app’s frontend—so you can ship reliable, debuggable, user‑friendly agentic features fast. |
| 6 | + |
| 7 | +--- |
| 8 | + |
| 9 | +## Built with the ecosystem |
| 10 | + |
| 11 | +**First‑party partnerships & integrations** |
| 12 | + |
| 13 | +> **Logo strip goes here** (e.g., LangGraph • CrewAI • Autogen 2 • LlamaIndex • Mastra • Pydantic AI • Vercel AI SDK • Next.js) |
| 14 | +
|
| 15 | +Short blurb: *AG‑UI works across leading agent frameworks and frontend stacks, with shared vocabulary and primitives that keep your UX consistent as your agents evolve.* |
| 16 | + |
| 17 | +--- |
| 18 | + |
| 19 | +## Building blocks (today & upcoming) |
| 20 | + |
| 21 | +- **Streaming chat** — Token‑level and tool‑event streaming for responsive UIs. |
| 22 | +- **Static generative UI** — Render model output into stable, typed components. |
| 23 | +- **Declarative generative UI** — Let agents propose UI trees; app decides what to mount. |
| 24 | +- **Frontend tools** — Safe, typed tool calls that bridge agent logic to app actions. |
| 25 | +- **Interrupts & human‑in‑the‑loop** — Pause, approve, edit, or steer mid‑flow. |
| 26 | +- **In‑chat + in‑app interactions** — Chat commands alongside regular app controls. |
| 27 | +- **Attachments & multimodality** — Files, images, audio, and structured payloads. |
| 28 | +- **Thinking steps** — Expose summaries/redactions of chain‑of‑thought artifacts to users, safely. |
| 29 | +- **Sub‑agent calls** — Orchestrate nested agents and delegate specialized tasks. |
| 30 | +- **Agent steering** — Guardrails, policies, and UX affordances to keep agents on track. |
| 31 | + |
| 32 | +> **CTA to deeper docs** → *See the full capability map in the docs.* |
| 33 | +
|
| 34 | +--- |
| 35 | + |
| 36 | +## Design patterns |
| 37 | + |
| 38 | +Explore reusable interaction patterns for agentic UX: |
| 39 | + |
| 40 | +- **Link‑out:** [AI‑UI Design Patterns →](/patterns) *(placeholder URL)* |
| 41 | + |
| 42 | +--- |
| 43 | + |
| 44 | +## Why AG‑UI |
| 45 | + |
| 46 | +**Agentic apps break the classic request/response contract.** Agents run for longer, stream work as they go, and make nondeterministic choices that can affect your UI and state. AG‑UI defines a clean, observable boundary so frontends remain predictable while agents stay flexible. |
| 47 | + |
| 48 | +### What’s hard about user‑facing agents |
| 49 | + |
| 50 | +- Agents are **long‑running** and **stream** intermediate work—often across multi‑turn sessions. |
| 51 | +- Agents are **nondeterministic** and can **control UI** in ways that must be supervised. |
| 52 | +- Apps must mix **structured + unstructured IO** (text, voice, tool calls, state updates). |
| 53 | +- Agents need **composition**: agents **call sub‑agents**, often non-deterministically. |
| 54 | + |
| 55 | +With AG‑UI, these become deliberate, well‑typed interactions rather than ad‑hoc wiring. |
| 56 | + |
| 57 | +--- |
| 58 | + |
| 59 | +## Deeper proof (docs, demos, code) |
| 60 | + |
| 61 | +| Framework / Platform | What works today | Docs | Demo | |
| 62 | +| ----------------------- | -------------------------------------- | --------- | --------- | |
| 63 | +| LangGraph | Streams, tools, interrupts, sub‑agents | [Docs](#) | [Demo](#) | |
| 64 | +| CrewAI | Tools, action routing, steering | [Docs](#) | [Demo](#) | |
| 65 | +| Autogen 2 | Multi‑agent orchestration, messaging | [Docs](#) | [Demo](#) | |
| 66 | +| LlamaIndex | Query/agent routing, UI intents | [Docs](#) | [Demo](#) | |
| 67 | +| OpenAI Realtime | Live stream, events, attachments | [Docs](#) | [Demo](#) | |
| 68 | +| Vercel AI SDK / Next.js | Edge streaming, SSR hydration | [Docs](#) | [Demo](#) | |
| 69 | + |
| 70 | +> **Note:** Replace placeholders with actual URLs to docs and demos. |
| 71 | +
|
| 72 | +--- |
| 73 | + |
| 74 | +## Quick links |
| 75 | + |
| 76 | +- **Get started** → */docs/getting-started* (placeholder) |
| 77 | +- **Concepts** → */docs/concepts/agent-ui-boundary* (placeholder) |
| 78 | +- **Reference** → */docs/reference* (placeholder) |
| 79 | +- **Patterns** → */patterns* (placeholder) |
| 80 | + |
| 81 | +--- |
| 82 | + |
| 83 | +## Optional section: How AG‑UI fits |
| 84 | + |
| 85 | +- **Protocol**: Events, intents, and payload schemas shared by agents & apps. |
| 86 | +- **Runtime adapters**: Bindings for popular agent frameworks. |
| 87 | +- **Frontend kit**: Lightweight client + components to handle streaming & interrupts. |
| 88 | +- **Observability hooks**: Surface interaction timelines for debugging & learning. |
| 89 | + |
| 90 | +*(Include a simple diagram later: Agent(s) ⇄ AG‑UI Boundary ⇄ App UI/State)* |
| 91 | + |
0 commit comments