中文
Figma Config

A Google engineer breaks down four levels of generating interfaces with AI at runtime — as candid about what broke as about the demos

Design for the future of apps ft. Craig Labenz (Google) | Config 2026 · Craig Labenz

20 min
AgentAI Product

20 min total·Actually worth watching closely: ~10 min·3 must-watch clips

Orange = the 10 minutes worth watchingFor the rest, the guide is enough
Segment guide · 7 segments
  1. 0:11 3:50Watch

    Gen Latte: why Gen UI is needed

    Opens with the Gen Latte demo from Cloud Next and I/O: users create an image of their personal happy place with Gemini and Nano Banana and get it printed onto a latte. The follow-up questions Gemini authored in advance mixed multiple choice, sliders and open-ended text, exposing why one control cannot serve every question.

    The motivation for Gen UI is agents answering with rich, ephemeral interfaces instead of walls of text nobody wants to read

    Two moments flagged as worth watching, at 77s and 201s — the latte printing and the interfaces for the different question types — are the visual anchors for the talk's motivation▶ Jump to 0:11
  2. 3:50 7:13Listen

    The A2UI protocol and what Gen UI is

    Gives Gen UI its formal definition and introduces A2UI, standing for Agent to User Interface, Google's protocol for agent-to-interface communication, documented at A2UI.org.

    A2UI standardizes how an AI's decision about what to show reaches the client

    This stretch is mostly a spoken definition plus the protocol intro, with nothing visual to depend on — note down A2UI.org and you have it▶ Jump to 3:50
  3. 7:13 10:40Listen

    The four-tier adoption spectrum

    Lays out the framework — Level 0 and Level 1 deterministic UI, Level 2 AI-driven server-side UI, Level 3 AI takeover — with one unifying mental model: every screen is a touchpoint where client and server come together around what the user is trying to do, and the more of those questions you delegate to an AI agent at runtime, the deeper you have gone.

    Gen UI is not a Boolean your app has or doesn't have; it is a spectrum with a dial you can tune up and down

    Pure conceptual argument with no visual dependency flagged — the framework comes through completely on audio alone, good for a commute▶ Jump to 7:13
  4. 10:40 13:00Watch

    What Level 2 costs in typography

    Dynamic content makes copy length and option counts unknowable, and an H1 or H2 that ends in ellipses reads as a really broken UI; Gen Latte had no choice but to lay text out on a shadow canvas in advance, measure every single pixel, and shrink font sizes iteratively until it fit.

    Killing the surprising ellipses cost great complexity within the component and sometimes surprisingly sized text — a trade-off designers have to be in on

    Two visual moments, at 641s and 709s, show the truncation failure and the shadow-canvas measuring fix — far more direct seen than described▶ Jump to 10:40
  5. 13:00 14:19Listen

    Level 3: the AI takes the interface and the state

    Level 3 hands both UI freedom and the complete application state to the AI: when a user clicks a button there may be no local code running at all, because the agent already paired that button with a server-side action when it generated it, and the front end just passes the interaction back.

    A Level 3 button is essentially a tool call the AI wired up in advance

    This stretch is spoken setup leading into the Hatcha demo, with no visual moments — grasping the concept is enough▶ Jump to 13:00
  6. 14:19 17:59Watch

    The Hatcha demo and the granularity trade-off

    The Flutter team's Hatcha has Gemini play an improvised game of 20 questions until it has everything it needs for a pitch deck for the event you want to throw, with UI composition and state decided live; then comes the core trade-off — coarse-grained components that know what is going on, for consistency, or handing over your fine-grained design system, for creativity.

    Catalog granularity is the central Gen UI design decision: consistency and creativity cannot both be had

    The Hatcha demo from 863s is flagged as worth grabbing frames from; behavior-driven single-screen composition and caching the A2UI output also come up in this stretch▶ Jump to 14:19
  7. 18:02 19:41Listen

    Closing: on-device models absorb the cost

    Concedes that Level 3 turns almost everything into a network request that needs an LLM to think — slower, and you pay the tokens — but Gemma 4, Google's premier on-device model, already drives Gen UI experiences on a powerful laptop and should run comfortably on phones in just a few years.

    Latency and token cost are today's drawback, not a permanent one; on-device inference is the answer

    The closing outlook is spoken argument with no visual dependency — fine to listen to while the earlier framework settles▶ Jump to 18:02