Здравствуйте. Команда дизайнеров Noknok Digital. Занимаюсь дизайном интерфейсов для продуктовых компаний. В настоящее время мы работаем над многими автомобильными темами и хотели бы поделиться анализом «гаражных» сервисов приложений Авито, Авто.Ру и Дром.
Что такое «Гараж»
Это большой функциональный раздел, который уже давно доступен в конфиденциальных приложениях, но по каким-то причинам практически не встречается в приложениях автодилеров.
Эта услуга может повысить ценность пользователей и повысить их удержание. Давайте рассмотрим лучшие практики от компаний, которые развиваются уже давно.
Путь в гараж
Расположение сервиса зависит от специализации приложения. Например, он доступен как на главном экране, так и скрыт за несколькими уровнями меню.
Давайте посмотрим, какое место эта услуга занимает в общей автоматической классификации.
Автоматический РУ
На Авто.ру нет обычных личных кабинетов в панели навигации. Вместо этого он использует бургер-меню со множеством функций, включая «гараж». Предварительная версия сервиса не особо выделяется на фоне других функций.
Абито
«Гараж» находится в вашем профиле пользователя. Чтобы попасть туда, вам нужно открыть личный кабинет с панели навигации и прокрутить вниз. «Гараж» здесь тоже не выделяется, так как перечислены все услуги и продукция собственного производства.
Дром
Для открытия Сервиса вам также потребуется доступ к личному кабинету. В приложении Droma акцент сделан на блоке «гараж», который по сравнению с превью других сервисов большой.
Добавление авто в «Гараж»
Давайте рассмотрим, как добавить в сервис автомобили в каждой классификации.
Автоматический РУ
Припарковать автомобиль в Гараже можно двумя способами: введя номер автомобиля или введя/сканировав VIN-код. Оба потока очень просты и состоят из нескольких шагов.
Авто.ру – Добавление по номеру автомобиля
Когда вы выбираете опцию, поле выглядит стилизованным под номерной знак. Это позволяет пользователям изначально понимать, что и где вводить.
Отправив форму на проверку, вы увидите красивую анимацию загрузки, учитывающую контекст вашего сценария. Мы ждем Вас, чтобы найти свой автомобиль в каталоге.
Леша Берич Дизайнер интерфейсов
Эта анимация — одно из многих микровзаимодействий в вашем приложении, которые оказывают огромное влияние на лояльность. Не знаю, как кто-то другой, а меня очень волнуют анимации и такие мелкие детали.
Как только автомобиль будет найден, отобразятся его данные, что позволит вам подтвердить, действительно ли это ваш автомобиль.
Если автомобиль не найден, появится экран ошибки. Приятно иметь под рукой другое решение вашей проблемы. Ведь каждый хочет получить объяснение, почему машина не была найдена и что на это повлияло.
Auto.ru – Дополнение по VIN автомобиля
Выбор этой опции откроет форму с одним полем ввода.
Внутри есть аккуратные значки, и вы можете сканировать STS без какого-либо ручного ввода. При сканировании STS вы увидите забавную анимацию с просьбой перевернуть телефон.
Ксюша Кукота Дизайнер интерфейсов
Добавление автомобилей – отличная возможность. Это «бывшая» машина и дополнение «мечты». Это не только визуально приятно, но и полезно. Вы можете отслеживать новые предложения по автомобилю вашей мечты.
Авито
Авито – Добавить по номеру автомобиля
В «Авито Гараж» есть одно поле для ввода номера автомобиля или VIN. Если вы еще не добавляли сюда автомобиль, вместо раздела «Гараж» Авито покажет лишь краткое описание услуги.
Введите свой номер и подождите, пока ваша машина будет найдена. Если все в порядке, вам будет предложено подтвердить, что вы ввели правильный номер. Убедившись, что это наша машина, мы оказались внутри самой секции.
Авито – Добавить на автомобиль VIN
Добавление по VIN работает так же, как и на Авто.ру, но если вы не можете найти свой автомобиль, его можно добавить вручную.
Дром
Дром – Добавить по номеру машины
Droma также позволяет добавлять автомобили, вводя их номерные знаки или сканируя СТС. Нажмите на раздел «Гараж», и вы сразу попадете на красивый стилизованный экран ввода.
Леша Берич Дизайнер интерфейсов
После ввода номера откроется специальная клавиатура. В зависимости от типа вводимых данных там блокируются ненужные символы. Это полностью перекрывает боль от опечаток. Например, набирая буквы быстро, вы не перепутаете цифру 0 с буквой О. Я часто нажимаю ненужные кнопки при добавлении машин в «гараж» Авито. Дизайнерам Droma удалось выжать из этого экшена максимум функциональности.
Дром – Добавить VIN автомобиля
Внизу есть кнопка, открывающая второй способ добавления автомобилей (Сканировать на СТС). Здесь тоже все просто. Откроется экран камеры, и вам нужно поместить STS в красную рамку. Если все сделано правильно, рамка станет зеленой. Вы также можете загрузить фотографию своего СТС и ознакомиться с информацией.
После указания госномера или сканирования СТС вам откроется экран для ввода данных об автомобиле (аналог Авто.ру). Вы можете пока пропустить этот шаг или сразу ввести свои данные.
Карточка авто в «Гараже»
Функционал карт во всех приложениях схож, но у каждого есть свои особенности в зависимости от специализации продукта
Авто.ру – Основная информация об автомобилях
На первом экране отображается краткая информация об автомобиле (марка, модель, номерной знак) и его фотография. Вы можете редактировать данные, добавлять информацию (например, пробег), устанавливать фотографии и даже записывать панорамы. Потом, когда вы создадите объявление о продаже этого автомобиля, в него подтянутся эти данные.
Авто.ру – Ремонт и обслуживание
В этом разделе размещен каталог дилеров, у которых вы можете записаться на обслуживание вашего автомобиля. Также у вас есть возможность получить скидки на услуги и подать заявку на страхование ОСАГО или КАСКО.
Ниже расположены блоки, содержащие акции и скидки на автотовары, размещенные на Яндекс.Маркете. Товары отображаются независимо от типа транспортного средства.
Авто.ру – оценка и продажа автомобилей
Укажите пробег и отобразится рейтинг автомобиля. В предварительном просмотре отображается краткая информация о ценовом диапазоне и условиях самопродажи, а при нажатии на раздел открывается подробная оценка, в которой показаны факторы, влияющие на цену, и график изменения цен на варианты рекламы и продажи.
При нажатии на кнопку «Продать» будет сформировано объявление о продаже автомобиля и переданы введенные данные об автомобиле. Трансферы можно осуществить из раздела обзора автомобилей или из дополнительного меню. Есть два варианта продажи: сделать это самостоятельно или с помощью специалистов Авто.ру.
Авто.ру – интеграция с сервисами
Данное приложение интегрировано с такими сервисами, как Яндекс.Сплит, Яндекс.Маркет, Госуслуги, ГИБДД и других партнеров.
Благодаря интеграции с госуслугами права на автомобили и транспортные средства доступны в виде QR-кодов. Актуальные данные загружаются из базы данных ГИБДД и при необходимости ДТП могут быть зарегистрированы в соответствии с Европейским протоколом.
Партнеры Авто.ру также проводят акции на свои товары и услуги. Например, вы можете получать скидки по КАСКО и ОСАГО, совершать выгодные покупки на Яндекс.Маркете и воспользоваться другими уникальными предложениями от наших партнеров.
Auto.ru — дополнительная информация об автомобилях
У гаража есть много других интересных особенностей. Бортовой журнал, в котором можно читать и писать об автомобилях, обзор автомобиля с плюсами и минусами, блог со статьями на автомобильную тематику, калькулятор транспортного налога и многое другое.
В целом, у него много функций, но он не очень прост в использовании. Поэтому некоторая информация из журналов и статей может повторяться. Кроме того, если вы добавите несколько автомобилей, вы увидите подборку статей для всех марок.
Ксюша Кукота Дизайнер интерфейсов
Эта услуга включает данные о кампаниях по отзыву брендов и возможность получать оповещения о проведении кампаний по отзыву брендов. Информация, содержащаяся здесь, относится к источникам и является максимально полной.
Auto.ru — самое функциональное из всех приложений в этой подборке, но такое ощущение, что в нем слишком много информации. Например, здесь дублируются некоторые блоки с одинаковыми данными, что делает гаражную карточку длиннее, но не содержит новой информации.
Обилие сервисов, баннеры с акциями и кнопки могут вызвать «баннерную слепоту», в результате которой важная информация будет упущена из виду. Например, баннер с надписью «Получите отчет Auto.ru бесплатно!» Это происходит дважды на одном другом экране. А через несколько экранов отчет уже предлагают купить вместо того, чтобы получить его бесплатно. У пользователей, которые не внимательно читают текст (а таких пользователей немало), такая информация может вызвать противоречия.
В то же время хотелось бы отметить приятный интерфейс и тот факт, что большинство функций по-прежнему полезны.
Авито
Авито – Основная информация об автомобиле
На первом экране отображается простая информация о вашем автомобиле, включая марку, модель, VIN, фотографию автомобиля, отчет Autotech и срок действия полиса ОСАГО. Однако нет возможности изменить параметры автомобиля, добавить фотографии или несколько автомобилей.
Авито – Ремонт и обслуживание
На Авито отображаются рекламные блоки с предложениями по продаже запчастей и услуг. При нажатии на них активируются фильтры по данным вашего автомобиля и вы будете получать релевантные объявления из других разделов Авито.
Авито – Оценка и продажа автомобилей
Здесь нет автоматической оценки и нельзя продавать автомобили напрямую из раздела «Гараж». Объявления необходимо создавать отдельно.
Авито – Интеграция с сервисами
Если у вас есть ОСАГО, здесь сразу появится информация о вашей страховке. Также у вас будет возможность продлить страховой полис по минимальной цене с помощью сервиса Сравни.ру.
Авито интегрирован с уникальным сервисом «Автотек», предоставляющим отчеты об автомобилях.
Авито – Дополнительная информация об автомобиле
Этот блок хорошо виден, потому что там есть информация об отзывной компании, а на карте информации не так много. Данные о компаниях предоставляются в общем формате, за исключением ссылок на источники. Также нельзя настроить push-уведомления о появлении новой информации.
Ксюша Кукота Дизайнер интерфейсов
Просматриваемый блок компании присутствует во всех трех приложениях, но быстро я заметил его только в Гараже Авито из-за того, что интерфейс чистый и баннеры не загружаются. Однако наиболее полную информацию, включая ссылки на источники и список VIN-ов, участвующих в отзывах, уже удалось найти на Авто.ру.
Авито – Заключение по автокартам
«Гараж» на Авито имеет меньше возможностей по сравнению с «Авто.ру» и «Дром», например, нет кнопки «продать машину» и ценового предложения. Приложение ориентировано на выбор автомобиля и клики по объявлениям внутри самого Авито. Кнопка «Найти детали» также закреплена по всей странице. Однако интерфейс здесь чистый и не загружается, как у других приложений.
Дром
Дром – Основные сведения об автомобиле
На первом экране отображается информация о вашем автомобиле, включая марку, модель, год выпуска и номерной знак. Также вы можете предоставить дополнительную информацию и установить фото вашего автомобиля. Поддерживается добавление нескольких автомобилей.
Ксюша Кукота Дизайнер интерфейсов
Droma имеет возможность отслеживать расходы вашего автомобиля по различным категориям, таким как топливо, техническое обслуживание, мойка, парковка, шины и т д. Вы можете ввести стоимость конкретного автомобиля и проанализировать ее.
Дром – Ремонт и обслуживание
У Дрома есть каталог автозапчастей, и на вашей карточке автомобиля будут отображаться объявления, относящиеся к этой модели.
Дром – Оценка и продажа автомобилей
Как и на Авто.ру, здесь есть функция рейтинга автомобилей, но здесь она более ограничена. Приблизительная стоимость будет указана с пометкой, что оценка дается за автомобиль в хорошем состоянии. Для некоторых моделей автомобилей будет отображаться график изменения цен.
Рекламировать продажу автомобилей можно прямо из «Гаража». Но бесплатных предложений от экспертов по продаже автомобилей Droma, таких как Авто.ру, нет.
Дром – Интеграция с сервисами
При наличии данных по ОСАГО они будут загружены автоматически. Приложение также интегрировано с сервисом Дром.ОСАГО, что позволяет выбрать лучшее предложение от вашей страховой компании.
Дром – Дополнительная информация об автомобилях
Есть и много других интересных функций. Например, при указании конфигурации считывается емкость топливного бака, расход топлива и тип. Полезно всегда иметь эту информацию под рукой. Было бы полезно посмотреть, нет ли в гараже штрафов. Как и на Авто.ру, здесь можно рассчитать транспортный налог.
В разделе «Вопросы и ответы» вы можете прочитать информацию и отзывы о конкретной модели, увидеть ее преимущества и недостатки. В «Дроме» статьи не вызывают путаницы, как в «Авто.ру», а наоборот, все блоки логически следуют друг за другом и не перекрываются, поэтому дополняют информацию.
Дром – Заключение по автомобильным картам
Карточки автомобилей Droma’s Garage создают впечатление, что продукт и дизайнер в первую очередь думают о пользователе. Здесь нет навязчивых продаж, и вы можете легко отслеживать информацию о своем автомобиле без назойливой рекламы.
Заключение
В каждом приложении сервисы Garage имеют свои сильные и слабые стороны в зависимости от функции, которую выполняет сама классификация.
Если вам интересна тема UX и интерфейсов, посетите наш Telegram-канал, где мы регулярно публикуем обзоры. Для заказа UX/UI аудита или дизайна интерфейса пишите в ТГ @julanova
1 репост