VK CXhub — платформа автоматизации маркетинга для бизнеса. Включает конструктор чат-ботов, визуальный редактор email-рассылок и лендингов, CRM-модуль, интеграции с внешними сервисами.
Моя роль в продукте
Я пришла в VK CXhub, как продуктовый дизайнер, и занималась разработкой ключевых разделов платформы: авторизации, интеграций, онбординга, системы фильтров базы клиентов, биллинга, конструктора чат-ботов, а также дизайн системой.
Совместно с продуктовым дизайнером была создана новая дизайн-система с нуля и внедрена за 2 месяца в продукт, тем самым увеличена скорость разработки интерфейсов и фронта.
Позже я захотела попробовать себя в роли продакт-менеджера внутреннего продукта. За 4 месяца мы с командой из трёх человек запустили с нуля конструктор мини-лендингов и email-рассылок: от исследования и проектирования до релиза.
Совместно с продуктовым дизайнером была создана новая дизайн-система с нуля и внедрена за 2 месяца в продукт, тем самым увеличена скорость разработки интерфейсов и фронта.
Позже я захотела попробовать себя в роли продакт-менеджера внутреннего продукта. За 4 месяца мы с командой из трёх человек запустили с нуля конструктор мини-лендингов и email-рассылок: от исследования и проектирования до релиза.
Кейсы
Конструктор лендингов и email
Проблема
Используемый в продукте конструктор лендингов уходил с рынка, при этом он не масштабировался под задачи основной платформы. Это создавало риск потери важной для пользователей возможности и зависимость от стороннего решения.
В данной задачи я совмещала две роли: продуктовый дизайнер и менеджер продукта конструктора лендингов.
В данной задачи я совмещала две роли: продуктовый дизайнер и менеджер продукта конструктора лендингов.
Что было сделано
- Собрана команда: фронтенд, фулл-стек, джун-дизайнер и я в роли продакт-менеджера и лида дизайном конструктора.
- Проведён анализ конкурентов и custdev с внутренними командами, работающими с конструкторами.
- Спроектирована дизайн-система для конструктора на базе токенов основной платформы, добавлены уникальные компоненты.
- Разработан интерфейс конструктора лендингов с библиотекой готовых блоков для лендингов и email-рассылок, поддержкой адаптива, превью, вставки переменных.
- Настроен параллельный процесс разработки дизайна и фронтенда для ускорения релиза.
- Задокументированы все технические и дизайн-решения.
Результат
- Запуск тестовой версии через 4 месяца.
- Получен и внедрён фидбек от внутренней команды.
- Конструктор лендингов внедрен в конструктор чат-ботов.
- Выкатка в продакшн → отказ от внешнего конструктора.
- Cнижение зависимости от сторонних сервисов, сохранение функционала для пользователей и возможность масштабирования продукта под новые задачи.
Конструктор форм
Проблема
Для сбора данных в ботах, рассылках и на лендингах требовался встроенный конструктор форм. Использование сторонних решений было рискованным из-за безопасности данных. Важно было обеспечить бесшовную работу с другими конструкторами внутри продукта.
Что было сделано
- Проведен сбор функциональных требований к MVP, определены основные типы полей и их сценарии использования.
- Разработан интерфейс конструктора форм с учётом UX-паттернов платформы.
- Настроена интеграция с конструкторами ботов, лендингов и email-рассылок для единого пользовательского опыта.
- Проведено тестирование на коллегах, внесены правки по результатам обратной связи.
Результат
- Запуск встроенного конструктора форм в прод.
- Снижение зависимости от внешних сервисов.
- Автоматизация сбора данных и ускорение процесса настройки форм внутри продукта.
Основные разделы VK CXhub
- Продуктовый дизайн основных разделов: интеграции, сложные фильтры для сегментации базы клиентов, профиль клиента, конструктор чат-ботов, биллинг, онбординг.
- Проектирование UX: исследование, концепт, защита перед командой.
- Плотное взаимодействие с продактом, разработкой, аналитикой и поддержкой сервиса.
- Подробная документация по разработанным сценариям пользователя и UI-решениям.
Дизайн-система с нуля
Проблема
В продукте на стадии MVP использовались две дизайн системы: VK и Tarantool, но они не покрывали UI, необходимый для конструктора чат-бота и B2B-сервиса. В связи с чем было принято решение делать свою дизайн систему с нуля.
Что было сделано
- Разработаны токены, на основе, которых создавались компоненты
- Разработана единая библиотека иконок.
- Спланирован процесс разработки компонентов от простых к составным.
- Распределены компоненты между дизайнерами.
- Запущен параллельный процессу между отделом дизайна и фронтэнда и синки два раза в неделю для ускорения работы.
- Проведена большая переработка коммуникаций с фронтами.
- Сформированы гайды оформления компонентов: компонент, документация, примеры из в интерфейса.
- Запущено постепенное обновление интерфейса с переходом на новую дизайн-систему.
Результат
- Разработана библиотека из компонентов, покрывающих 90% UI сервиса. Первая версия дизайн-системы внедрена за 2 месяца к Beta-релизу.
- Полностью обновлен интерфейс продукта за 6 месяцев.
- Скорость разработки фронта и дизайна увеличилась в 3 раза.
- Коммуникации между дизайном и фронтом наладились.
