Навигация онбординга

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

Настройка навигации

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

Для квизов только квизы с одним вариантом ответа подходят для навигации. Квизы с несколькими вариантами ответа можно использовать для настройки условной видимости элементов.

Статическая навигация

Статическая навигация направляет пользователей на один и тот же целевой экран. Чтобы её настроить:

  1. Добавьте кнопку или квиз с одним вариантом ответа.
  2. Выберите кнопку или квиз и перейдите на вкладку Element справа.
  3. Настройте раздел On Press для кнопки или Behaviour для квиза:
  • Action on (только для квиза): выберите Option, чтобы открыть настройки навигации для квиза.
  • Action: выберите Navigate.
  • Data: выберите Static, чтобы направлять пользователей на один и тот же целевой экран.
  • Destination: выберите целевой экран.

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

static-navigation.png

Динамическая навигация

Динамическая навигация направляет пользователей в зависимости от их ответов в квизе:

  • Ответы квиза на предыдущих экранах: навигацию могут запускать как кнопки, так и квизы с одним вариантом ответа.
  • Ответы квиза на текущем экране: навигацию могут запускать только квизы с одним вариантом ответа.

Чтобы её настроить:

  1. Добавьте кнопку или квиз с одним вариантом ответа, который будет осуществлять навигацию.
  2. Выберите кнопку или квиз и перейдите на вкладку Element справа.
  3. Настройте раздел On Press для кнопки или Behaviour для квиза:
  • Action on (только для квиза): выберите Option, чтобы открыть настройки навигации для квиза.
  • Action: выберите Navigate.
  • Data: выберите Dynamic, чтобы направлять пользователей на основе их предыдущих ответов в квизе.
  • State: выберите квиз, ответы которого определяют пункт назначения пользователя.
  1. Выберите целевой экран для каждого варианта ответа квиза.

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

dynamic-navigation.png

Закрытие онбординга

Если пользовательский путь предполагает закрытие онбординга, вы можете настроить это с помощью кнопок или квизов с одним вариантом ответа:

  1. Добавьте кнопку или квиз с одним вариантом ответа.
  2. Выберите кнопку или квиз и перейдите на вкладку Element справа.
  3. Настройте раздел On Press для кнопки или Behaviour для квиза:
  • Action on (только для квиза): выберите Option, чтобы открыть настройки навигации для квиза.
  • Action: выберите Close onboarding.

Узнайте, как обрабатывать закрытие онбординга на iOS, Android, React Native и Flutter.

close-onboarding.png