--- schema: 1 type: video title: 'Beyond Components: Designing Generative UI for MCP Apps — Ruben Casas, Postman' description: >- Ruben Casas from Postman prompted a model to rewrite his blog. It built a search box with a blur animation and accessibility out of the box, without being asked. That was when he concluded the model writes better frontend code than he does. His question for the talk: if the models are this capable, why are most agent UIs still invoking static prebuilt components? The talk maps three points on the spectrum. Static components pass props to predefined React elements (AG UI, Goose auto visualizer). Declarative UI has the LLM generate JSON or YAML that a rendering engine maps to components at runtime. Ruben argues this is the right balance today. Fully generative UI skips components entirely: the model writes HTML, CSS, and JavaScript on demand. His weather agent does this in a single tool call. The catch is containment: LLM generated code needs a sandbox, which is why MCP apps and their double iframe default matter. He closes on the TV analogy. The first TV shows were radio shows with cameras because nobody could imagine what else to do with the new medium. We are in that era. Speaker info: - https://x.com/Infoxicador - https://www.linkedin.com/in/ruben-casas-17100383/ Timestamps: 0:00 Introduction: The evolution from 'poor man's bit coding' to high-fidelity UI generation 2:56 Why are we still stuck with static UI? 3:33 The new computer: Searching for the interface of the future 4:47 The role of MCP apps and 'Super Apps' 5:52 Three levels of UI generation: Static, Declarative, and Generative 6:03 Understanding Static UI components (e.g., AG UI, Goose) 7:42 The benefits of Declarative UI (e.g., JSON/YAML renderers) 10:06 Moving to the next level: Generative UI components 11:25 The challenge of trust: The need for sandboxing and containment 12:22 Why MCP apps are the ideal delivery mechanism for Generative UI 13:21 The 'TV/Radio' analogy: Imagining the future of agent interaction 14:46 Beyond components: Towards true human-agent collaboration 16:16 Conclusion: Shaping the future of user interfaces --- Watch along with the corrected transcript, summary, timestamps and resources on this talk's official AIE page: https://ai.engineer/talks/hCMrEfPG2Yg-generative-ui-for-mcp Join our upcoming AI Engineer conferences (see https://ai.engineer landing page): - AIEi Shanghai, November 5–6 — the first for meeting top Chinese labs and engineers - AIE CODE in SF, November 10–12 — the top AI Coding conference returns - AIEi Sydney, December 7–8 — the first AIEi run alongside NeurIPS 2026 in Sydney --- canonical: 'https://liquidgold.cc/watch/hCMrEfPG2Yg' markdown: 'https://liquidgold.cc/watch/hCMrEfPG2Yg.md' llms: 'https://liquidgold.cc/watch/hCMrEfPG2Yg/llms.txt' parent: 'https://liquidgold.cc/channel/aidotengineer.md' channel: aidotengineer updated: '2026-10-24T09:57:00.364Z' language: null children: [] videoId: hCMrEfPG2Yg durationSeconds: 1018 publishedAt: '2026-06-03T17:00:06.000Z' searchChunks: - ordinal: 0 text: null startSeconds: 27 endSeconds: 184 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=27' heldReason: rights - ordinal: 1 text: null startSeconds: 27 endSeconds: 184 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=27' heldReason: rights - ordinal: 2 text: null startSeconds: 184 endSeconds: 195 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=184' heldReason: rights - ordinal: 3 text: null startSeconds: 216 endSeconds: 228 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=216' heldReason: rights - ordinal: 4 text: null startSeconds: 228 endSeconds: 294 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=228' heldReason: rights - ordinal: 5 text: null startSeconds: 294 endSeconds: 305 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=294' heldReason: rights - ordinal: 6 text: null startSeconds: 383 endSeconds: 472 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=383' heldReason: rights - ordinal: 7 text: null startSeconds: 383 endSeconds: 472 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=383' heldReason: rights - ordinal: 8 text: null startSeconds: 485 endSeconds: 614 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=485' heldReason: rights - ordinal: 9 text: null startSeconds: 485 endSeconds: 614 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=485' heldReason: rights - ordinal: 10 text: null startSeconds: 485 endSeconds: 614 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=485' heldReason: rights - ordinal: 11 text: null startSeconds: 627 endSeconds: 694 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=627' heldReason: rights - ordinal: 12 text: null startSeconds: 704 endSeconds: 748 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=704' heldReason: rights - ordinal: 13 text: null startSeconds: 704 endSeconds: 748 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=704' heldReason: rights - ordinal: 14 text: null startSeconds: 748 endSeconds: 760 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=748' heldReason: rights - ordinal: 15 text: null startSeconds: 816 endSeconds: 895 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=816' heldReason: rights - ordinal: 16 text: null startSeconds: 895 endSeconds: 906 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=895' heldReason: rights - ordinal: 17 text: null startSeconds: 906 endSeconds: 982 watch: 'https://liquidgold.cc/watch/hCMrEfPG2Yg?t=906' heldReason: rights --- # Beyond Components: Designing Generative UI for MCP Apps — Ruben Casas, Postman Ruben Casas from Postman prompted a model to rewrite his blog. It built a search box with a blur animation and accessibility out of the box, without being asked. That was when he concluded the model writes better frontend code than he does. His question for the talk: if the models are this capable, why are most agent UIs still invoking static prebuilt components? The talk maps three points on the spectrum. Static components pass props to predefined React elements (AG UI, Goose auto visualizer). Declarative UI has the LLM generate JSON or YAML that a rendering engine maps to components at runtime. Ruben argues this is the right balance today. Fully generative UI skips components entirely: the model writes HTML, CSS, and JavaScript on demand. His weather agent does this in a single tool call. The catch is containment: LLM generated code needs a sandbox, which is why MCP apps and their double iframe default matter. He closes on the TV analogy. The first TV shows were radio shows with cameras because nobody could imagine what else to do with the new medium. We are in that era. Speaker info: - https://x.com/Infoxicador - https://www.linkedin.com/in/ruben-casas-17100383/ Timestamps: 0:00 Introduction: The evolution from 'poor man's bit coding' to high-fidelity UI generation 2:56 Why are we still stuck with static UI? 3:33 The new computer: Searching for the interface of the future 4:47 The role of MCP apps and 'Super Apps' 5:52 Three levels of UI generation: Static, Declarative, and Generative 6:03 Understanding Static UI components (e.g., AG UI, Goose) 7:42 The benefits of Declarative UI (e.g., JSON/YAML renderers) 10:06 Moving to the next level: Generative UI components 11:25 The challenge of trust: The need for sandboxing and containment 12:22 Why MCP apps are the ideal delivery mechanism for Generative UI 13:21 The 'TV/Radio' analogy: Imagining the future of agent interaction 14:46 Beyond components: Towards true human-agent collaboration 16:16 Conclusion: Shaping the future of user interfaces --- Watch along with the corrected transcript, summary, timestamps and resources on this talk's official AIE page: https://ai.engineer/talks/hCMrEfPG2Yg-generative-ui-for-mcp Join our upcoming AI Engineer conferences (see https://ai.engineer landing page): - AIEi Shanghai, November 5–6 — the first for meeting top Chinese labs and engineers - AIE CODE in SF, November 10–12 — the top AI Coding conference returns - AIEi Sydney, December 7–8 — the first AIEi run alongside NeurIPS 2026 in Sydney --- Canonical: https://liquidgold.cc/watch/hCMrEfPG2Yg · Channel: [AI Engineer](https://liquidgold.cc/channel/aidotengineer.md) > Search chunk text is held until public-source provenance is verified. ## Document chunks > Missing: no stored document chunks are available.