Сервис Вариокуб

Этот материал посвящён инструменту Вариокуб, благодаря которому можно проводить эксперименты на сайтах разных конфигураций — от одностраничной визитки или лендинга до сайта со сложной структурой. Также с помощью Вариокуба можно проводить эксперименты в мобильных приложениях, настраивать Персонализации на сайте и управлять конфигурацией в приложении.

В этом блоке рассмотрим:

• Что такое Вариокуб
• Как с помощью работы с воронкой продаж можно увеличить эффективность рекламы
• Как работают A/B-тесты и в чём их ценность для бизнеса
• Как с помощью возможностей Вариокуба вносить изменения на сайт или в мобильное приложение
• Как Вариокуб работает с клиентской и серверной стороны

Технология Вариокуба более 15 лет используется почти во всех сервисах Яндекса. Через этот инструмент проходит около 50 000 экспериментов в год. Главное его преимущество — простота использования.

Вариокуб представлен на двух платформах:

• В интерфейсе Яндекс Метрики — чтобы проводить эксперименты и настраивать Персонализации на сайтах любой конфигурации

• В интерфейсе AppMetrica — чтобы проводить эксперименты в мобильных приложениях, а также управлять конфигурацией приложения (например, включать и выключать новую функциональность без обновления

Благодаря сервису Вариокуб на сайте и в приложении можно:

1. Проверять разные гипотезы с помощью А/В-тестирования —от изменения дизайна одного блока до полного изменения структуры. В результате эксперимента доступна статистика по показателям, которые помогают определить, какой вариант сайта или приложения приносит больше целевых действий

1. Настроить Персонализации для сайта или управлять конфигурацией мобильного приложения. Это позволит показывать изменения для всей или выделенной части аудитории — бессрочно или в течение определённого периода. Например, можно показывать особый промокод для пользователей, которые пришли на сайт или в приложение по определённой рекламной кампании. Или настроить отображение тёмной версии интерфейса диджитал-продукта во время Чёрной пятницы для всех пользователей

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

К примеру, пользователь просматривает ленту новостей и попадает на рекламу Чёрной пятницы. Переходит на сайт, выбирает и оплачивает товар и таким образом проходит через воронку продаж.

Рассмотрим на базовом примере, из чего она состоит.

Первый этап воронки — это привлечение аудитории. Сюда входят рекламные размещения, флаеры, переходы по органике и так далее.

Следующий этап — это сайт. Он должен проводить пользователя до конверсионного действия.

И последний этап — совершение пользователем главного целевого действия, например покупки. Для бизнеса это этап продажи.

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

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

В этом случае пользователь переходит по рекламе, получает дополнительную информацию об акции на лендинге. Чтобы совершить покупку, ему нужно перейти с лендинга на основной сайт продукта. То есть воронка продаж удлиняется за счёт лишнего клика для пользователя, из-за чего конверсия может снижаться. Логичным сценарием в этом примере могло быть сокращение пользовательского пути.

Слияние двух этапов воронки без лишних кликов для пользователей можно реализовать с помощью Персонализаций Вариокуба.

Персонализации Вариокуба – это инструмент для работы с сайтами, аналогичный функционал Вариокуба для приложений называется Конфигурация флагов, но в данном материале для упрощения оба инструмента (и для сайтов, и для приложений) будем называть Персонализациями.

Рассмотрим несколько примеров:

• Персонализации на ограниченный срок. Все пользователи, которые посетят сайт или мобильное приложение 31 декабря и 1 января, увидят поздравление «С Новым годом!»
• Персонализации для определённой аудитории. Пользователи, которые перешли на сайт или в мобильное приложение с определённой рекламной кампании, увидят блок с промокодом

Чтобы убедиться, что Персонализация действительно нужна и она повысит эффективность сайта, нужно использовать А/В-тесты в процессах компании. Дальше поговорим о них подробнее.

В этом блоке поговорим о том, что такое А/В-тесты, и рассмотрим, как меняется продукт без использования А/В-тестов и с их помощью.

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

Теперь рассмотрим два процесса изменения продукта в компании: без А/В-тестирования и с его помощью.

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

После реализации гипотез происходит релиз обновлений. И только когда изменения становятся доступны всем пользователям, команда пытается оценить реальный эффект от полученных изменений с помощью косвенных данных: коридорных тестов, вау-эффекта и так далее.

Плюсы подхода:

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

Минусы подхода:

• Высокий риск внедрить некачественную функциональность
• Большое влияние продуктового видения, которое не позволяет объективно оценить эффект от внедрения

Внедрение изменений с помощью А/В-тестирования также состоит из нескольких этапов. Поиск идей и предварительный анализ сходны с предыдущим процессом. Существенное различие заключается в проверке гипотезы.

А/В-тесты — это оптимальный способ проверки гипотезы, когда одной части аудитории показывают вариант с изменениями, а потом результаты сравнивают с контрольной группой, которой был показан исходный вариант диджитал-продукта. С помощью статистических методов проверяется, были ли рост или снижение целевой метрики случайностью либо это результат воздействия изменений.

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

Если изменения показали отрицательный результат (например, пользователи стали совершать меньше целевых действий) или контрольный и изменённый варианты оказались равнозначны, то вариант эксперимента лучше доработать и отложить внедрение для всех пользователей.

Плюсы подхода:

• Уменьшаются риски для бизнеса — не будут внедряться изменения, которые могут негативно сказаться на конверсии
• Решения принимаются на основе статистически значимых данных

Минусы подхода:

• Увеличивается время от того, как изменения написаны, до момента внедрения
• Требуются ресурсы на поддержку системы А/В-тестирования

В Яндексе проводятся десятки тысяч экспериментов в год, чтобы обеспечивать наилучший пользовательский опыт. Любое изменение проходит стадию А/В-тестирования с помощью технологии Вариокуба.

Гипотеза: изменение цвета кнопки «Перейти к оформлению» увеличит конверсию в клик по этой кнопке на 10%.

В исходной версии сайта кнопка «Перейти к оформлению» кажется незаметной.

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

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

Провели эксперимент, и гипотеза подтвердилась: конверсия в следующий шаг выросла на 10%. Таким образом, успешный А/В-тест привёл к изменениям, которые стали доступны для всех пользователей.

Более подробное описание кейса можно прочитать в статье.

Гипотеза: конверсия в раздел с акциями вырастет на 7%, если кнопка будет больше по размеру и будет отличаться по формату от других кнопок. Все кнопки в интерфейсе — в формате «иконка + текст». В разделе «Акции» оставим только текст и увеличим кнопку.

Предположим, что если изменить название раздела на «Все акции» и сделать элемент более заметным (убрать иконку, увеличить размер кнопки), этот раздел должен притягивать большее количество пользователей.

Кажется, эта гипотеза похожа на предыдущую и её сразу можно внедрить для всех пользователей. Но на самом деле она не подтвердилась. Количество кликов по этому разделу снизилось почти на 20%. Пользователи привыкли к тому, как выглядел раздел, а мы изменили привычный для них вид.

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

Напомним, Вариокуб — это решение от Яндекса для проведения A/B-тестов и управления диджитал-продуктом.

В Вариокубе доступно пять способов внесения изменений на сайт:

• Визуальный редактор
• Редирект
• Флаги
• Рекламные блоки
• Виджеты

Вносить изменения любым способом можно и при настройке эксперимента, и при запуске Персонализации на сайте.

В мобильные приложения изменения можно вносить только с помощью флагов.

Рассмотрим подробнее каждый способ внесения изменений на примерах.

С помощью визуального редактора можно вносить незначительные изменения на сайт и проверять их с помощью А/В-тестов или использовать в Персонализациях.

Что можно менять с помощью визуального редактора:

• Заголовки и любые текстовые блоки на сайте
• Цвет текста или элемента, в том числе заливку
• Изображения
• Ссылки
• Кнопки
• CSS и HTML

А также можно проводить эксперименты с JS-скриптами. Эта функция не доступна по умолчанию, для её активации нужно включить параметр enableJS в setConfig.  

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

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

Подходит, когда нужно сравнить несколько уже готовых вариантов одной веб-страницы.

Для этого способа внесения изменений команде продукта нужно самостоятельно создать альтернативную версию страницы сайта, которая будет доступна пользователям по новой ссылке. При проведении эксперимента Вариокуб уведёт пользователей из сегмента А на старую версию страницы, а из сегмента В — на новую.

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

Это можно выяснить с помощью редиректа и принять решение, основанное на данных эксперимента. Более того, можно показать новую версию страницы сайта лишь 10% пользователей, и тогда:

• 5% пользователей увидят старую версию страницы, это контрольная группа
• 5% пользователей увидят изменённую версию
• 90% аудитории не будут участвовать в эксперименте и увидят старую версию страницы, при этом их действия не будут учитываться в статистике эксперимента и влиять на результат

В таком случае, если изменения окажутся неудачными, они не сильно повлияют на показатели продукта.

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

Флаги — самый гибкий, но в то же время самый сложный способ. С помощью него можно изменять не только видимые объекты сайта или приложения (цвет кнопки и прочее), но и логику работы бэкенда. Таким образом, флаги можно применять не только на клиентской стороне, но и в серверной части.

Чтобы реализовать этот способ, разработчик должен написать код под флагом. При проведении эксперимента или при запуске Персонализации команда продукта должна указать пару «ключ — значение» для того, чтобы функциональность применилась.

Например, команда хочет добавить в продукт новое направление или сложные механики бэкенда. В этом случае разработчик реализовывает новую функциональность на серверной части и добавляет нужные флаги. Дальше в настройках А/В-теста команда продукта задаёт правило: если флаг включён, то работает новая механика, если флаг выключен — старая механика.

С помощью этого способа внесения изменений можно тестировать рекламные блоки Рекламной сети Яндекса и Adfox, а именно:

• Сравнивать между собой типы блоков и блоки с разными настройками
• Тестировать изменение размеров и расположения блоков
• Оценивать влияние на доход и пользовательские метрики от добавления нового блока

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

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

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

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

У сайта есть клиентская и серверная сторона.

Клиентская часть выполняется в браузере пользователя. Она отвечает за внешний вид сайта и несложную функциональность. Изменения в ней можно проверять с помощью всех способов внесения изменений Вариокуба:

• Визуального редактора
• Редиректа
• Флагов
• Рекламных блоков
• Виджетов

Чтобы проводить эксперименты или настраивать Персонализации в клиентской части, достаточно добавить шесть строчек кода, так называемые Client SDK. Это часть функциональности, которая реализует обработку флагов и помогает вносить изменения в визуальную составляющую сайта.

Серверная сторона отвечает за проведение оплат, обмен, хранение данных и другие сложные механики. Изменения в ней можно проводить только с помощью типа эксперимента «Флаги».

Чтобы подключить Вариокуб к серверной части, можно использовать API UserSplit. Обрабатывать флаги нужно будет самостоятельно.

• А/В-тестирование — это инструмент, который позволяет компаниям проверять гипотезы и принимать обоснованные решения на основе данных
• А/В-тестирование помогает снизить риски, которые связаны с внедрением новых функций и изменений, обеспечивает более глубокое понимание потребностей и поведения пользователей
• Персонализации или управления конфигурацией приложения делают коммуникацию с пользователем персональной
• С помощью Вариокуба можно анализировать данные и выбирать оптимальные варианты дизайна и функциональности сайта и приложения
• Вариокуб помогает увеличить конверсионность сайта и приложения и сделать продукт более эффективным