Explore

No-Code редактор для создания чатботов

Роль в проекте

Помогаю бизнес-аналитику с анализом конкурентов и определением Success Metrics.

Совместно с

Head of design⁠

проектирую весь интерфейс редактора «с нуля».

Организую процесс и делю его на итерации.

Создаю кликабельные прототипы после каждой итерации и презентую команде дизайн-решения.

Контекст

С помощью продукта

Voximplant Avatar⁠

можно создавать «умных» голосовых и чат-ботов. Пишешь любую бизнес-логику и настраиваешь бота под конкретный сценарий использования. Однако это все же продукт для хардкорных разработчиков.

Провели бенчмаркинг конкурентов и сделали вывод, что с помощью ноукод решений они уже смогли расширить охват аудитории за счет нетехнических специалистов — представителей крупного бизнеса.

Ноукод даст возможность самим создавать простых ботов, вносить правки в сложные сценарии, сделанные под заказ, понимать логику работы.

⁠

Бенчмаркинг конкурентов

Начало работы

После установочных встреч сделали два основных вывода:

По техническим причинам отказались от Drag-and-drop и тем самым усложнили себе задачу с самого начала.

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

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

Виды блоков на канвасе

Так как вариантов развития диалога может быть много, то нужно настроить разные реакции бота на любые действия юзера.

⁠

⁠

Панель настроек

Для каждого из блоков проработал панель настроек.

⁠

⁠

Финальная версия

Для удобной навигации сделали сайдбар со вложенностью, чтобы можно было подскролливаться по нажатию к нужному блоку.

⁠

⁠

Перемещение блоков без Drag-and-drop в режиме Linking mode

Отказавшись от Drag-and-drop, нужно было придумать, как копипастить блоки и целые группы. Для этого придумали режим Linking mode, в котором открывается дополнительный функционал.

⁠

⁠

Гипотеза

А что если пользователю потребуется вставлять группы справа или снизу от сценария? Например, он не хочет ни к чему коннектить, просто надо вставить в рандомном месте.

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

Проработав несколько концепций, объяснил людям, которые не мыслят картинками, как это все будет работать, а точнее не работать ))

В итоге сошлись на том, что отказываемся от перемемещения и просто линкуем группы к доступным блокам.

⁠

⁠

Запихнул в них весь наш опыт страданий и при этом на квадратиках показал, что перемещение нам совсем не нужно.

Сетка

Расписал правила, по которым блоки располагаются на канвасе, а при вставке всё аккуратно и ровно встает на новое место.

⁠

⁠

Удаление блоков

Продумали, как ведут себя группы отлинкованных блоков. Решили не оставлять их на канвасе по двум причинам:

В каждом стейте может быть много таких отлинкованных групп. Более удобно было бы собирать все группы в одном пространстве.

Так фронтам не нужно будет рассчитывать их положение на канвасе после удаления.

Придумали «клипборд» с отлинкованными группами. В нем выбираем нужную группу и в режиме Linking mode линкуем к любому доступному блоку на канвасе.

Также на будущее показали пример онбординг-подсказки, появляющийся при первом взаимодействии со сложными механиками.

⁠

Наши иллюстраторы помогли анимировать интерфейс, чтобы презентовать его команде

Какого результата получилось достичь

За 4 месяца удалось попробовать:

Поработать с пользовательским интерфейсом и созданием продукта «с нуля».

Выстроить процесс взаимодействия дизайна и команды: от деления дизайн-задач на итерации до промежуточного ревью фронта.

Много презентовать, предлагать решения, собирать обратную связь от заказчиков.

При этом не давать им расплываться в задаче, вовремя ставя рамки.

Работать в режиме неопределенности.

Какие планы после релиза первой версии

До финала фронтам еще далеко, возникает много вопросов, да и не быстро все идет. Но уже через пару месяцев по готовности MVP-версии начнется настоящая продуктовая работа — исследования, интервью и последующий файнтюнинг.

Success Metrics

1 этап – MVP версия

Касдевы создадут хотя бы 3 ботов с помощью первой версии и дадут положительный фидбэк.

Техпресейлы дадут положительный фидбэк с точки зрения UX.

Внешние юзеры без мотивации смогут создать бота.

Мы выиграем хотя бы 1 лида из сейлзовой воронки, благодаря этой фиче.

2 этап – улушенная версия

50% постоянных пользователей Аватара с ноу-код ботами заходят в них и/или редактируют их с периодичностью 1 раз в месяц.

Более 70% ботов будут создаваться в ноукоде без использования кода.

Еще немного интерфейсных картинок

⁠

⁠

Добавление блока на канвасе

⁠

⁠

Закрытие панели настроек с несохраненными изменениями

⁠

⁠

Меню (иконки в работе у иллюстраторов)

⁠

Следующий кейс

⁠

⁠

Voximplant Platform | Главный дашборд и его адаптивная версия

⁠

Подробнее →⁠

⁠

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.