--- title: "Про те, як влаштований редактор сценаріїв" description: "Що таке візуальний редактор сценаріїв Scenario Builder, як він працює та чому побудований на блоках і переходах." --- # Про те, як влаштований редактор сценаріїв Редактор сценаріїв (Scenario Builder) — це візуальний інструмент для побудови діалогових сценаріїв ботів у ConnectiveOne. Замість написання коду ви додаєте блоки на полотно, з'єднуєте їх стрілками, налаштовуєте умови і переходи. Ця сторінка пояснює принципи роботи редактора, ключові концепції та чому він влаштований саме так. --- ## Контекст і проблема Діалогові сценарії ботів можуть бути складними: різні гілки розмов, збір даних, переходи до операторів, інтеграції з зовнішніми системами. Описувати таку логіку текстом або кодом важко — легко заплутатися в гілках і переходах. **Що вирішує візуальний редактор:** - Вся логіка діалогу видна на одному екрані: блоки, переходи, умови - Зміни вносяться без коду — через кліки та налаштування полів - Помилки легше знайти — некоректні з'єднання або відсутні переходи видно на схемі - Команда може спільно працювати над сценарієм — кожен бачить структуру **Типові сценарії використання:** - Створення бота з нуля: привітання, меню, збір даних, передача оператору - Додавання нових гілок до існуючого сценарію - Перебудова логіки після змін у бізнес-процесах - Тестування сценарію перед запуском --- ## Основні концепції ### Блоки (ноди) Кожен блок — це елемент логіки сценарію. Блоки мають різні ролі: - **Старт** — точка входу в секцію, тригери (канали, webhook, внутрішні події, MCP Tool). Детальніше: [Що таке стартова нода](/uk/scenariobuilder/explanation/what-is-start-node.md) - **Повідомлення з кнопками** — надіслати текст або меню користувачу. Детальніше: [Меню та кнопки для клієнта](/uk/scenariobuilder/explanation/message-with-keyboard-node.md) - **Очікування вводу** — зібрати дані (текст, число, дата, вибір). Детальніше: [Текст від клієнта](/uk/scenariobuilder/explanation/wait-for-input-node.md) - **Роутер** — направити за умовами в різні гілки. Детальніше: [Умовні гілки (роутер)](/uk/scenariobuilder/explanation/router-node.md) - **Точка виходу / Точка входу** — перейти в іншу секцію або процес. Детальніше: [Перехід між секціями](/uk/scenariobuilder/explanation/entry-exit-section-flow.md) - **Підключення до оператора** — передати діалог оператору. Детальніше: [Живий оператор у діалозі](/uk/scenariobuilder/explanation/connect-to-operator-node.md) - **Set** — зберегти константи / пари ключ-значення. Детальніше: [Зберегти значення для наступних кроків](/uk/scenariobuilder/explanation/set-node.md) - **Дії** — викликати зовнішні системи (API, email, інтеграції) - **Замітка** — пояснення на схемі для команди Блоки додаються через кнопку «+» на полотні. Модальне вікно показує категорії (Основні, Messaging, Data тощо) та пошук. Після додавання блок налаштовується в панелі справа (Node Inspector). ### Полотно і переходи **Полотно (Canvas)** — центральна область, де розташовуються блоки. Ви перетягуєте блоки, з'єднуєте їх стрілками (edges). Стрілка визначає порядок виконання: після завершення одного блоку виконання переходить до наступного. **Переходи** можуть бути: - **Простими** — один вихід з блоку до одного наступного - **Розгалуженими** — роутер з кількома умовами направляє в різні гілки - **Між секціями** — точка виходу з однієї секції з'єднується з точкою входу в іншу ### Секції Складні сценарії розбиваються на **секції**. Секція — це група блоків з власною логікою. Точки виходу та входу дозволяють переходити між секціями без дублювання коду. Це спрощує підтримку: зміни в одній секції не впливають на інші. ### Змінні та константи **Змінні процесу** — дані, які зберігаються під час діалогу (ім'я користувача, вибір, введені значення). Вони є в окремій панелі зліва і доступні в блоках через підстановку `{{variable_name}}`. **Константи** — значення, які не змінюються під час діалогу (наприклад, URL API, ключі). Також керуються в бічній панелі. ### Пошук на полотні У верхній панелі є **пошук нод**: можна швидко знайти блок за назвою чи вмістом, у поточній секції або в усьому сценарії. Покроково: [Як знайти ноду на полотні](/uk/scenariobuilder/how-to/find-nodes-on-canvas.md). --- ## Як це працює разом 1. Ви відкриваєте сценарій у бібліотеці процесів або створюєте новий. 2. На полотні додаєте блоки та з'єднуєте їх стрілками. 3. В панелі справа налаштовуєте кожен блок: текст, умови, параметри дій. 4. Змінні та константи додаєте в бічній панелі. 5. Зберігаєте сценарій. Система валідує з'єднання та перевіряє коректність. 6. Тестуєте через «Запуски» — історія запусків, прев'ю чату, підсвітка виконаних блоків. **Єдиний контекст:** Бібліотека процесів і редактор разом — не потрібно перемикатися між розділами. Знайшли бота → відкрили конструктор → редагуєте. --- ## Чому саме візуальний редактор **Альтернатива:** описувати сценарій у вигляді JSON або коду. Це дає гнучкість, але вимагає технічних знань і легко призводить до помилок при зміні структури. **Візуальний підхід:** - Підходить тим, хто не пише код — бізнес-аналітики, контент-менеджери - Структура видна одразу — не потрібно «збирати» логіку з тексту - Помилки легше знайти — порожні виходи, нез'єднані блоки видно на схемі - Команда може спільно працювати — замітки на схемі, історія версій, збереження з коментарем **Обмеження:** для дуже специфічних інтеграцій може знадобитися дію (Action) з кастомною логікою. Але більшість сценаріїв можна побудувати повністю візуально. --- ## Наслідки для користувачів **Для тих, хто створює сценарії:** - Починайте зі стартового блоку — налаштуйте тригери (канали, webhook) - Використовуйте секції для складних сценаріїв — не намагайтеся все вмістити в одній схемі - Використовуйте замітки — вони допомагають команді зрозуміти логіку **Типові помилки:** - **Порожній вихід з блоку** — блок не з'єднаний з наступним, діалог «зависає». Перевіряйте, що кожен блок має хоча б один вихід (крім кінцевих). - **Циклічні залежності** — безкінечний цикл між блоками. Роутер або умова повинні мати вихід для завершення діалогу. - **Забули змінну** — в блоці використовується `{{name}}`, але змінна не створена в панелі. Додайте змінну в бічній панелі. --- ## Пов'язані документи - **Explanation:** [Про те, як влаштована бібліотека процесів](/uk/scenariobuilder/explanation/what-is-process-library.md) - **Explanation:** [Що таке стартова нода](/uk/scenariobuilder/explanation/what-is-start-node.md) - **How-to:** [Як працювати з бібліотекою процесів](/uk/scenariobuilder/how-to/use-process-library.md) - **Learn:** [Процеси та сценарії — Scenario Builder](/uk/learn/scenario-builder/processes-and-scenarios.md) — огляд модуля та відео - **How-to:** [Створити сценарій](/uk/scenariobuilder/how-to/create-scenario.md) - **How-to:** [Редагувати сценарій](/uk/scenariobuilder/how-to/edit-scenario.md) - **How-to:** [Протестувати сценарій](/uk/scenariobuilder/how-to/test-scenario.md) - **Інтегратор:** [Scenario Builder — хаб для інтеграторів](/uk/scenariobuilder/integrator-hub.md)