Generative UI: как AI‑агенты могут собирать интерфейсы на лету вместо статического фронтенда

Традиционные пользовательские интерфейсы обычно строятся по фиксированным сценариям. Разработчик заранее определяет, какие действия доступны пользователю, задаёт макеты страниц и привязывает данные к конкретным элементам интерфейса: карточкам, таблицам, формам. Пока пользователь действует в этих рамках, всё работает предсказуемо. Но стоит задать более сложный вопрос, например объединить несколько источников данных или изменить способ отображения информации, приложение часто упирается в ограничения и требует нового кода.
Подход Generative UI (GenUI) предлагает другую логику. Интерфейс формируется прямо в момент запроса при участии AI‑агента. Вместо вывода данных в заранее заданный макет языковая модель решает, как именно показать информацию. Допустим, пользователь ищет рестораны. Сначала агент может вывести карту и карусель карточек заведений. Затем, после новой команды, перестроить представление и сгенерировать таблицу сравнения вместе со столбчатой диаграммой рейтингов.
Как пишет Towards AI, уровень автономности таких интерфейсов бывает разным. В модели Controlled Generative UI разработчики готовят библиотеку компонентов, например ShowRestaurantCard, ReservationForm или MapView. Агент в этом случае лишь выбирает подходящий элемент и показывает полученные данные через него. В Declarative Generative UI у агента есть более базовый набор блоков: Container, Button, Text, Image, Grid. Из них он сам собирает структуру интерфейса, часто в виде JSON, прямо во время работы.
Есть и самый свободный вариант, Open‑Ended Generative UI. Здесь агент может подключать сторонние виджеты или генерировать интерфейсный код напрямую, например React, HTML или Tailwind. Затем этот код отображается в изолированной среде приложения. В одном из примеров пользователь задаёт бюджет $500 на 10 человек и просит смоделировать, как изменится общий счёт в трёх ресторанах при добавлении коктейлей или закусок. Агент в ответ создаёт собственный интерактивный интерфейс, где такую симуляцию можно провести.
Ключевые факты
Generative UI предполагает, что AI‑агент формирует интерфейс во время выполнения запроса пользователя, а не использует заранее заданный макет.
Описаны три подхода: Controlled Generative UI, Declarative Generative UI и Open‑Ended Generative UI.
В Controlled Generative UI агент выбирает готовые компоненты из библиотеки, например ShowRestaurantCard, ReservationForm и MapView.
В одном из примеров пользователь задаёт бюджет 500 $ на 10 человек и просит смоделировать расходы в трёх ресторанах, после чего агент генерирует собственный интерфейс для расчёта.