Большинство приложений с искусственным интеллектом (ИИ) по-прежнему представляют модель в виде чата. Такой интерфейс прост, но скрывает, что на самом деле делают агенты, например, планируют шаги, вызывают инструменты и обновляют состояние.
Генеративный пользовательский интерфейс (Generative UI) — это возможность позволить агенту управлять реальными элементами интерфейса, такими как таблицы, диаграммы, формы и индикаторы прогресса, чтобы взаимодействие ощущалось как продукт, а не как журнал токенов.
Что такое генеративный пользовательский интерфейс?
Команда CopilotKit объясняет, что генеративный пользовательский интерфейс — это любой пользовательский интерфейс, который частично или полностью создан ИИ-агентом. Вместо того чтобы возвращать только текст, агент может управлять:
* компонентами с состоянием, такими как формы и фильтры;
* визуализациями, такими как диаграммы и таблицы;
* многошаговыми потоками, такими как мастера;
* поверхностями состояния, такими как прогресс и промежуточные результаты.
Ключевая идея заключается в том, что пользовательский интерфейс по-прежнему реализуется приложением. Агент описывает, что должно измениться, а уровень пользовательского интерфейса выбирает, как это отобразить и как сохранить согласованность состояния.
Три основных паттерна генеративного пользовательского интерфейса:
1. Статический генеративный пользовательский интерфейс: агент выбирает из фиксированного каталога компонентов и заполняет свойства.
2. Декларативный генеративный пользовательский интерфейс: агент возвращает структурированную схему, которую рендерер сопоставляет с компонентами.
3. Полностью сгенерированный пользовательский интерфейс: модель выдаёт необработанную разметку, такую как HTML или JSX.
Большинство производственных систем сегодня используют статические или декларативные формы, поскольку их проще защитить и протестировать.
Зачем это нужно разработчикам?
Основная проблема в агентских приложениях — это связь между моделью и продуктом. Без стандартного подхода каждая команда создаёт собственные веб-сокеты, специальные форматы событий и способы потоковой передачи вызовов инструментов и состояния.
Генеративный пользовательский интерфейс вместе с протоколом, таким как AG-UI, даёт согласованную ментальную модель:
* бэкенд агента предоставляет состояние, активность инструментов и намерение пользовательского интерфейса в виде структурированных событий;
* фронтенд потребляет эти события и обновляет компоненты;
* взаимодействия пользователя преобразуются обратно в структурированные сигналы, которые агент может обрабатывать.
CopilotKit упаковывает это в свои SDK с хуками, общим состоянием, типизированными действиями и помощниками для React и других фронтендов. Это позволяет вам сосредоточиться на логике агента и специфичном для домена пользовательском интерфейсе, а не на изобретении протокола.
Как это влияет на конечных пользователей?
Для конечных пользователей разница становится заметна, как только рабочий процесс становится нетривиальным. Например, помощник по анализу данных может показывать фильтры, сборщики метрик и динамические диаграммы вместо описания графиков в тексте. Агент поддержки может отображать формы редактирования записей и временные шкалы состояния вместо длинных объяснений своих действий. Агент операций может показывать очереди задач, значки ошибок и кнопки повтора, на которые пользователь может воздействовать.
Это то, что CopilotKit и экосистема AG-UI называют агентским пользовательским интерфейсом — пользовательскими интерфейсами, в которых агент встроен в продукт и обновляет пользовательский интерфейс в режиме реального времени, пока пользователи сохраняют контроль через прямое взаимодействие.
Протокольный стек, AG-UI, MCP Apps, A2UI, Open-JSON-UI
Несколько спецификаций определяют, как агенты выражают намерение пользовательского интерфейса. Документация CopilotKit и документы AG-UI суммируют три основные спецификации генеративного пользовательского интерфейса:
* A2UI от Google, декларативная спецификация генеративного пользовательского интерфейса на основе JSON, разработанная для потоковой передачи и рендеринга, независимого от платформы;
* Open-JSON-UI от OpenAI, открытый стандарт внутренней декларативной схемы генеративного пользовательского интерфейса OpenAI для структурированных интерфейсов;
* MCP Apps от Anthropic и OpenAI, генеративный уровень пользовательского интерфейса поверх MCP, где инструменты могут возвращать интерактивные поверхности на основе iframe.
Эти форматы полезной нагрузки описывают, какой пользовательский интерфейс необходимо отобразить, например, карточку, таблицу или форму, и связанные с ними данные.
AG-UI находится на другом уровне. Это протокол взаимодействия с пользователем для агентов, событийно-ориентированная двунаправленная среда выполнения, которая соединяет любой бэкенд агента с любым фронтендом через такие транспортные средства, как события, отправляемые сервером, или веб-сокеты. AG-UI переносит:
* события жизненного цикла и сообщения;
* снимки состояния и дельты;
* активность инструментов;
* действия пользователя;
* полезные нагрузки генеративного пользовательского интерфейса, такие как A2UI, Open-JSON-UI или MCP Apps.
MCP соединяет агентов с инструментами и данными, A2A соединяет агентов друг с другом, A2UI или Open-JSON-UI определяют декларативные полезные нагрузки пользовательского интерфейса, MCP Apps определяет полезные нагрузки пользовательского интерфейса на основе iframe, а AG-UI перемещает всё это между агентом и пользовательским интерфейсом.
Ключевые выводы
* Генеративный пользовательский интерфейс — это структурированный пользовательский интерфейс, а не просто чат: агенты выдают структурированное намерение пользовательского интерфейса, такое как формы, таблицы, диаграммы и прогресс, которые приложение отображает в виде реальных компонентов, поэтому модель управляет представлениями с состоянием, а не только потоками текста.
* AG-UI — это канал выполнения в режиме реального времени, A2UI и Open JSON UI и MCP Apps — это полезные нагрузки: AG-UI передаёт события между агентом и фронтендом, а A2UI, Open JSON UI и MCP UI определяют, как пользовательский интерфейс описывается в виде полезных нагрузок на основе JSON или iframe, которые уровень пользовательского интерфейса отображает.
* CopilotKit стандартизирует подключение агента к пользовательскому интерфейсу: CopilotKit предоставляет SDK, общее состояние, типизированные действия и помощники для генеративного пользовательского интерфейса, чтобы разработчики не создавали собственные протоколы для потоковой передачи состояния, активности инструментов и обновлений пользовательского интерфейса.
* Статический и декларативный генеративный пользовательский интерфейс удобны для производства: большинство реальных приложений используют статические каталоги компонентов или декларативные спецификации, такие как A2UI или Open JSON UI, которые обеспечивают контроль над безопасностью, тестированием и макетом в хост-приложении.
* Взаимодействия пользователя становятся событиями первого класса для агента: клики, правки и отправки преобразуются в структурированные события AG-UI, агент потребляет их в качестве входных данных для планирования и вызовов инструментов, что замыкает цикл управления «человек в цикле».
Генеративный пользовательский интерфейс звучит абстрактно, пока вы не увидите его в действии. Если вам интересно, как эти идеи воплощаются в реальных приложениях, CopilotKit имеет открытый исходный код и активно используется для создания интерфейсов, управляемых агентами — от простых рабочих процессов до более сложных систем. Погрузитесь в репозиторий и изучите шаблоны на GitHub. Всё создано открыто.
Вы можете найти здесь дополнительные учебные материалы по генеративному пользовательскому интерфейсу. Также вы можете скачать руководство по генеративному пользовательскому интерфейсу здесь.
1. Что такое генеративный пользовательский интерфейс и какие возможности он предоставляет?
Генеративный пользовательский интерфейс (Generative UI) — это возможность позволить ИИ-агенту управлять реальными элементами интерфейса, такими как таблицы, диаграммы, формы и индикаторы прогресса. Это позволяет сделать взаимодействие с приложением более интуитивным и похожим на работу с обычным продуктом, а не на чтение журнала токенов.
2. Какие три основных паттерна генеративного пользовательского интерфейса существуют?
Три основных паттерна генеративного пользовательского интерфейса:
* Статический генеративный пользовательский интерфейс: агент выбирает из фиксированного каталога компонентов и заполняет свойства.
* Декларативный генеративный пользовательский интерфейс: агент возвращает структурированную схему, которую рендерер сопоставляет с компонентами.
* Полностью сгенерированный пользовательский интерфейс: модель выдаёт необработанную разметку, такую как HTML или JSX.
3. Зачем разработчикам нужен генеративный пользовательский интерфейс?
Основная проблема в агентских приложениях — это связь между моделью и продуктом. Без стандартного подхода каждая команда создаёт собственные веб-сокеты, специальные форматы событий и способы потоковой передачи вызовов инструментов и состояния. Генеративный пользовательский интерфейс вместе с протоколом, таким как AG-UI, даёт согласованную ментальную модель, что упрощает разработку и тестирование приложений.
4. Как генеративный пользовательский интерфейс влияет на конечных пользователей?
Для конечных пользователей разница становится заметна, как только рабочий процесс становится нетривиальным. Например, помощник по анализу данных может показывать фильтры, сборщики метрик и динамические диаграммы вместо описания графиков в тексте. Агент поддержки может отображать формы редактирования записей и временные шкалы состояния вместо длинных объяснений своих действий. Это делает взаимодействие с ИИ более удобным и понятным.
5. Какие спецификации определяют, как агенты выражают намерение пользовательского интерфейса?
Несколько спецификаций определяют, как агенты выражают намерение пользовательского интерфейса. Документация CopilotKit и документы AG-UI суммируют три основные спецификации генеративного пользовательского интерфейса:
* A2UI от Google, декларативная спецификация генеративного пользовательского интерфейса на основе JSON, разработанная для потоковой передачи и рендеринга, независимого от платформы;
* Open-JSON-UI от OpenAI, открытый стандарт внутренней декларативной схемы генеративного пользовательского интерфейса OpenAI для структурированных интерфейсов;
* MCP Apps от Anthropic и OpenAI, генеративный уровень пользовательского интерфейса поверх MCP, где инструменты могут возвращать интерактивные поверхности на основе iframe.