Funlee — конструктор видеосайтов
Про продукт
Funlee — это маркетинговый инструмент для создания интерактивных видеосайтов и виджетов.
Инструмент помогает автоматизировать сбор отзывов, привлекать лиды и улучшать пользовательский опыт через персонализированные видео. Funlee используют малый и средний бизнес, маркетологи и агентства, которые стремятся повысить вовлеченность и эффективность взаимодействия с аудиторией.
Про продукт
Funlee — это маркетинговый инструмент для создания интерактивных видеосайтов и виджетов.
Инструмент помогает автоматизировать сбор отзывов, привлекать лиды и улучшать пользовательский опыт через персонализированные видео. Funlee используют малый и средний бизнес, маркетологи и агентства, которые стремятся повысить вовлеченность и эффективность взаимодействия с аудиторией.
Контекст
В 2023 году уже был рабочий MVP, однако после тестирования на реальных пользователях и исследований, фаундеры пришли к выводу, что продукт требует глобальной переработки для выхода на международный рынок.
Причины
Результаты исследований показали, что пользователи не удовлетворены некоторыми аспектами продукта.
Анализ конкурентов показал, что зарубежный рынок требует более совершенных и функциональных решений.
Цели
Улучшить пользовательский опыт и удовлетворить потребности клиентов.
Сделать продукт более конкурентоспособным и привлекательным для пользователей.
Дизайн команда
Я лидировал команду дизайна. Помимо меня над продуктом работали ещё 3 дизайнера, все присоединились практически в одно время.
Продуктовые задачи
Разработка новой концепции продукта на основе анализа обратной связи от пользователей
Функциональная карта приложения
Формирование и приоритизация бэклога
Конкурентные исследования и бенчмаркинг фичей
Проектирование сценариев и общего флоу пользователя
Участие в разработке новых концептуальных дизайн-решений
Создание гайдлайнов и документации по продукту
Прототипирование и анимации
Исследования и тестирования
Как замеряем успех?
Pre-seed: стадия концепта
Customer Interest: за успех считаем от 8 до 10% заявок на бета-тестирование из общего числа посетителей
PMF Hypothesis: более 40% участников тестирования согласны, что продукт решает для них значимую проблему
NPS: от бета-пользователей на уровне 10-20
Activation Rate (Коэффициент активации): за успех принимаем 20%
Month-1 Retention (месячное удержание): за успех принимаем 10-15%
Churn Rate (месячный отток): 10-15% считаем допустимым
Seed / Series A: начало роста
Cohort Retention (Когортный анализ удержания): показатель успеха – 20% пользователей конкретной когорты остаются активными через 6 месяцев
Engagement (Вовлеченность): за успех считаем среднее количество сеансов на пользователя (Number of sessions per user) – 3-5 в неделю; среднее время на платформе – 5-10 минут за сеанс; 30% пользователей регулярно выполняют целевые действия (опубликовать воронку, поделиться воронкой, посмотреть аналитику)
Cost per Acquisition (CPA): допустимой считаем $10-$15
Pre-seed: стадия концепта
Customer Interest: за успех считаем от 8 до 10% заявок на бета-тестирование из общего числа посетителей
PMF Hypothesis: более 40% участников тестирования согласны, что продукт решает для них значимую проблему
NPS: от бета-пользователей на уровне 10-20
Activation Rate (Коэффициент активации): за успех принимаем 20%
Month-1 Retention (месячное удержание): за успех принимаем 10-15%
Churn Rate (месячный отток): 10-15% считаем допустимым
Seed / Series A: начало роста
Cohort Retention (Когортный анализ удержания): показатель успеха – 20% пользователей конкретной когорты остаются активными через 6 месяцев
Engagement (Вовлеченность): за успех считаем среднее количество сеансов на пользователя (Number of sessions per user) – 3-5 в неделю; среднее время на платформе – 5-10 минут за сеанс; 30% пользователей регулярно выполняют целевые действия (опубликовать воронку, поделиться воронкой, посмотреть аналитику)
Cost per Acquisition (CPA): допустимой считаем $10-$15
Pre-seed: стадия концепта
Customer Interest: за успех считаем от 8 до 10% заявок на бета-тестирование из общего числа посетителей
PMF Hypothesis: более 40% участников тестирования согласны, что продукт решает для них значимую проблему
NPS: от бета-пользователей на уровне 10-20
Activation Rate (Коэффициент активации): за успех принимаем 20%
Month-1 Retention (месячное удержание): за успех принимаем 10-15%
Churn Rate (месячный отток): 10-15% считаем допустимым
Seed / Series A: начало роста
Cohort Retention (Когортный анализ удержания): показатель успеха – 20% пользователей конкретной когорты остаются активными через 6 месяцев
Engagement (Вовлеченность): за успех считаем среднее количество сеансов на пользователя (Number of sessions per user) – 3-5 в неделю; среднее время на платформе – 5-10 минут за сеанс; 30% пользователей регулярно выполняют целевые действия (опубликовать воронку, поделиться воронкой, посмотреть аналитику)
Cost per Acquisition (CPA): допустимой считаем $10-$15
Исследования, userflow, формирование бэклога и его приоритизация
На старте продуктовая команда:
Формировала и описывала будущую структуру приложения и брейнштормила возможные будущие фичи продукта на основании данных, полученных на стадии MVP
Закладывала основы бэклога для будущего теста гипотез
Формировала и развивала дизайн-процесс в продукте
Job Stories – Main Scenario
Job Stories – Main Scenario
Нет вайрфреймам
При работе над проектом команда дизайнеров столкнулась с важной особенностью: стейкхолдерам было сложно визуализировать конечный результат, опираясь только на low-fi вайрфреймы. Поэтому процесс утверждения требовал от нас создания вайрфреймов, которые были максимально близки к финальному дизайну.
Согласование стейкхолдеров: hi-fi вайрфреймы позволяют стейкхолдерам быстрее принимать решения и вносить правки на ранних этапах, упрощая процесс утверждения и снижая вероятность серьезных изменений на финальной стадии.
Лучшее планирование ресурсов: hi-fi вайрфреймы помогают команде разработки оценить трудоемкость различных элементов дизайна и функциональности, что позволяет точнее планировать сроки и распределять ресурсы.
Снижение числа итераций: чем более проработан вайрфрейм, тем меньше сюрпризов на этапе визуального дизайна и разработки, что снижает необходимость в повторных итерациях и уменьшает затраты времени и средств.
Раннее тестирование с пользователями: детализированные вайрфреймы можно использовать для раннего тестирования и сбора обратной связи, что помогает выявить и устранить проблемы до начала полноценной разработки.
Затраты времени и ресурсов: создание детализированных вайрфреймов требует больше времени и усилий от дизайнеров.
Смешивание этапов: Создание проработанных вайрфреймов может размыть границы между этапами проектирования, делая процесс утверждения вайрфреймов и окончательного дизайна слишком схожими. Это может запутать участников проекта и привести к недоразумениям о том, на каком этапе находится работа.
Меньший акцент на функциональность: В попытке сделать вайрфреймы визуально привлекательными и близкими к дизайну, можно отвлечь внимание от функциональности и структуры.
Согласование стейкхолдеров: hi-fi вайрфреймы позволяют стейкхолдерам быстрее принимать решения и вносить правки на ранних этапах, упрощая процесс утверждения и снижая вероятность серьезных изменений на финальной стадии.
Лучшее планирование ресурсов: hi-fi вайрфреймы помогают команде разработки оценить трудоемкость различных элементов дизайна и функциональности, что позволяет точнее планировать сроки и распределять ресурсы.
Снижение числа итераций: чем более проработан вайрфрейм, тем меньше сюрпризов на этапе визуального дизайна и разработки, что снижает необходимость в повторных итерациях и уменьшает затраты времени и средств.
Раннее тестирование с пользователями: детализированные вайрфреймы можно использовать для раннего тестирования и сбора обратной связи, что помогает выявить и устранить проблемы до начала полноценной разработки.
Затраты времени и ресурсов: создание детализированных вайрфреймов требует больше времени и усилий от дизайнеров.
Смешивание этапов: Создание проработанных вайрфреймов может размыть границы между этапами проектирования, делая процесс утверждения вайрфреймов и окончательного дизайна слишком схожими. Это может запутать участников проекта и привести к недоразумениям о том, на каком этапе находится работа.
Меньший акцент на функциональность: В попытке сделать вайрфреймы визуально привлекательными и близкими к дизайну, можно отвлечь внимание от функциональности и структуры.
Согласование стейкхолдеров: hi-fi вайрфреймы позволяют стейкхолдерам быстрее принимать решения и вносить правки на ранних этапах, упрощая процесс утверждения и снижая вероятность серьезных изменений на финальной стадии.
Лучшее планирование ресурсов: hi-fi вайрфреймы помогают команде разработки оценить трудоемкость различных элементов дизайна и функциональности, что позволяет точнее планировать сроки и распределять ресурсы.
Снижение числа итераций: чем более проработан вайрфрейм, тем меньше сюрпризов на этапе визуального дизайна и разработки, что снижает необходимость в повторных итерациях и уменьшает затраты времени и средств.
Раннее тестирование с пользователями: детализированные вайрфреймы можно использовать для раннего тестирования и сбора обратной связи, что помогает выявить и устранить проблемы до начала полноценной разработки.
Затраты времени и ресурсов: создание детализированных вайрфреймов требует больше времени и усилий от дизайнеров.
Смешивание этапов: Создание проработанных вайрфреймов может размыть границы между этапами проектирования, делая процесс утверждения вайрфреймов и окончательного дизайна слишком схожими. Это может запутать участников проекта и привести к недоразумениям о том, на каком этапе находится работа.
Меньший акцент на функциональность: В попытке сделать вайрфреймы визуально привлекательными и близкими к дизайну, можно отвлечь внимание от функциональности и структуры.
Ядро продукта
Ядром Funlee является система интерактивных модулей для взаимодействия с видео. Видео служит основным средством коммуникации, а модули — инструментами, которые позволяют пользователям активно взаимодействовать с контентом.
Для альфа-релиза было разработано 11 интерактивных механик для видео + отдельный блок финальной страницы воронки.
Модерируемое тестирование
Юзабилити-тестирование было направлено на выявление проблемных мест как в процессе использования самого конструктора для создания интерактивных видео, так и в восприятии готовых продуктов посетителями. Основная цель — понять, насколько интуитивно понятен интерфейс конструктора и насколько удобны созданные с его помощью интерактивные видео.
Что и как тестировали
Участники тестирования создавали интерактивное видео с нуля, следуя заранее подготовленным задачам. В ходе этого наблюдалось, как они ориентируются в интерфейсе, взаимодействуют с инструментами, добавляют интерактивные элементы и настраивают их.
Метрики: успешность выполнения задания, частота совершения ошибок, удовлетворенность.
Тестировалось взаимодействие пользователей с готовыми интерактивными видео, чтобы оценить восприятие и удобство прохождения. Участники проверяли сценарии взаимодействий, пробовали кликать на интерактивные элементы, отвечали на вопросы и переходили по ссылкам.
Метрики: успешность выполнения задачи, удовлетворенность.
Участники тестирования создавали интерактивное видео с нуля, следуя заранее подготовленным задачам. В ходе этого наблюдалось, как они ориентируются в интерфейсе, взаимодействуют с инструментами, добавляют интерактивные элементы и настраивают их.
Метрики: успешность выполнения задания, частота совершения ошибок, удовлетворенность.
Тестировалось взаимодействие пользователей с готовыми интерактивными видео, чтобы оценить восприятие и удобство прохождения. Участники проверяли сценарии взаимодействий, пробовали кликать на интерактивные элементы, отвечали на вопросы и переходили по ссылкам.
Метрики: успешность выполнения задачи, удовлетворенность.
Участники тестирования создавали интерактивное видео с нуля, следуя заранее подготовленным задачам. В ходе этого наблюдалось, как они ориентируются в интерфейсе, взаимодействуют с инструментами, добавляют интерактивные элементы и настраивают их.
Метрики: успешность выполнения задания, частота совершения ошибок, удовлетворенность.
Тестировалось взаимодействие пользователей с готовыми интерактивными видео, чтобы оценить восприятие и удобство прохождения. Участники проверяли сценарии взаимодействий, пробовали кликать на интерактивные элементы, отвечали на вопросы и переходили по ссылкам.
Метрики: успешность выполнения задачи, удовлетворенность.
Прототип шага Feedback
Здесь я предлагаю отдохнуть от текста и посмотреть как работает шаг Feedback для сбора обратной связи от посетителей воронки. Дальше продолжим по тестированию.
Сбор и анализ данных
Фиксировали поведение участников, отмечали, какие действия вызывают затруднения, какие функции требуют объяснения и какие элементы конструкции не используются или используются не по назначению.
Провели интервью после тестирования, чтобы получить дополнительные комментарии и впечатления участников.
Пул задач после тестирования
Добавить на пустой экран проектов карусель из видео-туториалов
При создании нового проекта добавить выбор: использовать шаблон или создать воронку «с чистого листа»
Доработать панель инструментов на воркспейсе, поменять иконку добавления шага на более понятную кнопку
Добавить подсказки и инструкции в раздел настроек видео
Доработать дизайн-мод в части поведения токенов в кастомных темах (автоматическая адаптация secondary цветов, фонов инпутов и т.п. в зависимости от фонового и акцентного цветов, которые выбирает пользователь)
Доработать раздел Share в части вариативности embed code
Разделить метрики конкретного шага и всего проекта
Переработать дашборд в партнерке, упростить функционал для альфа релиза
Разработать техническое решения для борьбы с ботами, которые пагубно влияют на аналитику
Добавить в видеоплеер элемент, в котором владелец может указать обязательную информацию, например, сведения о лицензии и т.п.
Приоритизация бэклога, контрольные тестирования
Составили список задач и багов, раскидали их по релизам. Сделали удобную табличку для нас и фаундеров, чтобы держать руку на пульсе. Разработчикам завели задачи в таск-трекер, указали приоритет, исполнителя, релиз, добавили ссылки на макеты, документации и т.д.
P.S. Фаундеры не пользовались таск-трекером, поэтому иногда приходилось делать дополнительные таблички в фигме)
Доработки и контрольное тестирование
Обновили интерфейс и функционал конструктора на основе результатов тестирования — улучшили навигацию, добавили подсказки и оптимизировали взаимодействие с основными функциями.
После внесения изменений провели контрольное тестирование с несколькими респондентами из той же группы + включили новых преспондентов, чтобы проверить, устранены ли выявленные проблемы и не появились ли новые.
Дизайн-система
Как мы строили дизайн-систему и кросс-функциональные библиотеки можно почитать отдельно. Там много интересного.
Финальный дизайн
Наконец-то мы это сделали!
Мои воронки
Это главный экран в личном кабинете. Здесь мы можем провалится в редактирование уже созданной воронки, создать новую воронку, совершить любое действие с воронкой. Мы видим какие воронки опубликованы, сколько просмотров у каждой воронки.
Когда воронок ещё нет, мы выводим релевантные видео туториалы.
Workspace
Основной сложностью было сделать удобный конструктор воронок. Здесь пользователь создаёт необходимое количество шагов, настраивает переходы по ним, загружает видео, наполняет воронку контентом и так далее.
Design mode
Я полностью отвечал за вертикаль конструктора дизайна. Здесь пользователь настраивает дизайн вручную, либо просто выбирает готовый шаблон. Также есть функция сохранения дизайн темы для использования в других проектах.
Идея была в том, чтобы создать одновременно простой в использовании функционал, но с большой степенью кастомизации, относительно конкурентов. Более того, мы сделали так, чтобы контент всегда было видно, в независимости от пользовательских настроек дизайна. Накосячить не получится, как ни старайся.
Медиатека
Это хранилище файлов. Здесь можно поменеджерить свои видеофайлы, которые используются или не используются в воронках. Также есть вкладка со входящими от посетителей файлами. Можно посмотреть видео отзывы, послушать аудио отзывы от клиентов.
Аналитика
В разделе аналитика можно посмотреть общую информацию о переходах, лидах, взаимодействиях, конверсии. Есть drop-off анализ видео, среднее время просмотра и прочие данные.
Также можно посмотреть путь каждого посетителя воронки. Сколько раз они нажимали ту или иную кнопку, сколько совершалось тех или иных действий, сколько пользователей отвалились на том или ином шаге.
Есть встроенная CRM-система для управления лидами. Более продвинутые пользователи могут подключить интеграции с другими CRM-системами.
Партнёрская программа
Вертикаль партнёрки тоже была на мне. Проработаны механики начисления вознаграждения, вывода средств, система рангов, аналитика по рефералам и т.д.
Сайт
Разработали дизайн сайта Funlee, проработали вход и регистрацию, экраны оплаты и дополнительные разделы. Сайт заслуживает отдельного кейса.
Что было сделано
Спроектирован личный кабинет клиента, конструктор воронок, дизайн-мод
Спроектирована партнерская программа
Разработаны три кросс-функциональные библиотеки компонентов и дизайн-система на токенах
Разработан дизайн многостраничного сайта, отдельные лендинги для рекламы по сегментам
Спроектирован Help Center для пользователей, написаны тексты для интерфейсов и справок на двух языках
Разработан логотип Funlee, придумано название сервиса, отрисованы графические материалы для рекламы, соцсетей и блогов
Проведено большое количество ризайн-ревью и тестирований сервиса
Спроектирован внутренний дашборд для отслеживания метрик и поведения пользователей
Разработана карта триггерной e-mail рассылки, подготовлены письма для рассылки
Спроектированы роадмапы, карты функционала, сценарии, карта релизов продукта и т.д.
Итоги
Достигли хороших показателей по метрикам
Я получил опыт работы в стартапе в качестве лида
Метрики
Pre-seed
Заявки на бета-тестирование – 31%
Участники тестирования согласны, что продукт решает для них значимую проблему – 46%
NPS от бета-пользователей – 26
Seed
Activation Rate (Коэффициент активации) – 69%
Month-1 Retention (месячное удержание) – 33%
Churn Rate (месячный отток) – 18%
Seed / Series A
Не дошли до этого этапа