Привет. Меня зовут Белла Гурина, я работаю в команде Яндекс.Заправок. На днях мы обновили наше приложение, чтобы упростить оплату топлива для водителей. Процесс и раньше не был сложным и особо не отличался от оплаты в других приложениях Яндекса. Но некоторые водители всё равно в нём путались. Мы провели исследование и эксперименты, чтобы выяснить причины. В итоге поняли, как сделать удобнее.
![](https://habrastorage.org/r/w780q1/webt/ba/ds/fz/badsfzn-sin1-xm_0emexkglbdw.jpeg)
Немного о нас, чтобы вы понимали, с чем имеете дело. Яндекс.Заправки — это относительно молодой сервис, мы запустили его в конце 2018 года. Тогда подобных сервисов мы не встречали, поэтому во многом приходилось набивать шишки.
Два года всё бурно росло. Мы подключали топливные сети, заходили в новые регионы и добавляли услуги. В итоге сейчас в сервисе более 7000 АЗС, расположенных по всей России. Но во время интенсивной работы над развитием Заправок стали замечать, что часть водителей срезается перед оплатой, когда номер колонки и тип топлива уже введены. Это показалось странным, и мы начали разбираться. Итогом стало обновление интерфейса приложения.
Раньше в Яндекс.Заправках всю информацию — колонку, топливо, способ оплаты — указывали в карточке АЗС на двух экранах. Это похоже на то, что происходит в реальности на кассе. Водители говорят кассиру сразу всё одной короткой фразой: «Вторая колонка. 95-й. 30 литров. Оплата картой». Никто не ждёт уточняющих вопросов или подтверждений на каждом шаге. Поэтому во время запуска сервиса казалось логичным уместить все опции заказа компактно.
![](https://habrastorage.org/r/w1560/webt/ty/ho/og/tyhoogc3x50pcygbd3a8eebu2_8.png)
Но, как показала практика, некоторые водители, впервые попавшие на экраны оплаты, не понимали, как им быть. И в итоге оказывались перед выбором. С одной стороны, незнакомый интерфейс с несколькими кнопками, в каждую из которых надо «провалиться», а затем вернуться на шаг назад. С другой — возможность оплатить по старинке, не задумываясь ни о чём. Добавьте к этому очередь из других водителей, которые в любой момент могут посигналить в спину, если замешкаешься. Логично, что кто-то сдавался и шёл в кассу. Так дольше, зато привычнее.
Это подтверждали и отзывы, и воронка продаж. Сервис был интересен многим, но не все доходили до завершения оплаты. Указывали часть данных и закрывали приложение. Им нужен был новый, более простой путь.
И мы придумали такой принцип: одно действие — один экран. Водителю больше не нужно указывать все параметры заказа на одном экране. Не нужно возвращаться назад. Он делает всё поэтапно, переходя из карточки в карточку: выбирает колонку, у которой встал, затем указывает нужный тип топлива, объём и далее — способ оплаты. Это позволяет легко пройти все шаги, на каждом убеждаясь, что данные введены верно. В итоге проще завершить оплату. И если подумать, то ведь и в реальности всё происходит поэтапно. Водитель сначала решает, к какой колонке подъехать. Затем выбирает пистолет с нужной маркой бензина. Затем оплачивает.
![](https://habrastorage.org/r/w1560/webt/tt/eb/lh/tteblh8jay5mjxeof3pihewye-a.png)
Помимо того, что мы поместили по одному действию на экран, в процессе оплаты появилась и совершенно новая возможность — выбирать заправку до полного бака.
В комментариях в App Store и Google Play пользователи давно просили волшебную кнопку, которая позволит делать это в один клик. И мы её добавили, только это не совсем кнопка. Теперь в приложении Яндекс.Заправки на экране с выбором объёма топлива есть ползунок — подобие автомобильного бака.
![](https://habrastorage.org/r/w1560/webt/6f/el/w2/6felw2vrce9msoxerakpvdh7uqu.png)
Одним движением его можно выкрутить до полного бака — никаких лишних кликов, всё наглядно.
По умолчанию объём полного бака — 60 литров, как у большинства легковых автомобилей, поэтому многим водителям не придётся ничего менять. Но если бак нестандартный, то можно указать в настройках любой другой объём, и приложение его запомнит.
Кроме понятной визуализации при заправке до полного бака так же важно быстро возвращать сдачу. Вполне вероятно, что водитель закажет больше, чем нужно, ведь бак никогда не бывает абсолютно пустым.
Поэтому мы замораживаем сумму на банковской карте водителя, пока АЗС не сообщит точный объём залитого топлива. Дальше снимаем итоговую сумму, а первичную — размораживаем. В большинстве случаев деньги возвращаются значительно быстрее, чем если их списывать, а затем отменять операцию.
Мы начали раскатывать обновление приложения в конце января. Меньше чем за месяц около 22 тысяч пользователей хотя бы раз настроили объём бака и заправились до полного. Сейчас в среднем это делает тысяча водителей в день.
Ещё одно улучшение не связано с оплатой напрямую. Но оно тоже об удобстве, а ещё об экономии. Мы заметили, что обычно водители не ездят заправляться целенаправленно. Они встраивают это в повседневные занятия — например, заезжают на АЗС по пути на работу.
Поэтому в обновлённом приложении при построении маршрута высвечиваются все заправки по правой стороне дороги и отмечается та, где на нужное топливо самая низкая цена. А на остальных показывается, насколько там отличается стоимость. В итоге водитель может выбрать подходящую станцию и добавить в свой маршрут.
![](https://habrastorage.org/r/w1560/webt/bf/eg/j4/bfegj4dhs2ac-uvqtqkdqvzmrkm.png)
Мы убедились, что принцип «одно действие — один экран» проще воспринимается, и пользователям стало удобнее. Это видно и по метрикам: конверсия в заказы выросла на 17 %. А количество водителей, которые приходят в сервис заправиться повторно, увеличилось почти на 20 %. Но это ещё не всё.
После того как выкатили обновление, мы попросили водителей, которые им уже воспользовались, поставить оценки. В опросе участвовало 30 тысяч человек. Сначала пользователи iOS — их оценки были положительными, большинство поставили нам 5. Потом пришло время пользователей Android. Около 70 % из них поставили 4 и 5, но некоторые поставили 1.
Последних мы решили опросить более подробно. Оказалось, что им неудобно при помощи ползунка выбирать точный объём или сумму — иногда палец соскальзывает и получается не тот результат, какой хотелось. Поэтому мы почти сразу ещё раз обновили экран.
![](https://habrastorage.org/r/w1560/webt/tz/ph/nd/tzphndnxagzxruit0wc_sejhlhm.png)
Теперь под суммой можно нажать «Править» и указать точное число, а количество литров отрегулировать при помощи «+» и «–».
Это обновление показало, что реальный опыт пользователей далеко не всегда совпадает с тем, как мы это себе представляем. Будем рады и другим вашим отзывам!
P. S. Скоро всё это появится не только в приложении Яндекс.Заправки, но и везде, где работает сервис, — в Навигаторе и Яндекс.Картах.
![](https://habrastorage.org/webt/ba/ds/fz/badsfzn-sin1-xm_0emexkglbdw.jpeg)
Немного о нас, чтобы вы понимали, с чем имеете дело. Яндекс.Заправки — это относительно молодой сервис, мы запустили его в конце 2018 года. Тогда подобных сервисов мы не встречали, поэтому во многом приходилось набивать шишки.
Два года всё бурно росло. Мы подключали топливные сети, заходили в новые регионы и добавляли услуги. В итоге сейчас в сервисе более 7000 АЗС, расположенных по всей России. Но во время интенсивной работы над развитием Заправок стали замечать, что часть водителей срезается перед оплатой, когда номер колонки и тип топлива уже введены. Это показалось странным, и мы начали разбираться. Итогом стало обновление интерфейса приложения.
Новый путь пользователя при оплате топлива
Раньше в Яндекс.Заправках всю информацию — колонку, топливо, способ оплаты — указывали в карточке АЗС на двух экранах. Это похоже на то, что происходит в реальности на кассе. Водители говорят кассиру сразу всё одной короткой фразой: «Вторая колонка. 95-й. 30 литров. Оплата картой». Никто не ждёт уточняющих вопросов или подтверждений на каждом шаге. Поэтому во время запуска сервиса казалось логичным уместить все опции заказа компактно.
![](https://habrastorage.org/webt/ty/ho/og/tyhoogc3x50pcygbd3a8eebu2_8.png)
Но, как показала практика, некоторые водители, впервые попавшие на экраны оплаты, не понимали, как им быть. И в итоге оказывались перед выбором. С одной стороны, незнакомый интерфейс с несколькими кнопками, в каждую из которых надо «провалиться», а затем вернуться на шаг назад. С другой — возможность оплатить по старинке, не задумываясь ни о чём. Добавьте к этому очередь из других водителей, которые в любой момент могут посигналить в спину, если замешкаешься. Логично, что кто-то сдавался и шёл в кассу. Так дольше, зато привычнее.
Это подтверждали и отзывы, и воронка продаж. Сервис был интересен многим, но не все доходили до завершения оплаты. Указывали часть данных и закрывали приложение. Им нужен был новый, более простой путь.
И мы придумали такой принцип: одно действие — один экран. Водителю больше не нужно указывать все параметры заказа на одном экране. Не нужно возвращаться назад. Он делает всё поэтапно, переходя из карточки в карточку: выбирает колонку, у которой встал, затем указывает нужный тип топлива, объём и далее — способ оплаты. Это позволяет легко пройти все шаги, на каждом убеждаясь, что данные введены верно. В итоге проще завершить оплату. И если подумать, то ведь и в реальности всё происходит поэтапно. Водитель сначала решает, к какой колонке подъехать. Затем выбирает пистолет с нужной маркой бензина. Затем оплачивает.
![](https://habrastorage.org/webt/tt/eb/lh/tteblh8jay5mjxeof3pihewye-a.png)
Заправка до полного бака
Помимо того, что мы поместили по одному действию на экран, в процессе оплаты появилась и совершенно новая возможность — выбирать заправку до полного бака.
В комментариях в App Store и Google Play пользователи давно просили волшебную кнопку, которая позволит делать это в один клик. И мы её добавили, только это не совсем кнопка. Теперь в приложении Яндекс.Заправки на экране с выбором объёма топлива есть ползунок — подобие автомобильного бака.
![](https://habrastorage.org/webt/6f/el/w2/6felw2vrce9msoxerakpvdh7uqu.png)
Одним движением его можно выкрутить до полного бака — никаких лишних кликов, всё наглядно.
По умолчанию объём полного бака — 60 литров, как у большинства легковых автомобилей, поэтому многим водителям не придётся ничего менять. Но если бак нестандартный, то можно указать в настройках любой другой объём, и приложение его запомнит.
Кроме понятной визуализации при заправке до полного бака так же важно быстро возвращать сдачу. Вполне вероятно, что водитель закажет больше, чем нужно, ведь бак никогда не бывает абсолютно пустым.
Поэтому мы замораживаем сумму на банковской карте водителя, пока АЗС не сообщит точный объём залитого топлива. Дальше снимаем итоговую сумму, а первичную — размораживаем. В большинстве случаев деньги возвращаются значительно быстрее, чем если их списывать, а затем отменять операцию.
Мы начали раскатывать обновление приложения в конце января. Меньше чем за месяц около 22 тысяч пользователей хотя бы раз настроили объём бака и заправились до полного. Сейчас в среднем это делает тысяча водителей в день.
Сравнение цен на АЗС по маршруту
Ещё одно улучшение не связано с оплатой напрямую. Но оно тоже об удобстве, а ещё об экономии. Мы заметили, что обычно водители не ездят заправляться целенаправленно. Они встраивают это в повседневные занятия — например, заезжают на АЗС по пути на работу.
Поэтому в обновлённом приложении при построении маршрута высвечиваются все заправки по правой стороне дороги и отмечается та, где на нужное топливо самая низкая цена. А на остальных показывается, насколько там отличается стоимость. В итоге водитель может выбрать подходящую станцию и добавить в свой маршрут.
![](https://habrastorage.org/webt/bf/eg/j4/bfegj4dhs2ac-uvqtqkdqvzmrkm.png)
Результаты и выводы
Мы убедились, что принцип «одно действие — один экран» проще воспринимается, и пользователям стало удобнее. Это видно и по метрикам: конверсия в заказы выросла на 17 %. А количество водителей, которые приходят в сервис заправиться повторно, увеличилось почти на 20 %. Но это ещё не всё.
После того как выкатили обновление, мы попросили водителей, которые им уже воспользовались, поставить оценки. В опросе участвовало 30 тысяч человек. Сначала пользователи iOS — их оценки были положительными, большинство поставили нам 5. Потом пришло время пользователей Android. Около 70 % из них поставили 4 и 5, но некоторые поставили 1.
Последних мы решили опросить более подробно. Оказалось, что им неудобно при помощи ползунка выбирать точный объём или сумму — иногда палец соскальзывает и получается не тот результат, какой хотелось. Поэтому мы почти сразу ещё раз обновили экран.
![](https://habrastorage.org/webt/tz/ph/nd/tzphndnxagzxruit0wc_sejhlhm.png)
Теперь под суммой можно нажать «Править» и указать точное число, а количество литров отрегулировать при помощи «+» и «–».
Это обновление показало, что реальный опыт пользователей далеко не всегда совпадает с тем, как мы это себе представляем. Будем рады и другим вашим отзывам!
P. S. Скоро всё это появится не только в приложении Яндекс.Заправки, но и везде, где работает сервис, — в Навигаторе и Яндекс.Картах.