Поток — Примеры

Пример 1 — Считаем три пути, а не один

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

Счастливый путь (нарисован)
  поиск -> товар -> корзина -> оплата                         4 шага

Возвращающийся покупатель, повторяет обычный товар
  вход -> поиск -> товар -> корзина -> оплата                 5 шагов

Нужна квитанция за прошлый год по ходу оплаты, для отчёта
  выйти из оплаты -> аккаунт -> заказы -> открыть заказ ->
  скопировать номер -> снова поиск -> товар -> корзина -> оплата  9 шагов

Решение

Счастливый путь       4 шага    (поиск -> товар -> корзина -> оплата)
Возвращающийся        3 шага    (повторный заказ -> адрес -> оплата)
Нужна квитанция       4 шага    (оплата -> квитанция на подтверждении)

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

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

Пример 2 — «Назад», который является шагом, и повтор, который себя объясняет

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

Наблюдение
  назад с шага 2 выводит на маркетинговую страницу, все поля потеряны
  перезагрузка или вторая вкладка возвращает пользователя на шаг 1
  шаг 3 повторяет ввод кода после двухминутного ожидания, без
  объяснения причины и без того, сколько потоку осталось

Решение

Назад    текущий шаг и каждое введённое значение сохраняются в URL и
         на сервере, поэтому назад — это предыдущий шаг с его
         значениями; перезагрузка или вторая вкладка возобновляют тот же шаг

Повтор   "Код истёк через 2 минуты. Мы отправили новый на
         •••• 4471. После этого осталось два шага."

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