Вэлко
Сервис для бронирования апартаментов

Описание проекта
Хотели бы ощутить комфорт, находясь в длительной командировке? Или снять квартиру без посредников и назойливых хозяев? Или даже получить временную прописку? Если да, добро пожаловать в клубный дом «Вэлко»!
С заказчиком у нас вышла долгая история. В 2021 году мы разрабатывали для Сервико-Авто корпоративное приложение, а через год компания пришла к нам с другим запросом — создать сайт для клубного дома «Вэлко».
«Вэлко» помогает местным жителям и командированным в Иркутск арендовать квартиру на любой срок. Аналогов такого проекта в России нет. Это не подобие Авито, Booking и ЦИАНа. Фишка в том, что здесь сдается весь 17-этажный дом. Без дотошных хозяев и посредников. В каждой квартире есть все необходимое — мебель и бытовая техника, не говоря уже о дизайнерском ремонте. На территории находится паркинг, детский сад, круглосуточная консьерж-служба и охрана с видеонаблюдением. Внутри зона ожидания гостей и курьеров. Но и это не все — в «Вэлко» можно оформить временную прописку!
Клубный дом — это новый формат цивилизованной и комфортной долгосрочной аренды жилья, без комиссий и посредников
Виктор, директор ООО «Сервико»
Название происходит от английского «Welcome»
Что требовалось
Цель — разработать сервис, через который можно забронировать апартаменты с дизайнерским ремонтом и пулом дополнительных услуг. Например, клинингом и парковкой.
Для этого мы придумали функционал:
- Разработали личный кабинет арендатора
- Создали панель управления для администратора
- Добавили возможность забронировать и отфильтровать квартиры
- Разработали функционал дополнительных услуг
- Настроили интеграцию с платежными системами и 1С
- Полностью автоматизировали документооборот
- Сделали административную панель для управления бронирования
Квартиры отличаются планировкой и ценой. Те, что этажом повыше — стоят дороже.
Этапы разработки
Аналитика
Перед тем, как взяться за разработку, мы провели предпроектную аналитику. Проанализировали целевую аудиторию, узнали ее потребности, боли и мотивы. Изучили конкурентов, подготовили свое видение проекта и продумали структуру будущего сайта.
Анализируя стейкхолдеров (всех заинтересованных в проекте людей), мы выявили их самые злободневные боли. У клиента болело одно, у арендаторов — второе, у администратора сайта — третье. Посмотрите сами.
Провели анализ целевой аудитории, вот что было важно будущим арендаторам:
- Безопасность сделки
- Отсутствие предвзятости, как это часто бывает — никаких ограничений по полу, национальности и «парам нельзя»
- Возможность посмотреть и забронировать квартиру заранее
- Возможность получить официальные документы (например, для работодателя)
- Все удобства — техника, мебель, хороший ремонт
- Возможность поселиться в квартиру с маленьким ребенком или пушистым другом
- Чистота после прошлых жильцов
Проанализировали конкурентов и разработали структуру, по которой будет делаться прототип.
Главными стали Авито, Airbnb, ЦИАН, Домофонд, Юла и Booking. Посмотрели, что они предлагают, проанализировали сайты, структуру, навигацию, оформление. Подглядели фишки и придумали свои. Например, реферальную программу, подбор похожих предложений, доску объявлений и удобную форму оплаты, в которой цена считается сразу за весь срок аренды. Но самой главной особенностью стала сама идея того, что у «Вэлко» сдается весь 17-этажный дом.
Дизайн
Чтобы заказчик мог заранее оценить внешний вид сайта, мы подготовили для него прототип — интерактивную модель с упрощенной графической частью. На нем видно, как расположены блоки, по ним можно кликать и исследовать меню.
На этом этапе мы развили идею главной фишки — интерактивной модели дома на главной странице.
Правда, наше видение не всегда совпадало с клиентским. Так бывает, и это нормально. Не все идеи, отраженные в прототипе, были реализованы. Например, из финальной версии убрали вкладку «акции», «новости» и полностью переработали внешний вид карточек в каталоге.
Внешний вид «Вэлко» полностью отвечает политике гостеприимного дома. Мы использовали теплые цвета, взяв за основу готовый брендбук, который предоставил клиент. Оттенки горчичного расслабляют нервную систему и дают глазу отдохнуть.
Теперь про фирменный элемент. Мы объединили квадрат и круг. Квадрат олицетворяет жильца клубного дома. А круг означает безопасное пространство, которое окутывает его заботой и сервисом.
Фишка дизайна — интерактивная модель многоэтажки. По клику можно увидеть, что находится на территории и посмотреть свободные квартиры.
Мы отрисовали каждый полигон в Figma, а потом наложили их поверх плана. И еще связали их с данными, которые передаются с бэкенда, чтобы полигон менял свой цвет в зависимости от того, свободна сейчас квартира или нет!
Разработка
Как взаимодействует арендодатель и арендатор. Заехать в апартаменты день в день не получится, их нужно забронировать заранее. У клубного дома нет горничных, которые обслуживают квартиры на постоянной основе. Перед заселением нового жильца им нужно подготовиться — заказать клининг и сделать мелкий ремонт. Вдруг где-то открутилась ручка.
Перед бронированием арендатору надо внести залог 10 тысяч — сумма пойдет в счет месячной оплаты. За следующий месяц ему нужно внести уже месячный депозит. Он хранится на балансе арендатора и возвращается при выезде.
Если клиент забыл про бронь, поленился ее отменить или просто не приехал, сумма сгорает.
Размер депозита зависит от того, есть ли у арендатора домашние животные. Если человек заезжает с кошкой, размер депозита увеличится в 1,5 раза
Николай, аналитик Пиробайта
Счет формируется в 1С. Арендатор может оплатить проживание через:
- СберБизнес
- Юкассу
- Реквизиты
- QR-код
Информацию о начислениях и списаниях можно посмотреть в разделе «финансы».
Что может делать пользователь в личном кабинете? Получать документы, выписки и чеки. При этом ему не надо стучаться в бухгалтерию, все выписки он может запросить онлайн.
Контролировать свои финансы:
Видеть, сколько квартир уже забронировано и сколько арендовано:
Заказывать дополнительные услуги:
Например, в личном кабинете можно забронировать подземную парковку или заказать уборку квартиры. Кстати, своим резидентам «Вэлко» дарит доступ в закрытый тренажерный зал и релакс-зону!
Настроили интеграцию с платежными системами — Юкассой и СберБизнесом, потому что арендовать квартиру могут и физические лица, и юридические. Изначально планировалась только СберОплата b2c. Но когда с нашей стороны было почти все готово, клиент попросил переехать на ЮКассу, так как первый вариант стал для них неактуален. Благо, что SCRUM, по которому мы работаем, позволяет внедрять что-то новое уже в процессе. B2b оплату мы сделали через СберБизнес. С ЮКассой никаких сложностей не было.
У них четко описанная API и есть SDK, что очень упрощает интеграцию. В SDK заранее прописана вся логика, ее остается только внедрить в проект и протестировать.
А вот со СберБизнесом пришлось попотеть. СберБизнес убрали систему webhook. Информация о платеже теперь не возвращается на сервер в автоматическом режиме. Статус операции «выполнено», «не выполнено» приходится отслеживать вручную, потому что информация об оплате появляется только через 5-20 минут. Для того, чтобы пользователь мог узнать статус оплаты, после редиректа на его проверку выводится окно, что оплата в обработке.
Интеграция с 1С
Так как для компаний интеграция 1С с сайтом — демонстрация высокого уровня сервиса и основное условие эффективности, то мы не упустили этот момент. Да и упустишь его! Для «Вэлко» интеграция с 1С автоматизирует рутинные процессы, потому что:
- Хранит информацию о ценах на квартиры, услуги и коммунальные платежи. Кстати, забыли сказать, что они тоже входят в счет месячной оплаты
- Автоматически формирует счета на оплату
- Записывает информацию о статусе проведенных платежей
- Сохраняет данные о арендаторах
Но без подводных камней, конечно, никуда.
Чтобы воплотить все задумки, нужно подробно описывать методы и параметры, которыми сайт будет обмениваться с системой. В этом нет ничего сложного. Но нужно заложить дополнительное время на согласования действий со стороны заказчика и поддержки 1С. Бывали случаи, когда 1С выдавал ошибку в ответ на корректные данные — типичная логическая ошибка на их стороне. Но самый главный бич — долгие ответы системы на запросы.
Что это значит для нас, как для разработчика?
Во-первых, нужно подготовить клиента к тесному общению на этом этапе. Мало просто добавить кусок кода в нужное место, чтобы все работало. Разработка осложняется особенностями бизнес-процессов. На любое, даже самое маленькое несоответствие параметров или методов, 1С выдает ошибку и стопорит всю работу.
Во-вторых, нужно заложить время на ожидания исправления багов в самой системе от 1С.
Выход из ситуации один — прописывать подробную структуру взаимодействия сайта с системой. Причем так, чтобы учесть и по возможности обойти те места, где баги всплывают чаще всего.
Что есть в админ-панели у администратора? А вот тут самое интересное! В админпанели мы разработали шахматку, но шахматку нетипичную — похожую на ту, что встречается в киноатеатрах, где зритель бронирует места онлайн.
Только при нажатии выводится информация о пользователе, который проживает в этой квартире.
Такое решение мы разрабатывали на самописном решении, созданном внутри студии. За основу был взят шаблон Inspinia, и для него написана переиспользуемая логика на PHP, чтобы оперативно решить задачу. Ниже поясним, почему так.
Практически вся работа, связанная с админками — серверная, над ней трудится бэкэнд. Она не предполагает кнопки, всплывашки и прочие красивости.
Но чтобы администраторам было удобно пользоваться админкой, мы подключили к серверной части визуальную, и табличная информация стала отображаться графически. Прямых способов реализовать такую штуку нет, поэтому мы шли окольными путями намеренно: backend-разработчик брал часть кода у frontend’а и переделывал его под свои данные.
Теперь мы можем кликнуть на ячейку, и у нас выведется информация о пользователе, который проживает в этой квартире. Оперативно провернуть такое на другой панели администратора вряд ли бы получилось.
Админ кликает на нужную квартиру и сразу видит все необходимое.
Кликнув на ячейку, можно:
- Забронировать апартаменты для клиента. На случай, если тот позвонил по телефону
- Загрузить договоры и акты в его личный кабинет
- Изменить информацию о квартирах и услугах (стоимость, количество, описание)
- Отследить поступление платежей и узнать, есть ли у кого-то долги
- Узнать, кто какие доп. услуги заказывал
- Добавлять объявления и актуальную инфу в новостной раздел
- Заблокировать квартиру на время ремонта, чтобы ее не могли арендовать
- В общем, админ может контролировать все, что касается наполнения сайта
Если, например, у арендатора не получается выгрузить какой-то документ из личного кабинета, он может позвонить администратору и сказать, мол, так и так — нет доступа. Администратор «достанет» этот документ через свою админку и скинет его клиенту. Все загруженные через админку выписки будут доступны в его личном кабинете.
Отдельно добавили таблицу для паркинга. Парковочное место закрепляется за каждым арендатором и фиксируется в договоре. Чтобы на чужое место никто не встал, марка и номер хозяина авто вносятся в карточку парковки.
Администраторам приходится держать в голове кучу важных нюансов. Наша админпанель как нельзя лучше решает эту проблему. Многие вещи, которые раньше отнимали время, сейчас решаются по клику.
Результат
Сайт для предоставления квартир на длительный и короткий срок — «Вэлко» — запустился! Проект показал свою востребованность — 152 из 154 квартир уже обрели своих жильцов. А работа администраторов, связанная с бумажной волокитой, теперь полностью перешла в онлайн. Считаем, что проект удался.