В Царской России такое называлось «доходным домом». Правда, сайтов не было
Клубный дом «Вэлко» в Иркутске — уникальный для России проект. В нем сдаются квартиры на всех 17-ти этажах, без посредников и дотошных хозяев. Можно даже прописку оформить. Наша задача — разработать сайт. В кейсе рассказываем, чего больше всего боялась ЦА, какие фишки внедрили в админпанель и что с проектом сейчас.
![](https://habrastorage.org/getpro/habr/upload_files/722/da5/7d1/722da57d189dcfb92d6e067c606e6db4.png)
Сайт запустили в ноябре 2023 года. Часть функционала на данный момент еще дорабатывается и проверяется.
Немного предыстории
С заказчиком у нас сложилась долгая история. В 2021 году мы разрабатывали для Сервико-Авто корпоративное приложение, а через год компания пришла с другим запросом — создать сайт для клубного дома «Вэлко».
«Вэлко» помогает местным жителям и командированным в Иркутск арендовать квартиру на любой срок.
Это не подобие Авито, Booking и ЦИАНа. Фишка в том, что здесь сдается весь 17-этажный дом.
Квартиры отличаются планировкой и ценой. Те, что этажом выше — стоят дороже. Во всех квартирах сделан дизайнерский ремонт, есть мебель и бытовая техника. На территории — паркинг, детский сад, круглосуточная консьерж-служба и охрана с видеонаблюдением. Внутри зона ожидания гостей и курьеров.
Но и это не все — в «Вэлко» можно оформить временную прописку.
«Клубный дом — это новый формат цивилизованной и комфортной долгосрочной аренды жилья, без комиссий и посредников»
Виктор Захаров, директор ООО «Сервико»
Название происходит от английского «Welcome»
Цель состояла в том, чтобы разработать сервис, через который можно забронировать апартаменты. Для этого нужно продумать функционал:
Разработать личный кабинет для арендатора;
Разработать панель администратора;
Добавить возможность забронировать и отфильтровать квартиры;
Разработать функционал дополнительных услуг;
Настроить интеграцию с платежными системами и 1С;
Полностью автоматизировать документооборот.
С чем мы и справились.
![](https://habrastorage.org/getpro/habr/upload_files/bda/54a/4fa/bda54a4fa44aea703d169158740fabbf.png)
Что узнали, проведя предпроектную аналитику
У клиента болело одно, у арендаторов — второе, у администратора — третье. Вот, например, что было важно для будущих арендаторов:
Отсутствие предвзятости, как это часто бывает — никаких ограничений по полу, национальности и «парам нельзя»;
Возможность посмотреть и забронировать квартиру заранее;
Получить документы для работодателя;
Техника, мебель, хороший не «бабушкин ремонт»;
Возможность поселиться в квартиру с маленьким ребенком или шерстяным другом (последнего, кстати, здесь могут даже выгулять);
Чистота после прошлых жильцов;
Возможность заказать дополнительные услуги онлайн (многим неудобно беспокоить секретаря по мелочам);
Всегда получать актуальную информацию, связанную с отключением света и воды;
Оформить временную прописку, чтобы можно было отдать ребенка в детский сад;
Безопасность сделки.
![Те, кто никогда не снимал квартиру, боятся нарваться на мошенников и потерять депозит Те, кто никогда не снимал квартиру, боятся нарваться на мошенников и потерять депозит](https://habrastorage.org/getpro/habr/upload_files/f66/16e/f6c/f6616ef6c5f5b6f1575765856f45e1c0.png)
В «Вэлко» аренда максимально прозрачна. Нам важно было это показать.
Как зарождалась идея будущего сайта
Мы анализировали конкурентов: главными стали Авито, Airbnb, ЦИАН, Домофонд, Юла и Booking. Смотрели на все: визуал, структуру, навигацию и оформление. После этого начала вырисовываться общая картина со своими фишками.
Например, мы реализовали реферальную программу, подбор похожих предложений, доску объявлений и удобную форму оплаты, в которой цена просчитывается не абы как, а сразу за весь срок аренды.
Почему Клубный Дом — горчичный?
За основу брался брендбук клиента. Цвет отвечает политике гостеприимного дома: теплые оттенки горчичного расслабляют нервную систему и дают глазу отдохнуть.
![Квадрат — это жилец. А белый круг — забота и сервис Квадрат — это жилец. А белый круг — забота и сервис](https://habrastorage.org/getpro/habr/upload_files/74d/971/33b/74d97133b4190c32b2c2cbba3faa55ae.png)
Фирменный элемент родился так: мы объединили квадрат и круг. Квадрат олицетворяет жильца клубного дома. А круг — безопасное пространство, которое окутывает заботой и сервисом.
Фишка самого дизайна в интерактивности модели многоэтажки.
![По клику можно увидеть, что находится на территории По клику можно увидеть, что находится на территории](https://habrastorage.org/getpro/habr/upload_files/c2f/712/a49/c2f712a4922d2b27947d40875ef86044.png)
Мы отрисовали каждый полигон в Figma, а затем наложили поверх плана. И еще связали их с данными, которые передаются с бэкенда.
Это сделано для того, чтобы полигон менял свой цвет в зависимости от того, свободна квартира или нет
Как контактируют арендатор и арендодатель
Заехать в апартаменты день в день не получится, квартиру нужно забронировать заранее. Звонить никому не нужно — все происходит онлайн. У Клубного Дома нет горничных, которые обслуживают квартиры на постоянной основе, и перед заселением нового жильца сотрудникам нужно убраться и подремонтировать мелочи, вдруг где-то открутилась ручка?
![Если понравившаяся квартира уже в аренде, можно встать в очередь Если понравившаяся квартира уже в аренде, можно встать в очередь](https://habrastorage.org/getpro/habr/upload_files/1e3/55b/25d/1e355b25d4cbee0351a6b1090b49fb9f.png)
Перед бронированием надо внести залог 10 тысяч — сумма пойдет в счет месячной оплаты. За следующий месяц квартиросъемщику нужно внести уже месячный депозит. Он хранится на его балансе и возвращается при выезде.
![Сумма залога пойдет в счет месячной оплаты Сумма залога пойдет в счет месячной оплаты](https://habrastorage.org/getpro/habr/upload_files/60a/724/07a/60a72407a6bddaba6e26df1ca50e9bdd.png)
Если арендатор внес залог, но заезжать передумал (и такое тоже бывает), 10 тысяч сгорают.
Размер депозита зависит от того, если ли у арендатора домашние животные. Если человек заезжает с собакой, чек увеличивается в 1,5 раза.
Счет формируется в 1С. Арендатор может оплатить проживание через:
СберБизнес;
Юкассу;
по реквизитам;
QR-коду.
Вся финансовая история хранится в разделе «финансы».
С чем и зачем мы настроили интеграции
С платежными системами и 1С.
![Без этих ребят не было бы «Вэлко» Без этих ребят не было бы «Вэлко»](https://habrastorage.org/getpro/habr/upload_files/7dc/f52/17b/7dcf5217bff50a4fbe50f70595ea3fd7.png)
Юкасса и СберБизнес позволяют оплатить аренду и физическим, и юридическим лицам (а мы помним, что часть аудитории Клубного Дома — компании, отправляющие своих сотрудников в командировку).
Интеграция с 1С автоматизирует рутину:
хранит данные о ценах на квартиры, услуги и коммунальные платежи;
автоматически формирует счета на оплату;
записывает информацию о статусе проведенных платежей;
сохраняет данные об арендаторах.
Что может делать арендатор в личном кабинете
1. Запрашивать документы, выписки и чеки. Человеку не нужно стучаться в бухгалтерию, все бумаги он может запросить через ноутбук или смартфон, так как мы сделали еще и удобную адаптивную версию.
![Акты, договора и прочее нужное Акты, договора и прочее нужное](https://habrastorage.org/getpro/habr/upload_files/f1e/d4c/848/f1ed4c8486cc93f273a57c4753f3a6dd.png)
2. Контролировать финансы. В ЛК видно, какая сумма находится на депозите.
![Арендатор может следить за списанием и поступлением платежей Арендатор может следить за списанием и поступлением платежей](https://habrastorage.org/getpro/habr/upload_files/8a9/a0e/2c5/8a9a0e2c51fd4f9acde968d36b5ad406.png)
3. Видеть, сколько квартир уже забронировано и сколько арендовано.
![Может даже посмотреть дату заезда и выезда другого человека (для устранения разных проблем) Может даже посмотреть дату заезда и выезда другого человека (для устранения разных проблем)](https://habrastorage.org/getpro/habr/upload_files/f53/c29/94a/f53c2994a1f6917151d2e31efb58320c.png)
4. Заказать дополнительные услуги. Забронировать подземную парковку или попросить убрать квартиру.
![Кстати, своим жильцам «Вэлко» дарит доступ в закрытый тренажерный зал и релакс-зону Кстати, своим жильцам «Вэлко» дарит доступ в закрытый тренажерный зал и релакс-зону](https://habrastorage.org/getpro/habr/upload_files/214/79f/476/21479f476fd0803be86fd5d5a03eab16.png)
Что учли в панели администратора
А вот тут самое интересное! В админпанели мы разработали шахматку, но шахматку нетипичную — похожую на ту, что встречается в киноатеатрах, где зритель бронирует места онлайн.
![Только при нажатии выводится информация о пользователе, который проживает в этой квартире Только при нажатии выводится информация о пользователе, который проживает в этой квартире](https://habrastorage.org/getpro/habr/upload_files/701/f70/59a/701f7059a2369a093b861e60399c52bd.png)
Такое решение мы разрабатывали на самописном решении, созданном внутри студии. Позже мы перешли с этого решения на Orchid, почему — рассказали здесь. За основу был взят шаблон Inspinia, и для него написана переиспользуемая логика на PHP, чтобы оперативно решить задачи.
Практически вся работа, связанная с админками — серверная, над ней трудится бэкэнд (да простят нас разработчики, читающие кейс на Хабре) Она не предполагает кнопки, всплывашки и прочие красивости.
Но чтобы администраторам было удобно пользоваться админкой, мы подключили к серверной части визуальную, и табличная информация стала отображаться графически. Прямых способов реализовать такую штуку нет, поэтому мы шли окольными путями намеренно: backend-разработчик брал часть кода у frontend'а и переделывал его под свои данные.
Теперь мы можем кликнуть на ячейку, и у нас выведется информация о пользователе, который проживает в этой квартире. Оперативно провернуть такое на другой панели администратора вряд ли бы получилось.
![Админ кликает на нужную квартиру и сразу видит все необходимое Админ кликает на нужную квартиру и сразу видит все необходимое](https://habrastorage.org/getpro/habr/upload_files/038/7f6/d1b/0387f6d1b1b80eaab18c4e7e6fbc5711.png)
Кликнув на ячейку, можно:
забронировать апартаменты для клиента. На случай, если тот позвонил по телефону;
загрузить договоры и акты в его личный кабинет;
изменить информацию о квартирах и услугах (стоимость, количество и описание);
отследить поступление платежей и узнать, есть ли у кого-то долги;
узнать, кто какие доп. услуги заказывал;
добавлять объявления и актуальную инфу в новостной раздел;
заблокировать квартиру на время ремонта, чтобы ее не могли арендовать.
В общем, админ может контролировать все, что касается наполнения сайта.
Если, например, у арендатора не получается выгрузить какой-то документ из личного кабинета, он может позвонить администратору и сказать, мол, так и так — нет доступа. Администратор «достанет» этот документ через свою админку и скинет его клиенту.
![Кто забронировал 73-ю?) Кто забронировал 73-ю?)](https://habrastorage.org/getpro/habr/upload_files/7f6/db5/575/7f6db55759655936958adb5b25ff1a99.png)
Отдельно добавили таблицу для паркинга. Парковочное место закрепляется за каждым арендатором и фиксируется в договоре. Чтобы на чужое место никто не встал, марка и номер хозяина авто вносятся в карточку парковки.
Администраторам приходится держать в голове кучу важных нюансов. Наша админпанель как нельзя лучше решает эту проблему. Многие вещи, которые раньше отнимали время, сейчас решаются по клику.
И вот итог
Сайт для предоставления квартир на длительный и короткий срок — «Вэлко» — запустился в ноябре 2023.
P.S. Если соберетесь в Иркутск, вы знаете, где остановиться :)
Сейчас функционал дорабатывается и дополняется, но проект уже показал свою востребованность — 152 из 154 квартир обрели своих жильцов. А работа администраторов, связанная с бумажной волокитой, полностью перешла в онлайн.
Пишите в комментариях, что думаете об этом :) А чтобы не пропустить интересное, следите за нами:
Комментарии (3)
xi-tauw
18.01.2024 06:16+2Белый текст на светлом горчичном фоне выглядит прямо как противоположность "дать глазам отдохнуть".
GospodinKolhoznik
18.01.2024 06:16Ну в принципе всё логично. Объемы нераспроданного жилья побили исторический максимум. Но вместо того, чтобы снижать цены застройщики предпочитают из нераспроданной недвижимости делать доходные дома.
cry_san
-Если, например, у арендатора не получается выгрузить какой-то документ из личного кабинета, он может позвонить администратору и сказать, мол, так и так — нет доступа. Администратор «достанет» этот документ через свою админку и скинет его клиенту.
Как это может произойти? Приведите пример.