RentMotors — сервис аренды автомобилей, работающий на рынке уже 17 лет. За это время компания создала широкую сетку с 50 арендными пунктами в 5 странах и 28 городах.
Компания является надежным и дружелюбным автопрокатом с высоким качеством обслуживания — оценка сервиса в рейтинге организаций Яндекса составляет 4,9 балла. Ежемесячно заказчик заключает более 7500 договоров аренды. Для этого масштабного клиентского потока нам предстояло создать систему онлайн-бронирования.
Задача
Бронирование автомобилей компания проводит как через партнерские, так и через собственные каналы. При этом больше половины броней проходит именно на сайте проката, поэтому важно, чтобы пользователям было легко выбрать автомобиль, а заполнение заявки не занимало много времени.
Старый сайт компании требовал обновления и имел ряд недостатков:
Команда RentMotors обратилась в Атвинту, чтобы разработать новый сервис бронирования.
Нам предстояло:
Решение
Разработан удобный онлайн-сервис бронирования автомобилей для компании RentMotors. Внутри реализована масштабная интеграция с системой управления автопарком Online Fleet, которую заказчик использует в своих бизнес-процессах.
Основные функции веб-продукта:
Для комфорта клиентов мы учли привычные паттерны поведения в подобных сервисах и заложили их в основу интерфейса. Наша логика бронирования предлагает простой и быстрый путь заказа автомобиля — пользователю не нужно тратить время на регистрацию и подробное заполнение данных. Всего 5 простых шагов за 10 минут, и вопрос с транспортом в поездке решен.
Аналитика
В рамках этапа аналитики провели исследования, которые помогли изучить клиентов сервиса, описать необходимый функционал и структуру сайта с бронированием.
Аналитики выяснили, что ядром целевой аудитории сервиса являются туристы, в том числе путешествующие с бизнес-целями.
Поисковые запросы
Большинство запросов — брендовые, содержат варианты написания имени сайта («рентомоторс», «rent motors», «rentmotors»). Основные локации, упомянутые в запросах: Москва, Сочи, Санкт-Петербург, Краснодар, Симферополь, Калининград, Ереван, Ростов-на-Дону. В большинстве своем запросы по локациям совпадают с точками представленности компании.
Рекомендации аналитиков
На основе пользовательского опыта и анализа референсов мы выяснили, что на сайте должны быть:
Кроме рекомендаций по функциональности, на этапе аналитики была сформирована предварительная структура сайта.
User Story
В рамках аналитики также провели исследование пути пользователя по сервису.
За основу были взяты типичные сценарии аренды, которые говорят о том, что чаще всего люди бронируют авто в аэропорту чужого города, а также отдают предпочтение уже знакомым маркам автомобилей.
Оценили поисковый спрос на продукт с точки зрения SEO: как пользователи ищут бронирование автомобилей, в каких городах и по каким параметрам.
В результате анализа поискового спроса выяснили, что основными запросами в сфере бронирования автомобилей являются:
На старом сайте отсутствовали посадочные страницы по всем запросам.
Помимо постраничной структуры сайта, оценили контентную составляющую, которая необходима для принятия решения пользователем о бронировании. Кроме того, контент важен и для SEO-продвижения с точки зрения коммерческих преимуществ сайта.
Прототипы
Учитывая рекомендации аналитиков, разработали прототипы будущего сайта. Предлагаемый интерфейс содержит удобный и понятный путь бронирования, блоки с преимуществами сервиса, а также полезную информацию для клиентов.
Дизайн
Главным в проекте было обеспечить понятный путь бронирования, поэтому мы решили не нагружать интерфейс элементами, которые могли бы сместить внимание пользователя с целевых действий на визуал. Минималистичный дизайн с использованием цветов бренда — оптимальное решение для данного сервиса.
Иконки
Для проекта отрисовали уникальные иконки в стиле бренда, которые дополнили раздел дополнительных услуг и главную страницу. Они создают визуальную ассоциацию с предлагаемой опцией или преимуществом. Например, для страховки мы нарисовали зонтик, а для доставки автомобиля по адресу — машину со значком геолокации.
Форма бронирования
Особое внимание уделили процессу бронирования — главной функции, ради которой пользователи приходят на сайт. Мы хотели оформить страницы так, чтобы на каждом из этапов клиенту было легко сделать выбор и заполнить данные.
В первом блоке главной страницы сразу разместили форму бронирования, которая является первым шагом на пути оформления заявки.
Благодаря такому решению клиенты быстро адаптируются к знакомой схеме и сразу приступают к брони.
В форму мы добавили ключевые критерии для заказа:
Эти критерии помогают на первом шаге отфильтровать автомобили, открытые к бронированию. Подборку с каталогом свободных машин система выводит на следующем шаге.
Каталог и карточки автомобилей
Один из важнейших шагов бронирования, на котором клиент выбирает железного коня. Для удобства поиска добавили несколько основных фильтров, а также возможность выводить доступные модели списком или плиткой.
Сложность оформления карточек заключается в размере — на небольшой области нужно грамотно разместить достаточно много разной информации об автомобиле. Чтобы пользователь легко различал разные данные, мы использовали комбинацию из иконок, кнопок, крупного и мелкого текста, изображений.
Изучив карточку, клиент узнает обо всех ключевых характеристиках автомобиля и условиях его аренды.
Всего на карточке размещено 9 характеристик, помогающих сделать выбор:
Выбор услуг
Для комфортной поездки RentMotors предлагает клиентам выбрать дополнительные опции, перечень которых мы выводим на одном из этапов бронирования.
Здесь мы сделали интерфейс максимально отзывчивым. При наведении на услугу, ее блок выделяются тенью. При нажатии тумблер перемещается и окрашивается в яркий активный цвет, который сигнализирует, что услуга добавлена. При необходимости можно ознакомиться с услугой подробнее и перейти на ее страницу.
Детали заказа
Одна из главных задач при разработке интерфейса бронирования — обеспечить прозрачное ценообразование. Заказ, который не отображает всех доплат и корректной конечной стоимости, приведет к конфликтам с менеджерами. А это — плохие отзывы и крах копившейся годами репутации.
В деталях заказа мы отразили все суммы и предупреждения о возможных доплатах, например, при превышении базового километража. Финальную стоимость выделили ярким цветом и отдельным блоком — чтобы клиент точно обратил на нее внимание.
UI Kit
Правило хорошего тона и залог успешной верстки — структурированная дизайн-система, где царит полный порядок.
Адаптивы для мобильной версии
На этапе аналитики мы выяснили, что почти половина клиентов пользуются сервисом с мобильного телефона, поэтому проработка макетов под этот формат стала важным этапом работ по дизайну и верстке.
Логика бронирования
Мы реализовали простой путь бронирования в 5 шагов:
Оплатить услугу клиент может онлайн в нашем сервисе или же выбрать оплату на станции. Выбор формы оплаты происходит на последнем шаге.
На новом сайте RentMotors клиент может забронировать машину за 10 минут.
Бронирование для разных видов пользователей
Реализована логика бронирования как для физических, так и для юридических лиц — мы предусмотрели разные формы сбора данных, а также 2 вида ваучеров. Оплата брони юридического лица осуществляется по счету на оплату, который клиент получает на почту.
Еще один сценарий бронирования разработан специально для партнерки S7 — участники программы S7 Priority получают мили за использование сервиса. Для начисления бонусов информация о заказе передается авиакомпании.
Интеграция с системой управления прокатом
RentMotors управляет автопарком через сервис Online Fleet. Это многофункциональная платформа, разработанная под бизнес-процессы проката. Внутри хранится база автомобилей, отслеживается статус броней, фиксируются сделки с клиентами и ведется финансовая отчетность.
Бронирование в нашем сервисе основано на интеграции с Online Fleet — взаимодействие с системой осуществляется через API.
На первом шаге, когда пользователь выбирает дату и место получения автомобиля, мы делаем запрос в Online Fleet, после чего сайт выводит отфильтрованную базу моделей, которые свободны к бронированию и отвечают требованиям клиента.
Собранные о бронировании данные отправляем в систему, где формируется заявка, меняется статус машины на выбранные даты и фиксируются данные об оплате. После оформления бронирования Online Fleet отправляет клиенту на почту подтверждение и информацию по заказу.
Управление бронированием
Для управления бронированием создали отдельный раздел, где клиент может изменить или проверить свою заявку. Если будут внесены изменения, то сервис отправит эти данные в Online Fleet и обновит информацию о брони.
Для постоянных пользователей сервиса мы разрабатываем функцию автозаполнения данных — это позволит быстро оформлять новые заявки в сервисе.
SEO
Чтобы повысить эффективность сайта в контексте SEO, по рекомендации аналитиков добавили страницы под востребованные клиентами автопрокатов поисковые запросы.
На сайте созданы страницы:
Такой подход позволяет максимизировать трафик из поисковиков за счет правильно проработанных страниц, которые охватывают наиболее актуальные запросы пользователей.
Англоязычная версия
Клиентами Rent Motors являются как русскоговорящие, так и иностранные пользователи, для которых мы разработали англоязычную версию сайта. Теперь сервис открыт для пользователей со всего мира.
Итоги
В рамках проекта закрыли все поставленные на старте задачи:
На момент публикации кейса сервис бронирования запущен и принимает первые брони клиентов RentMotors. Мы продолжили сотрудничество с клиентом по SEO, а также добавляем в проект новые доработки.