Создали веб-расширение для бронирования номеров и услуг в первом в России отеле тишины

К «Мира Велнес» относятся крупнейший велнес-центр Сибири «Мира Термы» с теплыми бассейнами и банями, загородный парк семейного отдыха «Мира Парк» и первый в России отель тишины 16+ «Мира Силентиум».

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

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

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

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

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

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

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

Бронирование проживания происходит в несколько этапов:

• указание нужных дат и количества гостей на главной странице;
• подбор тура для каждого гостя (отличаются включенными услугами);
• выбор размера номера: S, M или L.

При бронировании нескольких номеров 2-й и 3-й этап повторяются. Переключиться между комнатами можно в верхней части страницы.

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

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

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

Когда бронь оформлена, откроется доступ к расписанию событий и услуг, доступных для заказа. Приобрести их можно во вкладке «Расписание» или в разделе «Локации», где появятся события, относящиеся к этой зоне отеля.

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

Личное расписание могут настраивать не только пользователи, приобретающие тур, но и гости, которые едут с ними. Для этого нужно во вкладке «Активные бронирования», дать им доступ к расписанию.

После ввода номера телефона гостя он увидит выбранные услуги в профиле.

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

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

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

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

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

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

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

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

Лаконичные изображения в расписании помогают сориентироваться, где пройдет мероприятие.

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

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

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

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

Разработанное нами веб‑расширение объединило в едином цифровом пространстве:

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

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

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