Что уже построили другие для трёх ваших разделов — и что конкретно из этого стоит забрать. Отобрано по одному критерию: паттерн должен был выдержать продакшн, а не только скриншот в портфолио.
Все продукты сошлись к одной анатомии: таблица запусков → карточка запуска с деревом или таймлайном шагов слева и input/output справа → кнопка запуска, предзаполненная параметрами прошлого рана. Расходятся только в том, чем рисуют шаги.
Три режима одной истории: Compact (последовательность, время игнорируется), Timeline (длина линии = реальная длительность, живо обновляется), Full History (git-дерево). Плюс цветовой код, читаемый без легенды: пунктирный красный — retry, пунктирный фиолетовый — pending.
Кнопка «Start Workflow Like This One» — запуск с параметрами прошлого рана. Для ручного старта оркестратора это почти всегда то, чего человек хочет.
Вкладки Result / Detail / Tracing — буквально ваша формулировка «статус, шаги, итоги», разложенная по уровням аудитории: Result бизнесу, Tracing инженеру. Одна страница обслуживает обе роли без развилки в навигации.
На канвасе у каждой ноды свой «Last run» — drill-down не только в запуск, но и в отдельный шаг.
Иерархия Sessions → Traces → Observations — уровень сессий есть далеко не у всех, а он нужен, когда один бизнес-процесс это несколько запусков агента. Трейс показан и деревом, и графом переходов.
Thread logs: упорядоченные run steps и tool calls, input/output между пользователем и агентом, привязанные метрики оценки. Единственный источник с настоящими картинками трейс-вью в открытой документации.
Дерево ранов: слева список шагов, справа input/output выбранного, сверху — вход и выход всего трейса. Полезная мелочь: Share публикует трейс по read-only ссылке — удобный способ отдать лог заказчику без доступа в систему.
Инженерная сторона спектра. Prefect — живой граф, ноды перекрашиваются по ходу выполнения. Dagster — Gantt вверху, лог событий снизу. Airflow Grid — матрица «таск × запуск», эталон для сравнения множества прогонов между собой.
Клик по запуску открывает не отдельный вид, а тот же канвас с наложенным статусом на ноды — реплей выполнения на графе. Ретрай прямо из списка, с выбором: на текущей версии воркфлоу или на исходной.
Мультиагентная специфика: стриминг сообщений агентов в реальном времени, граф передачи управления, кнопка Cancel на живом ране. У CrewAI — три уровня детализации одного шага во вкладках Messages / Details / Raw Data.
Раздел распадается надвое: реестр функций с логами вызовов и UI над config-service. Первая половина решена в serverless-платформах, вторая — в feature-flag системах и prompt-менеджерах.
Сильнейший референс под этот раздел. Двухпанельный вид: слева waterfall-таймлайн спанов, справа детали выбранного шага. Два приёма стоит забрать дословно:
Составной бар — серый сегмент (queue delay) плюс цветной (execution): сразу видно, тормозит выполнение или очередь. Ретраи отдельными спанами с бейджем «Attempt N», красный/зелёный — история попыток читается без раскрытия логов.
Верхний уровень раздела «Функции»: список с метриками (invocations, duration, error rate) — Lambda. Группировка логов по одному вызову, а не сплошным потоком — Workers. Разделение уровней логирования (деплой отдельно, вызовы отдельно) — Modal.
Ключевая находка не про визуал, а про модель. Версии — иммутабельные снапшоты, а «деплой» это перемещаемый лейбл: production, staging, tenant-1. От того, есть ли у вас иммутабельные версии, зависит, существует ли вообще экран «история и откат».
Эталон приоритета правил: individual targeting → segment/custom rules (drag-n-drop реордер) → default. Порядок вычисления виден в самой вёрстке — сверху вниз. Плюс approval-флоу как код-ревью, если конфиг правят несколько ролей.
Vault: различие «Create new version» и «Patch latest» — две разные операции над конфигом, и это честно вынесено в UI. AppConfig: раскатка конфига стратегией с bake time и откатом — если у вас есть прод-агенты, конфиг стоит катить, а не переключать.
Формы редактирования параметров можно генерить из схемы, а не рисовать руками — для разных типов агентов это снимает основной объём фронтенда. Темы под MUI, AntD, Chakra.
Оговорка: автогенерённые формы выглядят одинаково-безлико. Если конфигуратор — один из трёх главных экранов, разумнее гибрид: схема для длинного хвоста параметров, ручной UI для 5–10 ключевых.
Здесь индустрия сошлась к десятку узнаваемых способов связать чат с канвасом. Ниже — типология: она полезнее списка продуктов, потому что выбор паттерна определяет всю навигацию раздела.
| Паттерн | Где живёт чат | Как рождается панель | Кто так делает |
|---|---|---|---|
| Персистентный сайдбар | Узкая панель, хоткей, видит текущую страницу | Генерирует объект → явное «сохранить» | Grafana Assistant, Metabot |
| Три колонки: навигация / чат / канвас | Отдельная полноэкранная страница | Рендерится live по ходу диалога, сохраняется кнопкой | Grafana Workspace, Omni |
| Компаньон конкретного дашборда | Кнопка «Ask» на самом дашборде | Не создаёт, а объясняет — read-only слой | Databricks Genie, ThoughtSpot |
| Пейн внутри редактора | Докнут в Edit-режиме рядом с канвасом | Промпт рисует визуал прямо на канвасе | Power BI Copilot |
| Чат первичен, дашборд — артефакт | Чат и есть главный экран | Чарт в сообщении, клик открывает side drawer | Zenlytic, Julius |
| Дашборд целиком по одному промпту | Пустой дашборд с полем ввода | План запросов → авто-раскладка → publish | Basedash, Omni Builder |
| Правка панели через её меню | Контекстное меню тайла | Меню передаёт панель в чат как контекст | Grafana, Omni, Genie |
| Review перед применением | Модалка с диффом поверх канваса | Принять/отклонить по каждой панели | Hex «Pending changes» |
| Чат снаружи, через MCP | Claude или ChatGPT как клиент | LLM зовёт API платформы | Superset, Metabase MCP |
| Проактивный push | Дайджест в Slack, чат вторичен | Метрика приходит сама, диалог — drill-down | Tableau Pulse |
Наиболее проработанная связка. Два режима одного ассистента: узкий сайдбар для быстрых правок по ходу просмотра и полноэкранный Workspace — беседы, чат, живой канвас. Дашборд рисуется на глазах, но в систему попадает только по «Save to Grafana».
Панель попадает в чат через своё контекстное меню — «Explain», «Troubleshoot», «Suggest improvements». Не чат ищет панель, а панель приносит себя в чат.
Единственный найденный продукт с честным диффом правок агента: модалка проводит по каждому изменению, принять или отклонить можно поячеечно. Ничего не применяется само.
Чат генерируется под конкретный опубликованный дашборд автоматически при публикации. Клик по чарту сужает контекст до него. Правый клик — «объясни изменение», агент возвращает факторы, повлиявшие на метрику.
Omni — split-view плюс «Ask a follow up» в меню тайла. Metabase — три готовых layout-режима чата в SDK (sidebar, stacked, auto). Basedash — сборка дашборда одним промптом с явным draft-режимом.
Инвариант всех зрелых продуктов: сгенерированная агентом панель — это обычный нативный объект, а не «AI-чарт» отдельного класса. Её всегда можно доредактировать мышью так же, как собранную руками. И ничего не публикуется без явного подтверждения — либо кнопка, либо дифф.
Не раздел платформы, а материал для сборки: на чём строить и у кого списывать эстетику.
Рабочая связка под React: shadcn даёт скелет — таблицы, дропдауны, командную палитру; Tremor закрывает метрики и чарты. Поверх — типографика и плотность в духе Linear и Vercel.
Настоящая observability-дизайн-система с готовым Figma-китом. Учитывая, что трейсы у вас и так в Grafana, визуальная преемственность идёт бонусом.
Каталог сущностей, карточка, права доступа. Модель ближе к вашей платформе, чем любой AI-продукт из списка: у вас три раздела с одинаковой анатомией, и это ровно то, что Backstage параметризует типом сущности.
Паттерны прав и команд лучше всего разобраны у Ant Design Pro (enterprise-формы и роли из коробки), Atlassian и Clerk — у последних есть готовый Figma-кит ролевого UI.
Быстрее, чем регистрироваться в каждом продукте: nicelydone.club хранит полные наборы экранов Vercel, Clerk, Railway, Retool. saasui.design ищет по паттернам — dashboard, settings, onboarding.
Если нужен старт не с нуля: Dify (Next.js в /web), Langfuse, Open WebUI, LibreChat. Смотреть стоит даже без форка — там видно, как решены пустые состояния и длинные списки.
Про Dribbble и подобное: там красивые макеты, которые не выдерживают реальных данных — двухсот запусков, длинных идентификаторов, ошибки на пол-экрана. Брать оттуда цвет и настроение, но не раскладку. Раскладку — из Temporal, Inngest, Langfuse, где интерфейс бился о продакшн.