Иллюзия простоты
Привет, Хабр! На связи Вадим, сооснователь проекта Аврора.
В октябре мы запустили MVP AI-агента автоматизирующий поиск работы. Стек классический для стартапа образца 2025 года: Python-бэкенд + Telegram-бот в качестве фронтенда.
Логика казалась железной: «Зачем пилить сайт, верстать адаптив и мучить юзера регистрацией, если все сидят в телеге? Сделаем инлайн-кнопки, и погнали».
Мы ошиблись.
Если вы делаете «напоминалку» или «генератор картинок» — бот идеален. Но если вы делаете инструмент для тонкой настройки поиска (грейды, исключения, сложные фильтры), интерфейс чата превращается в ад.
Сегодня расскажу, как мы уперлись в UX-стену, временно закрыли регистрацию новых пользователей и за неделю переехали в Web App, чтобы реализовать то, что невозможно сделать кнопками — Real-time превью выдачи.
Проблема: «Управление АЭС через SMS»
В первой версии (на кнопках) флоу настройки выглядел так:
Юзер жмет «Настроить поиск».
Бот присылает сообщение с 10 кнопками.
Юзер жмет «Зарплата».
Бот удаляет старое сообщение, присылает новое: «Введите сумму».
Юзер пишет «200000».
Бот: «Ок, принято. Что дальше?».
Это было долго, больно и, главное, слепо.
Пользователь не понимал:
— А сколько вакансий нашлось по этим параметрам? 5 или 5000?
— А исключил ли бот галеры?
— А понял ли он разницу между Java и JavaScript?
Мы получали фидбек от пользователей: «Я настроил фильтры, но бот шлет мне нерелевантные вакансии». Мы лезли в логи и видели, что пользователь просто устал тыкать кнопки и оставил настройки «по умолчанию» (слишком широкие). Бот работал как «черный ящик».
Решение: Telegram Web App (TWA)
Мы поняли, что нам нужен полноценный UI, но уводить юзера в браузер (Chrome/Safari) — это убивать конверсию. Решение — Web App, который открывается шторкой прямо внутри чата.
Что мы туда вынесли и как это реализовали.
1. Real-time превью и счетчик вакансий
Самая большая боль настройки фильтров — ты не знаешь, сузил ты поиск слишком сильно или нет.
В веб-версии мы реализовали живой запрос к API.
Как это работает:
Пользователь меняет настройку (например, ставит чекбокс «Удаленная работа» или меняет желаемую зарплату).
Фронт «на лету» дергает наш бэкенд.
Бэкенд делает легковесный пре-серч запрос (получение мета-данных, без тяжелого парсинга).
Пользователь мгновенно видит цифру: «Найдено вакансий: 521».
Если цифра падает до нуля — юзер сразу понимает: «Я перекрутил фильтры».
Кнопка «Посмотреть на хх.ру» генерирует ссылку с аналогичными параметрами, чтобы пользователь мог глазами проверить: «Да, это те компании, которые мне нужны». Это решает проблему доверия к алгоритму.
2. Boolean Search для профи
Мы разделили интерфейс на два режима: «Простой» и «Advanced» (с использованием ИИ и булевой логики).
В чате реализовать логические операторы (AND, OR, NOT) было бы утопией. Пришлось бы писать парсер текстовых команд и учить юзеров синтаксису. В Вебе мы развели это на разные вкладки.
Simple Mode: Теги (включить/исключить). UI сам подставляет логику.
Advanced Mode: Одно поле ввода для тех, кто хочет написать сложный запрос, например:
(Java OR Kotlin) AND NOT (Crypto OR Gambling).
3. UX мелочи, которые решают
Обратите внимание на детали реализации UI:
Темная тема: Нативная, подтягивается из настроек Телеграма (
window.Telegram.WebApp.colorScheme). Приложение выглядит как часть мессенджера, а не как чужеродный сайт.Кнопка «Сохранить»: Она отправляет данные (
WebApp.sendData) обратно в бота, который тут же подтверждает изменение настроек сообщением в чате. Бесшовность.
Архитектура переезда
Переезд занял у нас около 10 дней жесткого спринта.
Frontend: React (SPA). Использовали готовые UI-киты под Telegram, чтобы не изобретать велосипед с кнопками и инпутами.
Backend: Python. Пришлось переписать API-эндпоинты. Раньше бот работал пошагово (State Machine), теперь он принимает один большой JSON-объект с полным конфигом пользователя.
Итог: Бот должен остаться ботом
Мы не убили бота полностью. Мы просто забрали у него несвойственную функцию — конфигурацию.
Сейчас разделение ответственности такое:
Web App: Настройка, фильтры, редактирование профиля, аналитика.
Чат-бот: Уведомления , быстрые реакции («Откликнуться», «В корзину») и онбординг.
Если вы делаете сложный B2C сервис в Телеграме — не повторяйте наших ошибок. Не пытайтесь строить сложные формы на InlineKeyboardMarkup. Выносите настройки в Web App сразу. Сэкономите месяцы рефакторинга и нервы пользователей.
P.S. Мы готовим релиз нового веб-интерфейса к 20 февраля.
Именно тогда откроется возможность полноценно протестировать работу обновленного движка.
Всем новым пользователям на старте мы начислим 10 откликов и сделаем AI-разбор резюме, чтобы вы могли проверить точность наших алгоритмов на практике.
Чтобы не пропустить момент запуска и забрать бонусы — заходите в наш канал.