Yaves. Как мы помогли вырасти стартапу, создав удобный сервис по аренде яхт

Идея стартапа — первый в России онлайн-сервис по аренде яхт. Сама по себе услуга уже была очень популярна в регионе. Но у рынка было два важных нюанса:

— Не было удобной системы для онлайн-бронирования. Клиенты не могли арендовать яхту привычным для всех нас образом — нажав на кнопку в приложении. Они были должны писать и звонить судовладельцам.

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

— Не было безопасной системы оплаты. Оплатить бронь можно было переводом со счета на счет, по СберPay или наличными. Это тоже затягивало и усложняло весь процесс.

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

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

Бóльший процент таких сервисов сосредоточен в Европе. В России бизнес развит не так хорошо — всего 2,1 % от общего рынка.

При этом спрос на услугу в России есть, а существующий сервис не устраивает клиентов. Гипотеза подтвердилась и выводами из конкурентного анализа:

— У конкурентов неудобная система бронирования. У одних арендовать яхту можно только по телефону. Причем на сайте есть функция оплаты, но в разделе «помощь»‎ написано, что сначала нужно звонить. У других, например, вообще нельзя оплатить бронь онлайн.

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

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

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

Выжимка из метода персон:

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

Но по итогу план изменился — реализовать идею в мобильном приложении у нас не вышло.

Бизнес по аренде яхт — история сезонная и региональная. Пользователь не будет скачивать приложение, если не пользуется услугой часто.

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

Поэтому от идеи приложения мы отказались и приступили к разработке веб-сервиса.

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

— Разработали сервис с личными кабинетами для 2-х типов пользователей.

Панель управления создали на PHP фреймворке Laravel, а сам сервис на Next.js и React. Почему выбрали именно их?

У React открытый исходный код, он стабилен и может поддерживаться большинством разработчиков. Но для полного раскрытия потенциала ему нужен Next.js. Фреймворк крут тем, что на нем получаются производительные, хорошо заточенные под поисковики сайты — это хорошо для SEO.

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

Личный кабинет судовладельца и арендатора:

— С нуля разработали календарь, где в котором автоматизировали процесс бронирования.

Шаблонная история нам не подходила — если мы делаем что-то уникальное, готовые решения могут только навредить. Вот какие фишки нам удалось внедрить, разрабатывая календарь самостоятельно:

1) кроме настроек с выбором дат и времени, он отражает информацию, когда яхта доступна, а когда нет;

2) судовладелец может посмотреть кто арендует его судно, на какое время и с какими опциями;

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

В коробочных решениях этого всего нет.

Так выглядит календарь судовладельца на адаптивной и десктопной версиях:

Но, как бы хорош ни был календарь, в погоне за деталями мы потеряли производительность. Сначала разработка получилась тяжелой, страницы прогружались дольше, чем нужно. Позже, еще до выхода Yaves в свет, мы «‎‎починили»‎ эту фичу с помощью нормализации и денормализации данных.

— Сделали стильный дизайн под готовую айдентику.

Отразили заложенные идеи в дизайне сайта: разработали концепцию, выбрали цвета и шрифты. Добились лаконичности, но при этом не утратили зрелищность. По итогу оформление вышло актуальным, а сам сайт «витринным».

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

А это часть стайлгайда — документа, на основе которого строится весь дизайн:

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

— Разработали интуитивно понятный интерфейс, разобраться в котором сможет любой пользователь.

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

Пользовательский интерфейс сервиса Yaves:

— Обезопасили электронные платежи, интегрировав сервис с ЮКассой.

У каждого судовладельца есть своя Юкасса. Мы сделали это для того, чтобы ускорить цепочку взаиморасчетов. Когда от арендатора проходит оплата, то 23,5% идет сервису, 3,5% — платежной системе, а 76,5% — судовладельцу на счет. Бронь оплачивается по 100 % предоплате.

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

Хотите оплатить с кошелька ЮMoney? Не проблема!

— Сократили пользовательский путь с 11 шагов до 7.

Сначала пользователю нужно было выбрать все 11 пунктов для брони (количество гостей, выбор яхты, даты и времени). После этого он увидит, доступна нужная яхта или нет. Затем мы сократили это число до 7.

Знаете, что оказалось самым неожиданным? То, что простота сайта, на которую мы делали упор, не гарантировала брони — заказов после «упрощения» не посыпалось!

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

Оказалось, что 2 последних пункта выбора яхты — не совсем то, что нужно людям. 7 шагов до брони — все равно много, а полная предоплата лишала заказов владельцев более дорогих яхт.

— Разделили оплату на 2 части: предоплату (23,5 %) и постоплату.

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

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

Такие получились страницы оплаты услуги:

После этого и добавили возможность вносить снизили предоплату не со 100%, а до 23,5% (20% — комиссия сервиса и 3,5% — комиссия ЮКассы).

— Еще раз сократили пользовательский путь: 7 шагов превратили в 3.

Пользователю больше не нужно ни регистрироваться, ни выбирать нужные пункты, чтобы увидеть, доступна ли яхта. Теперь он выбирает дату и время, вводит количество гостей, нажимает «найти» и сайт подкидывает ему свободные варианты. После оплаты Yaves отправляет детали на почту — никаких регистраций.

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

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

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

Бронирование прогулок: выбираем мероприятие, настраиваем календарь, кликаем на яхту и оплачиваем:

Факт — 80% пользователей используют телефоны для поиска занятий в свободное время или на отдыхе.

И именно поэтому, как только мы закончили с разработкой веб-сервиса, вернулись к первоисточнику. Но не к идее приложения, а к мобильной версии.

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

Мы переработали каталог, добавив в него якорные ссылки, уменьшили количество текстового контента, спрятав описание в табы и сделали страницы более информативными.

Улучшенные экраны адаптива — новый каталог и главная страница:

Тогда же поделили услуги на 2 вида: раньше можно было арендовать только яхты, а теперь еще и прогулки. В чем разница?

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

Детальные страницы прогулки и яхты:

Порядок действий такой: ты выбираешь НЕ яхту, а определенную встречу (свидание, вечеринку, девичник и т.д.), формируешь дату и время, и сервис уже предлагает подходящее под эти цели судно. Сроки были сжатые, и нам было важно было в них уложиться. Эту фичу сделали буквально за 2 недели.

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

— В нем появились скидки, промокоды и промоакции. В админке можно сгенерировать персональную ссылку на скидку, ее увидит только тот, у кого она есть.

Сгенерированная персональная ссылка на скидку:

— Stories. Привычная фишка для пользователей соцсетей. Мы сделали пошаговую подачу контента. Первый слайд — захватываем внимание, показывая красивую (реальную!) картинку, потом — яхту, заточенную конкретно под это мероприятие, ну а третий слайд — дополнительные детали с кнопкой «Хочу так же»

Так выглядят stories с веба и адаптива:

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

Синхронизируемся с Google-календарем в настройках:

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

Заказчик Yaves максимально заинтересован в проекте: он быстро реагирует на изменения, вовремя передает обратную связь от пользователей и практически 24/7 на связи. Так, к сожалению, бывает не всегда.

Его активное участие в купе с нашей оперативностью заставило стартап процветать: сервис успешно запустился. Каждый месяц он удваивает количество яхт, объем заказов и улучшает уровень поддержки клиентов.

И это еще не предел: в дальнейшем Yaves планирует выйти в плавание расширяться как на территории России, так и на ОАЭ и Турцию. А мы собираемся его также активно сопровождать.

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

Владельцам яхт, которые раньше ориентировались на локальный рынок или определенные каналы продаж, теперь доступна более широкая аудитория.

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