Как не утонуть в лендингах: история создания японского CarPrice

в 8:30, , рубрики: CarPrice, UI, UX, Блог компании CarPrice, Локализация продуктов, Разработка веб-сайтов, Управление продажами, япония

В прошлой статье про развитие CarPrice в Японии мы обещали отдельно написать о создании сайта для экзотического японского рынка. Абсолютно незнакомый язык. Мало времени на запуск. Большая разница во времени между IT и бизнесом. Географически разрозненная команда из России, Японии, Канады, Белоруссии, Филиппин и Китая. В этом посте мы расскажем, как у нас все получилось в этих непростых условиях.

Как не утонуть в лендингах: история создания японского CarPrice - 1

После первого же сравнения российского и японского рынков стало понятно, что простым переводом мы не отделаемся. Да и с «простым переводом» все было непросто. Попытки обработать текст в лоб были обречены на провал — вот несколько примеров гугл-переводчика:

  • 乗車定員 — число пассажиров. У гугла — ездовая способность
  • パドル — руль. У гугла — весло
  • テールレンズ — стоп-фонарь. У гугла —  хвостовая линза
  • トランクルーム  — интерьер багажника. У гугла —  магистральная комната

К нашей команде присоединился японец, живущий в России, но его знаний родного языка было недостаточно для точного перевода. Нужны были знания терминов. В итоге нам очень помог наш первый инспектор в Японии — Такита-сан. Благодаря его экспертизе мы грамотно локализовали первую версию приложения для инспекторов — часть контента, наиболее насыщенную с профессиональной точки зрения.

Вкратце о технологиях. Японский CarPrice — это форк российского проекта. Есть несколько проектов на Laravel + vue, Go и два на битриксе: основной проект-монолит и сайт с FAQ (chiebukuro.carprice.co.jp). Монолитный проект состоит из двух сайтов: сайт для клиентов и сайт для дилеров.

Клиентский сайт

Сайт для тех, кто хочет продать свой автомобиль. Здесь владельцы записываются на оценку авто и аукцион. Вот наш информационно-рекламный ролик с описанием схемы работы:

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

Итак, основной элемент главной страницы — запись на осмотр автомобиля. Далее — описание схемы работы CarPrice. Это 5 шагов:

  1. Ввод информации об автомобиле и получение примерной стоимости.
  2. Бронирование времени осмотра автомобиля инспектором. Можно выбрать на сайте или через колл-центр.
  3. Осмотр автомобиля инспектором
  4. 15-минутный аукцион за автомобиль заинтересованными дилерами. История автоаукционов в Японии насчитывает десятки лет, все уже отточено и проходит быстро.
  5. Предложение цены клиенту, оформление необходимых документов

В первой десктопной версии сайта форма записи была вынесена наверх:

Как не утонуть в лендингах: история создания японского CarPrice - 2

В первой мобильной версии сайта на главной странице анкеты не было, нужно было нажать кнопку:

Как не утонуть в лендингах: история создания японского CarPrice - 3

Вместе с сайтом были запущены лендинги для наших первых маркетинговых акций — менее яркие, более насыщенные информацией.

Как не утонуть в лендингах: история создания японского CarPrice - 4

Программа «Друзья» ( トモダチ ). Приведи друга и получи 20000 йен.

Как не утонуть в лендингах: история создания японского CarPrice - 5

Программа «Приезжайте к нам» ( ご来店応援 ). Подавайте заявку до 31 марта и получите 1000 йен при осмотре автомобиля и еще 10000 йен к цене продажи. Мобильные лендинги здесь почти не отличаются от десктопных — контент, в основном, текстовый.

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

Как не утонуть в лендингах: история создания японского CarPrice - 6

В дальнейшем мы решили убрать большую часть описаний и сделали акцент на форме записи. Теперь сразу тут можно заполнить и личные данные — имя, фамилию, номер телефона:

Как не утонуть в лендингах: история создания японского CarPrice - 7

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

Как не утонуть в лендингах: история создания японского CarPrice - 8

Сообщение о выгоде увеличило конверсию на 10%. В следующем варианте мы повесили в шапку простую медальку с номером один без лишних пояснений. Конверсия подскочила на 25%!

Как не утонуть в лендингах: история создания японского CarPrice - 9

Далее решили поэкспериментировать с лендингами под конкретные марки: Toyota, Honda, Nissan:

Как не утонуть в лендингах: история создания японского CarPrice - 10

По итогам этого периода работы сайта активно взялись за мобильный лендинг. Сначала провели редизайн формы записи на оценку, обновили блоки о работе CarPrice и выгоде для клиентов, а также блок с комментариями. Затем сократили информационные блоки, поменяли картинку в шапке. Потом вновь вернули информационные блоки, но сместили информационный акцент на шаги продажи автомобиля в CarPrice. И наконец — уф! — украсили все иконками. Через некоторое время часть этих изменений коснулась и десктопной версии сайта (на иллюстрации ниже обе версии поставлены рядом).

Как не утонуть в лендингах: история создания японского CarPrice - 11

Как автомобильный производитель, Япония имеет огромный экспортный потенциал. В японском CarPrice мы также решили наладить схему работы на экспорт и сделали соответствующий лендинг на английском:

Как не утонуть в лендингах: история создания японского CarPrice - 12

С распространением сайтов-аккордеонов мы соответствующим образом изменили мобильный лендинг.

Как не утонуть в лендингах: история создания японского CarPrice - 13

Надеемся, вы дочитали до этого места. Самое время раскрыть личность девушки на первой картинке поста. Это Настя — лицо нашей компании в Японии. Настя увлекается косплеем и ведет твиттер на японском (https://twitter.com/nastyan_cos). Когда-то она смогла собрать на краудфандинге 3,2 млн йен (30,000$) на открытие собственного мейд-кафе — это такие косплей-рестораны, в которых официантки, одетые во французском стиле, ведут себя не как обычные официантки, а как служанки в частном доме. Фото Насти до недавнего времени украшало шапку японского CarPrice.

Как не утонуть в лендингах: история создания японского CarPrice - 14

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

Как не утонуть в лендингах: история создания японского CarPrice - 15

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

Дилерский сайт

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

Как не утонуть в лендингах: история создания японского CarPrice - 16

Как не утонуть в лендингах: история создания японского CarPrice - 17

Личный кабинет партнера

В предыдущей статье мы упоминали о многофункциональных японских заправках и сервисах, где можно проводить осмотр и выкуп автомобилей. Поэтому нашей IT-платформой пользуются не только сотрудники CarPrice, но и партнеры, для которых мы сейчас создаем личный кабинет. Привлечение новых партнеров — это основная цель нашего японского маркетинга на сегодня.

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

Среди параметров оценки — пробег, год выпуска, история ремонта, наличие шума в двигателе, дефекты. Все повреждения автомобиля инспектор заносит в оценочный лист ( 評価シート ).

Как не утонуть в лендингах: история создания японского CarPrice - 18

Как не утонуть в лендингах: история создания японского CarPrice - 19

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

Как не утонуть в лендингах: история создания японского CarPrice - 20
В нашей схеме мы используем общепринятые в Японии обозначения типов и размеров повреждений.  Для каждого типа повреждения предусмотрена своя градация размеров. Например, для царапин: 1 — с визитку, 2 — с лист A4, 3 — больше листа A4.

Как не утонуть в лендингах: история создания японского CarPrice - 21

Личный кабинет продавца

На заполнении первой формы работа с владельцами автомобилей только начинается. В Японии мы смогли полностью перевести все взаимодействие в электронный вид. Для этого был создан личный кабинет продавца.

Как не утонуть в лендингах: история создания японского CarPrice - 22

Как не утонуть в лендингах: история создания японского CarPrice - 23

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

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

Автор: ryanover

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js