Перейти к содержимому
Антон ГончаровРазработчик ИИ-систем

Веб-приложение · метрики · пороги CI

Оценка качества бота

«Кажется, стало лучше» — не аргумент. Бот поддержки при каждом изменении проходит 40 контрольных вопросов, и выкладка не уйдёт к пользователям, если метрики упали ниже порога. Приложение повторяет эту проверку в браузере: можно сравнить поиск по словам, нейросеть и гибрид, покрутить настройки и увидеть, какие вопросы от этого стали лучше, а какие сломались.

Сценарий: Бот поддержки коворкинга «Квадрат»: его база знаний, его 40 вопросов из CI и 20 перефразированных вопросов.

Скриншот демо: Оценка качества бота

Открыть демо

Конфигурация «Как в проде» считается сразу. Для нейросети и гибрида модель грузится по кнопке — около 126 МБ один раз.

Приложение работает в браузере: на сервер ничего не отправляется.

Что показывает демо

  • Набор из CI бота: 40 вопросов, из них 6 не по теме — правильный ответ на них «не знаю»

  • Метрики: нужный документ первым (hit@1), в тройке (hit@3), верные отказы и время на вопрос

  • Четыре конфигурации: как в проде, смысловая модель, гибрид и своя — с ползунками BM25, порогов и длины фрагментов

  • Сравнение с продом: какие вопросы стали лучше, какие хуже — «было → стало» по каждому

  • Пороги как в CI: плашка «CI бота не пропустил бы такую выкладку» с причиной

  • Свои вопросы с ожидаемым документом, отчёт в Markdown и JSON

Как попробовать

  1. Откройте приложение

    Открыта «Своя» конфигурация с заниженным порогом «не знаю»: бот начинает отвечать на вопросы не по теме, и CI такую выкладку не пропустил бы. Нажмите «Как в проде» — пороги пройдены.

  2. Подключите нейросеть

    «Загрузить модель», затем карточка «Смысловая модель» или «Гибрид». Набор прогонится заново, а ниже появятся вопросы, которые стали лучше и хуже, чем в проде.

  3. Переключите набор

    На перефразированных вопросах поиск по словам проседает, а гибрид находит больше — но ошибается на вопросах не по теме. Так и выбирают настройку: по цифрам, а не по ощущениям.

  4. Добавьте свои вопросы

    Вопрос и документ, в котором ответ, — и метрики пересчитаются. Отчёт можно скачать в Markdown для задачи или ревью.

Без платных нейросетей

Метрики здесь настоящие: тот же поиск и те же вопросы, что в CI демо-бота, а нейросеть работает в браузере. Языковая модель не участвует — оценивается поиск, от которого зависит ответ. В рабочем проекте к этим метрикам добавляется проверка самих ответов модели: по фрагментам ли она отвечает и не выдумывает ли.

Демо работает без API-ключей OpenAI, YandexGPT или GigaChat. Там, где рабочая система обращается к модели, стоит локальная заглушка с тем же интерфейсом — поэтому демо бесплатно, всегда доступно и ничего не выдумывает.

Что будет в рабочем проекте

  • Контрольные вопросы из реальных диалогов, а не придуманные — с разметкой правильного документа
  • Прогон в CI на каждое изменение базы, промпта или модели — с порогами, которые блокируют выкладку
  • Оценка ответов модели: опора на источники, отказ вне темы, устойчивость к prompt-инъекциям
  • История метрик по релизам — видно, что именно улучшило или сломало бота

Стек

  • React 19
  • TypeScript
  • Transformers.js
  • Web Workers
  • Comlink
  • Zustand
  • Vite

Основано на

Книги и дисциплины, идеи из которых работают в этом демо.

  • Книга · Роберт Мартин

    Идеальный программист

    Пороги как в CI: если метрики упали, плашка сообщает, что такую выкладку CI бы не пропустил, — не выпускаю то, в чём не уверен.

  • Книга · Джон Берриман, Альберт Циглер

    Промпт инжиниринг для LLM

    Любое изменение настройки бота прогоняется на 40 контрольных вопросах: hit@1, hit@3 и доля верных отказов показывают, стало лучше или хуже.

Комментарий от разработчика

Антон Гончаров

Разработчик ИИ-систем · Python

Для бизнеса

  • Каждое изменение бота проверяется до выкладки: если качество упало, выкладка останавливается, и клиенты этого не увидят.
  • Настройку выбирают по цифрам на контрольных вопросах, а не по впечатлению.
  • Отчёт можно приложить к задаче — сразу понятно, что улучшилось и что сломалось.

Для разработчиков

  • Метрики — hit@1, hit@3 и доля верных отказов на 40 вопросах из CI бота, 6 из них не по теме; плюс 20 перефразированных вопросов.
  • Прогон идёт в Web Worker через Comlink, поэтому интерфейс не замирает даже со смысловой моделью.
  • Сравнение с продом — по каждому вопросу, «было → стало»: регрессии видны поимённо, а не только в среднем.

Советы

  • Совет 01

    Включайте в набор вопросы не по теме: hit@k их не видит, а именно на них бот выдумывает.

  • Совет 02

    Порог в CI должен блокировать выкладку, а не писать предупреждение: предупреждения перестают читать через неделю.

Нужен такой же для вашего бизнеса?

Расскажите о задаче — отвечу, что из демо подойдёт вам, сколько это займёт и что понадобится с вашей стороны.

Другие демо в этом разделе

Все демо
  • Веб-приложение · схема агента

    работает

    Конструктор AI-агента

    Агент поддержки собирается из блоков: намерения, база знаний, вызовы API, проверки и передача оператору. Отправьте сообщение клиента — путь подсветится на схеме шаг за шагом.

    • React
    • TypeScript
  • Веб-приложение · вопрос → SQL → график · PostgreSQL в браузере

    работает

    ИИ-аналитик данных

    Руководитель спрашивает своими словами — «выручка по каналам за 3 квартал», «какие клиенты перестали заказывать» — и получает SQL, график, таблицу и вывод. База продаж — настоящий PostgreSQL, который работает прямо в браузере.

    • React
    • TypeScript
  • Веб-приложение · риски по эталону · Word с правками

    работает

    Проверка договоров

    Контрагент прислал свой договор — проверка сверяет его с эталоном компании, подсвечивает рискованные пункты, объясняет, чем они опасны, и предлагает редакцию. На выходе — Word с режимом исправлений и протокол разногласий.

    • React
    • TypeScript
  • Веб-приложение · задачи из чата · канбан · вечерняя сводка

    работает

    ИИ-агент в рабочем чате

    В рабочем чате пишут как обычно — «Петя, до пятницы поправь прайс». Агент сам заводит задачу на канбане, двигает её по «Беру» и «Готово», переносит сроки и передаёт задачи, утром напоминает о просрочке, а вечером присылает сводку.

    • React
    • TypeScript
  • Веб-приложение · общий ящик · CRM · защита от подмены реквизитов

    работает

    ИИ-разбор входящей почты

    Агент читает общий ящик отдела продаж: понимает, что за письмо, достаёт поля, заводит сделку, обращение или задачу в CRM и готовит ответ. Счёт с новыми реквизитами и фишинг он ловит до того, как кто-то заплатит или перейдёт по ссылке.

    • React
    • TypeScript
  • Веб-приложение · маркетплейсы · проверка модерации · юнит-экономика

    работает

    Карточки товаров для WB и Ozon

    Агент превращает текст поставщика в две карточки — для Wildberries и для Ozon: название в лимите площадки, описание с ключевыми запросами, характеристики по справочнику. Потом проверяет то, на чём карточки срезаются на модерации, и считает, сколько останется с продажи.

    • React
    • TypeScript
  • Веб-приложение · расшифровка встречи · протокол · канбан

    работает

    Протокол совещания → задачи в канбан

    Агент читает расшифровку планёрки и собирает протокол: решения, задачи с исполнителем и сроком из живой речи, риски и открытые вопросы. Задачи уходят на канбан, а на следующей встрече агент сам двигает их по статусам.

    • React
    • TypeScript
  • Веб-приложение · персональные данные · медицина · аналитика

    работает

    Обезличивание данных перед нейросетью (152-ФЗ)

    Агент находит в письмах и расшифровках ФИО в любом падеже, телефоны, паспорта, СНИЛС, карты, адреса и диагнозы, заменяет их до отправки во внешнюю нейросеть, а её ответ возвращает к настоящим данным уже у вас. Таблицу пациентов обезличивает для аналитики так, чтобы никого нельзя было узнать.

    • React
    • TypeScript
  • Веб-приложение · автоматизация · amoCRM, 1С, Telegram

    работает

    Конвейер автоматизации в духе n8n

    Три рабочих сценария мебельной фабрики на холсте, как в n8n: заявки с сайта уходят в amoCRM и к менеджерам по горячести, оплата ЮKassa — в 1С с повторами и веткой ошибок, по утрам — сводка руководителю. Запустите событие и смотрите, как записи идут от узла к узлу; схему можно править и выгрузить в настоящий n8n.

    • React
    • TypeScript
  • Веб-приложение · мультиагентная система · контент

    работает

    Команда ИИ-агентов для контента

    Шесть агентов готовят публикацию по брифу: главред планирует, исследователь ищет факты в базе знаний, автор пишет, фактчекер и редактор возвращают черновик на доработку, SMM раскладывает текст по Telegram, ВКонтакте, рассылке, блогу и карусели. Видно всю переписку агентов, каждую правку и что ушло бы в публикацию без проверки.

    • React
    • TypeScript
  • Веб-приложение · HR · скоринг и чат-бот

    работает

    Отбор резюме и бот-интервьюер

    Двадцать резюме на три вакансии разбираются за секунды: периоды работы, стаж, зарплата и город, совпадение с требованиями и цитата из резюме на каждое «да» или «нет». Чего в резюме не хватает, уточняет бот: задаёт только недостающие вопросы, переспрашивает размытые ответы и записывает на собеседование. Пол, возраст и семья в оценку не попадают.

    • React
    • TypeScript
  • Веб-приложение · RAG · нейросеть в браузере

    работает

    Песочница поиска

    Как бот поддержки находит ответ в базе знаний: документы режутся на фрагменты, поиск идёт по словам, по смыслу или гибридом, и у каждого найденного фрагмента видно, почему он выше других.

    • React
    • TypeScript
    • Нейросеть в браузере
  • Веб-приложение · безопасность AI · нативный JS

    работает

    Тренажёр защиты от prompt-инъекций

    Попробуйте обмануть бота поддержки: выманить секретный промокод, вытащить системный промпт или оформить возврат без оснований. Шесть уровней защиты, атаки в лоб и через письма, отзывы и базу знаний, журнал проверок по OWASP Top 10 для LLM.

    • Нативный JS
  • Веб-приложение · экономика AI · нативный JS

    работает

    Калькулятор стоимости AI-бота

    Сколько будет стоить бот в месяц на GPT, Claude, YandexGPT, GigaChat или своей модели на арендованной видеокарте. Расчёт по токенам, сравнение всех моделей на графике, советы, как платить меньше, и настоящий токенизатор o200k прямо в браузере.

    • Нативный JS