Віджет голосового AI-асистента для сайту

Про проєкт

В рамках проєкту було поставлено завдання розробити для сайтів голосового AI-асистента, який у режимі реального часу консультує користувача голосом, розуміє його питання, використовує базу знань компанії та допомагає людині не загубитися у складній структурі послуг та digital-рішень.

На відміну від класичних чат-ботів, які найчастіше працюють за обмеженими сценаріями або відповідають як довідкова система, цей асистент повинен був поводитися як живий цифровий консультант: спочатку відповідати по суті, потім акуратно уточнювати контекст, після цього пропонувати корисний наступний крок і в потрібний момент допомагати швидко сформулювати короткий.

Мета проєкту полягала не просто у створенні нової AI-функції для сайту, а у вирішенні конкретних бізнес-завдань: підвищити залучення відвідувачів, збільшити конверсію сайту в ліди, зменшити бар'єр входу для клієнтів, скоротити навантаження на відділ продажу на етапі первинної кваліфікації та покращити якість вхідних звернень.

Проблема бізнесу

Коли компанія продає складні послуги — наприклад, розробку CRM, кастомних платформ, інтеграцій, автоматизацію бізнес-процесів, рішення у сфері Web3, криптопроєктів чи геймдева — більшість користувачів приходить на сайт без чіткого розуміння, що саме їм потрібно.

Запити дуже різняться: один клієнт цікавиться вартістю, інший формулює завдання максимально абстрактно, третій не розуміє, яке рішення йому потрібно — чат-бот, внутрішня система чи комплексна розробка з інтеграціями. При цьому багато хто хоче отримати швидку відповідь, не вникаючи у довгі тексти та не заповнюючи форми.

У звичайному сценарії такі запити йдуть менеджерам. Команда витрачає час на базові консультації, багато разів пояснює те саме, намагається вручну зібрати вимоги, уточнити завдання та визначити, наскільки запит взагалі цільовий. При цьому частина користувачів не доходить до заявки, тому що не хоче заповнювати форму, не розуміє, що писати або просто відкладає звернення. В результаті бізнес втрачає частину потенційних лідів, а менеджери отримують неструктуровані запити.

Потрібен був інструмент, який міг би розпочати комунікацію замість менеджера, але при цьому не виглядав би як суха анкета чи нав'язливий сценарний бот. Саме тому в проєкті було обрано формат голосового AI-асистента, який спілкується природно, відповідає відразу, розуміє намір користувача та у потрібний момент допомагає перейти до наступного кроку. Такий формат відповідає початковій ідеї рішення: асистент має бути не просто довідковим ботом, а саме presale-консультантом та помічником у підготовці заявки.

Концепція рішення

Ми спроєктували асистента як багатошарову AI-систему, яка поєднує чотири режими роботи.

• Перший режим - info mode. У ньому асистент відповідає на звичайні питання про компанію, послуги, кейси, технології, терміни, формат роботи і способи зв'язку.
• Другий режим – consult mode. У цьому режимі AI не просто повідомляє інформацію, а допомагає користувачеві зрозуміти, який формат рішення йому підходить: MVP чи full-scale розробка, CRM чи окремий модуль, інтеграція чи повноцінна система.
• Третій режим - brief mode. Якщо користувач готовий обговорювати проєкт предметно, асистент ставить обмежену кількість коротких уточнюючих питань, збирає ключові вступні та формує структуроване резюме запиту.
• Четвертий режим - lead handoff mode. Коли даних вже достатньо, система пропонує передати короткий бриф менеджеру, запитує контакт та надсилає інформацію до CRM, email, Telegram або іншого каналу. Саме ці режими та логіка автоматичного перемикання між ними були передбачені в архітектурі рішення.

Окремо важливим був принцип поведінки. Помічник не повинен влаштовувати допит, ставити довгі ланцюжки сухих питань, нав'язливо продавати, рано вимагати контактні дані або вигадувати терміни та бюджети.

Коректна формула діалогу описана як: відповідь → м'яке уточнення → корисна рекомендація → наступний крок.

Саме за рахунок такої моделі спілкування інструмент працює як реальний цифровий консультант, а не форма кваліфікації, замаскована під чат.

Що вміє голосовий AI-помічник

Рішення покриває кілька ключових сценаріїв користувача.

Консультація з послуг та компанії

Користувач може запитати, чим займається компанія, які послуги надає, які технології використовує, чи розробляє CRM, AI-ботів, AI-асистентів, мобільні додатки або кастомні платформи. Асистент відповідає на основі бази знань та може підлаштувати формулювання під поточний контекст сайту та сторінки. Сценарій довідкової консультації було закладено як із базових.

Навігація сайтом

Асистент розуміє, де зараз користувач, який розділ сайту відкритий, і може допомогти перейти до потрібної сторінки, кейсів, контактів або релевантної послуги. За наявності технічної можливості він не тільки відкриває URL-адресу, але й прокручує до потрібного блоку або підсвічує інтерфейсний елемент. У технічному завданні для вирішення прямо передбачені контекст сторінки, навігація по сайту, переходи по розділах та робота з релевантними CTA.

Presale-консультація

Якщо користувач ставить запитання у стилі “що мені краще підходить?”, “Мені потрібен бот, CRM або AI-асистент?”, “Потрібен MVP чи повноцінна розробка?”, система не просто дає довідку, а пояснює різницю між варіантами та допомагає зорієнтуватися.

Збір короткого брифу

Коли користувач зацікавлений обговорити проєкт, асистент пропонує допомогти швидко сформулювати запит, ставить 3–5 ненав'язливих уточнюючих питань та збирає структуровану інформацію: тип проєкту, нішу бізнесу, рівень вирішення, бажаний функціонал, наявність референсів, терміни, бюджетний орієнтир та спосіб зв'язку. На виході система формує коротке резюме у структурованому вигляді.

Передача ліда менеджеру

Після того як зібрана достатня інформація, помічник пропонує передати резюме менеджеру, запитує контакт і зберігає дані в систему. Далі відбувається надсилання інформації в CRM.

Як працює система

1. Користувач натискає кнопку запуску голосового асистента.
2. Сайт запитує доступ до мікрофона, після чого помічник вітає користувача і пропонує поставити запитання.
3. Далі можливі два формати взаємодії: людина говорить голосом чи пише текстом.
4. Система розпізнає мовлення, визначає намір користувача та вибирає відповідний режим: просто відповісти, допомогти з навігацією, проконсультувати за форматом рішення або перейти в режим brief assistant.
5. Якщо під час розмови стає зрозуміло, що користувач зацікавлений у проєкті, AI м'яко переводить комунікацію в режим збору брифу.
6. Після отримання достатнього обсягу вступних даних система пропонує передати короткий запит менеджеру та попросити контакт.
7. Після цього бриф і контактні дані надсилаються до CRM, а користувач отримує підтвердження наступного кроку.

UI/UX рішення

На стороні інтерфейсу був передбачений компактний widget, що плаває, який не заважає перегляду сайту, не запускається автоматично без дії користувача і не займає занадто багато простору.

Віджет включає кнопку запуску голосового діалогу, індикацію того, що помічник слухає, індикацію відповіді, можливість завершити розмову, а також перемикання на текстовий режим.

В інтерфейсі діалогу передбачені voice mode, text mode, останні репліки, короткі підказки про те, що можна спитати, та окрема кнопка передачі запиту менеджеру.

Технології та архітектура

Це одна з найважливіших частин проєкту, тому що саме архітектура визначає, чи буде помічник корисним, швидким і масштабованим.

• Voice layer: мовний інтерфейс у реальному часі

Для голосової взаємодії в проєкті використовувався стек conversational voice AI - Платформа ElevenLabs Conversational AI. Вона відповідає за природне озвучення, realtime voice-діалог і загальну якість голосового шару. Завдяки цьому помічник не просто виводить текст на екран, а веде повноцінну голосову комунікацію, що особливо важливо для залучення та зручності користувача на сайті.

• LLM-ядро та reasoning

Як мовне ядро для розуміння запитів, reasoning-логіки, генерації відповідей та формування brief summary використовувався OpenAI. Це не випадковий вибір: у такій архітектурі LLM використовується не тільки як генератор тексту, а й як оркестратор діалогу, який визначає намір користувача, допомагає вибирати режим роботи асистента, утримує контекст розмови та формує корисні, а не шаблонні відповіді. Окремо LLM застосовується в логіці brief generation - при перетворенні розрізнених реплік користувача на структурований короткий бриф.

• Knowledge base та RAG

Ключова особливість помічника в тому, що він повинен відповідати не "взагалі", а на базі знань конкретної компанії. Система працює не тільки лише за контентом веб-сайту, та й на базі окремої структурованої knowledge base. Ця база включає опис компанії, список послуг, напрями розробки, project flows, FAQ, етапи реалізації, кейси, орієнтири за термінами та бюджетами, правила кваліфікації ліда, сценарії передачі запиту до відділу продажу та CTA-логіки.

Щоб працювати з такими даними, в архітектурі передбачено RAG / knowledge retrieval шар - пошук релевантної інформації з бази знань з подальшою передачею контексту в LLM. У проєкті використовувався vector DB. Це дозволяє масштабувати рішення: оновлювати знання без переписування коду, підключати нові послуги, редагувати sales-логіку та адаптувати помічника під різні сайти або розділи сайту.

• Conversation state та session memory

Щоб діалог не перетворювався на набір незв'язаних реплік, асистент повинен пам'ятати, що вже сказав користувач, який тип проєкту обговорюється, який етап розмови йде, які дані брифу вже зібрані, яка сторінка відкрита і який кращий крок варто запропонувати. У системі передбачено окремий session state шар, який утримує контекст у рамках однієї сесії. Це особливо важливо для brief mode, коли помічник ставить питання поетапно і збирає інформацію не за один запит, а в кілька кроків.

• Frontend-частина

На фронтенді рішення включає голосовий widget, UI діалог, підключення мікрофона, відображення станів, управління навігацією по сайту і відправлення запитів в backend. Тобто це не просто iframe із зовнішнім чатом, а повноцінний інтерфейсний шар, інтегрований у сайт та здатний взаємодіяти зі сторінкою: розуміти контекст, запускати переходи, прокручувати блоки та працювати як нативна частина digital-продукту.

• Backend-частина

На серверній стороні архітектура включає обробку запитів користувача, управління conversation state, intent detection, підключення LLM, knowledge retrieval, генерацію відповідей, логіку brief mode і handoff-а, а також інтеграції з CRM і webhook-каналами. Саме backend забезпечує оркестрацію всього цього інструменту: приймає подію з сайту, запускає обробку, визначає сценарій відповіді, підмішує знання компанії, формує підсумкову відповідь та вирішує, чи потрібно перевести користувача до менеджера.

• Інтеграція

Важливою частиною проєкту стали API-інтеграція. Архітектурою були передбачені інтеграції з LLM API, voice/TTS API, speech-to-text, CRM webhook-інфраструктурою та аналітикою подій. На практиці це означає, що асистент можна включити в існуючий sales-процес компанії: передавати бриф у CRM, відправляти короткий лід менеджеру, фіксувати факт запуску розмови, записувати подію успішної передачі контакту або відстежувати, на яких сторінках рішення працює найкраще.

Етапи реалізації

Проєктну логіку було розбито на кілька етапів.

На першому етапі було реалізовано MVP: voice widget, відповіді знань компанії, базова навігація сайтом, text fallback і проста передача контакту менеджеру.

На другому етапі були додані brief mode, session memory, structured summary та передача брифа в CRM/Telegram/email.

Надалі можливе розширення рішення: підсвічування блоків інтерфейсу, розумніша кваліфікація ліда, персоналізація по сторінці, багатомовність та розширена аналітика.

Бізнес-цінність рішення

Використання голосового AI-асистента для сайту допомагає компанії вирішувати відразу кілька завдань:

По-перше, підвищується залучення відвідувачів. Голосовий формат сам по собі знижує бар'єр входу: користувачеві простіше поставити запитання голосом, ніж читати довгі сторінки або заповнювати форму.

По-друге, зростає конверсія сайту в ліди. Асистент не просто відповідає, а веде користувача до наступного кроку: показати релевантну послугу, допомогти визначитись із форматом рішення, зібрати короткий бриф, передати контакт менеджеру.

По-третє, знижується навантаження на sales-команду. Первинна консультація, базова кваліфікація та збір вступних даних автоматизуються, а менеджер отримує більш підготовлений та структурований лід.

По-четверте, покращується якість комунікації. Відповіді стандартизуються, але при цьому залишаються персоналізованими за рахунок контексту сторінки, знання та логіки діалогу.

Результат

В результаті було спроєктовано та реалізовано голосовий AI-асистент для сайту, який допомагає користувачу орієнтуватися в послугах компанії, відповідає на запитання, допомагає зрозуміти, що саме йому потрібно, м'яко збирає короткий бриф за проєктом та перекладає комунікацію до менеджера. Це саме той очікуваний результат, який був сформульований у постановці завдання: не довідковий бот, а presale-асистент, що підвищує конверсію сайту якісні ліди.

Бажаєте впровадити голосового AI-помічника на ваш сайт?

Проаналізуємо ваші сценарії користувача, підготуємо архітектуру, зберемо базу знань, налаштуємо voice AI, LLM-логіку, brief mode та інтеграцію з CRM.

В результаті ви отримаєте не просто AI-віджет, а інструмент, який допомагає сайту консультувати, кваліфікувати та продавати.

👉 Залишіть заявку – обговоримо ваш проєкт.