Клиент может ознакомиться с паспортом качества нефтьмагистраль где находится

Обновлено: 28.03.2024

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

Приложению нужен был редизайн.

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

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

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

№1 Запутанное описание условий программы лояльности

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

№2 Неинформативный стартовый экран с картой заправок и ценами на топливо. У нас была гипотеза, что картой пользуются нечасто, поскольку большинство клиентов Нефтьмагистрали передвигаются по знакомым маршрутам.

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

Приложение открывают уже на заправке, чтобы накопить или списать бонусы. А другие АЗК ищут только тогда, когда отправляются в дальнюю поездку. Поэтому карта на главном экране могла быть полезной, в основном, водителям коммерческого транспорта, которые по работе много перемещаются по разным маршрутам и готовы поискать заправку ради экономии.

№3 Вопросы к UX-копирайту и юзабилити. Основной текст в приложении был набран мелким кеглем, а это неудобно даже для человека с хорошим зрением. В длинных текстах с описанием условий акций не хватало акцентов — заголовков и разделений на абзацы.

№4 Много красного. Это цвет, который сильнее всего привлекает внимание. Если в интерфейсе много красных элементов, на их фоне сложно выделить ошибки и уведомления.

Для этого мы изучили приложения популярных заправок и сервисов с похожими сценариями. Проанализировали мировые тренды, выделив интересные возможности, как, например, голосовой помощник для выбора колонки и количества литров для заправки (его добавили в бэклог на следующие релизы).

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

На заправках изучали и наблюдали за процессами: как работают сотрудники, какими услугами пользуются водители и с какими проблемами чаще всего сталкиваются.

Бизнес-аналитик Вова Румянцев составил список, где собрал все офлайн-сервисы на АЗК: рестораны, магазины, мойки, аптеки и т. д. Это помогло отделить общие принципы от особенностей отдельных точек

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

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

С помощью интервью мы проверили гипотезы. Какие-то фичи отпали — общение показало, что у пользователей таких проблем нет. А всё, что подтвердилось, забрали в дальнейшую работу.

Особенности коротких и длительных поездок разложили в виде Customer Journey Map — это помогло понять, чем отличаются запросы водителей, когда они едут по знакомому маршруту до работы и когда выезжают в соседние города.

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

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

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

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

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

Если пользователь зашёл в свой профиль и находится на заправке, он видит свои бонусы и информацию по конкретному АЗК.

Совсем карта из приложения не пропала: если водитель в дороге, то на стартовом экране он видит ближайшую заправку.

Изменения коснулись отображения условий программы лояльности и акций. В первой версии приложения из-за универсального отображения акций с разными условиями не все клиенты могли в них сориентироваться.

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

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

Экран оплаты. Можно копить бонусы, сканируя QR-код на кассе, или оплачивать услуги прямо в приложении

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

ex. менеджер проекта в Futura by red_mad_robot

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

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

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

Читайте также: