Продукт-тур помогает пошагово провести пользователя по интерфейсу и показать, как работает ваш продукт. Он особенно полезен для онбординга: можно рассказать, с чего начать, где найти нужные функции, как выполнить первые шаги.
Тур можно запустить как для новых пользователей, так и для тех, кто возвращается после перерыва или впервые пробует новый функционал.
В этой статье расскажем, как создать продукт-тур в Нотифлоу и настроить его отображение на сайте.
Как создать тур и добавить шаг
Чтобы создать продукт-тур, нажмите в левом верхнем углу экрана кнопку «Создать». В появившемся окне выберите тип виджета — «Продукт-тур», а затем снова нажмите «Создать», чтобы перейти в редактор.
На вкладке «Внешний вид» вы увидите основной домен сайта, привязанный к вашему аккаунту. При необходимости можно задать конкретные страницы, на которых будет запускаться тур. Например, /price, /services или любой другой раздел.
Нажмите «Начать», чтобы перейти к созданию шагов тура.
В новой вкладке браузера откроется ваш сайт с панелью управления виджетами внизу экрана. Нажмите «Создать тур здесь» — «Создать шаг», а затем кликните по нужному элементу интерфейса, чтобы прикрепить к нему первую подсказку.
Система автоматически создаст заготовку шага, которую наполнить контентом и изменить ее внешний вид.
Как добавить контент и настроить внешний вид шага
Контент для шага можно оформить по-разному, все зависит от того, что вы хотите показать пользователю.
Обычный текст можно ввести вручную, кликнув на поле ввода. А если хотите добавить заголовок, список, изображение или видео, воспользуйтесь встроенным меню, которое появляется при вводе символа /.
При необходимости можно выделить текст и изменить его внешний вид на панели редактирования. Здесь доступны базовые стили оформления: жирное и курсивное начертание, преобразование текста в заголовок или список, а также вставка ссылок.
После этого выберите, с какой стороны от элемента будет показываться подсказка. Она может располагаться сверху, снизу, слева или справа. Все зависит от того, как устроен ваш интерфейс и где подсказка будет заметнее.
Аналогичным образом добавьте и настройте остальные шаги тура. Внизу экрана вы будете видеть список всех созданных шагов. Это поможет контролировать структуру и при необходимости быстро перейти к редактированию. Шаги будут отображаться пользователю по очереди, в том порядке, в котором вы их добавили. Переключение между шагами происходит с помощью кнопок внутри подсказок.
Когда все шаги добавлены и оформлены, вернитесь на вкладку с личным кабинетом Нотифлоу, чтобы задать условия показа.
Как задать условия показа тура
По умолчанию продукт-тур будет отображаться на сайте постоянно — с момента публикации и до тех пор, пока вы не отключите его вручную в личном кабинете Нотифлоу.
Но если вы хотите приурочить показ продукт-тура к выходу новой функции, началу акции или обновлению интерфейса, откройте вкладку «Настройки» и укажите дату и время начала/завершения показа. В этом случае тур автоматически появится на сайте в заданный момент и так же автоматически исчезнет после завершения периода показа.
Готово! Теперь опубликуйте продукт-тур, чтобы он стал доступен пользователям на сайте и начал помогать им осваиваться в интерфейсе.
