Разработка мобильного приложения «Куда на море» с бесконечным календарем для управления бронированием гостиничных объектов

Главное о кейсе

Рассказываем:

1. Как мы сделали сложный интерфейс для управления бронированиями плавным и без зависаний.

2. Какое решение мы предложили клиенту и почему он выбрал нашу разработку на Kotlin Multiplatform, несмотря на дешёвые предложения от разработчиков на Flutter.


⬤ О клиенте

«Куда на море» — агрегатор объявлений для аренды отелей и гостиниц на юге России. Отельеры оплачивают подписку и размещают свои объекты на сайте, а гости бронируют квартиры и гостиничные номера.

⬤ Идея разработки

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

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

Клиент пробовал разработать приложение на Flutter, но с его помощью добиться плавности и отзывчивости интерфейса шахматки не получилось. Мы предложили решение на KMP (Kotlin Multiplatform) и создали прототип за 2 дня, который плавно работал при большом количестве гостиничных объектов и устроил клиента.


⬤ Итоги реализации

Мы разработали Android-приложение с плавной и непрерывной шахматкой, которая:

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

Как проект изменил жизнь пользователей

⬤ Управлять бронированиями теперь можно с телефона

Управлять большим количеством бронирований, особенно когда их десятки на один номер, — непросто. Мы сделали мобильное приложение с удобной шахматкой:

◉ Где строки — это номера, а колонки — дни и месяцы, что позволяет легко просматривать как прошедшие, так и предстоящие бронирования.

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

◉ У каждого гостевого номера есть статус с цветовой маркировкой: например, «ждём предоплату» или «требуется уборка»

⬤ Один из отельеров ведёт в приложении даже аренду машин

Шахматка настолько удобна, один из отельеров использует её для учета аренды автомобилей. Вместо гостиничного объекта он создал в личном кабинете свой автопарк и отмечает арендованные автомобили.

Бизнес-задача и ее решение

⬤ Повысить актуальность информации о занятости номеров и квартир


Чтобы выставлять актуальные статусы номеров на сайте «Куда на море», в личном кабинете отельеров есть веб-версия шахматки. Но пользоваться ей со смартфона было неудобно:

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

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


⬤ Создать удобный инструмент, который повысит вовлечённость отельеров

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

Клиент решил создать мобильное приложение для управления бронированиями на KMP (Kotlin Multiplatform), которое будет:


— Отличаться от веб-версии своим удобством, быстротой и плавными анимациями.
— Иметь всё необходимое для управления бронированиями с добавлением нескольких гостиниц/отелей и сменой статусов.
— Работать в оффлайне, ведь некоторые отели и гостиницы имеют слабый доступ к интернету, например, в горах.

Крафт (мастерство), реализация, технические детали

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

⬤ Преимущества использования KMP (Kotlin Multiplatform)

Kotlin Multiplatform — это технология, которая помогает разработчикам переиспользовать код бизнес-логики на iOS и Android, но при этом сделать интерфейс нативным для каждой платформы.

Мы разрабатывали шахматку на KMP. В отличие от Flutter, KMP позволил нам использовать нативные элементы Android, что было критично для создания продукта с плавным интерфейсом.

◉ Compose для плавности функционала

Киллер-фича шахматки «Куда на море» — бесконечная прокрутка календаря бронирований, которая не зависает. Такой плавности интерфейса мы добились, используя нативность отрисовки Compose.

◉ Бизнес-логика в едином месте

Удалось сосредоточить всю бизнес-логику в одном месте. В будущем это позволит легко адаптировать приложение для iOS и перенести весь основной функционал.

⬤ Синхронизация данных в оффлайне

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

«Предыдущий опыт реализации системы синхронизации в offline-first приложениях для ПИК и KLEO позволил сразу реализовать оптимальную синхронизацию в приложении “Куда на море”. В частности, было реализовано обновление только измененных данных и многопоточная загрузка больших объемов информации».

— Максим Мялкин, управляющий партнер KTS и лид мобильной разработки

⬤ Фичи шахматки

В приложении доступны:

— бесконечный и плавный скроллинг календаря;
— возможность создания новых объектов, например, номеров отелей;
— изменение статусов бронирования с добавлением цветных меток (заезд, выезд, оплата, подтверждение);
— добавление объектов из веб-версии благодаря WebView;
— синхронизация данных: оффлайн-изменения отправляются на сервер автоматически при появлении сети.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

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

Мы рассказали заказчику о преимущества KMP (Kotlin Mupltiplatform) — отзывчивости и плавности интерфейса, которую он даёт. Но одних слов недостаточно. Мы сделали демо-прототип, который стоил нам всего два дня разработчика. Клиент своими глазами убедился, что разработка на KMP — самое подходящее решение его задачи.

Скриншоты

Видео