Кейсы

ADPASS рекомендует материал к прочтению

Pyrobyte

16.11.2023, 09:52

Сдается дом! Как мы разрабатывали сайт для клубного дома — проекта, которому нет аналогов в России

Клубный дом «Вэлко» в Иркутске — уникальный для России проект. В нем сдаются квартиры на всех 17-ти этажах. Без дотошных хозяев и посредников. В каждой квартире есть все необходимое, а для того, чего нет, есть допуслуги. Наша задача — разработать сайт. В кейсе рассказали, какие боли выявили у ЦА, как автоматизировали документооборот и какие полезные функции добавили на сайт.

Хотели бы ощутить комфорт, находясь в длительной командировке? Или снять квартиру без посредников и назойливых хозяев? Или даже получить временную прописку? Если да, добро пожаловать в клубный дом «Вэлко»!

С заказчиком у нас вышла долгая история. В 2021 году мы разрабатывали для Сервико-Авто корпоративное приложение, а через год компания пришла в Пиробайт с другим запросом — создать сайт для клубного дома «Вэлко».

«Вэлко» помогает местным жителям и командированным в Иркутск арендовать квартиру на любой срок. Аналогов такого проекта в России нет. Это не подобие Авито, Booking и ЦИАНа. Фишка в том, что здесь сдается весь 17-этажный дом. Без дотошных хозяев и посредников. В каждой квартире есть все необходимое — мебель и бытовая техника, не говоря уже о дизайнерском ремонте. На территории находится паркинг, детский сад, круглосуточная консьерж-служба и охрана с видеонаблюдением. Внутри зона ожидания гостей и курьеров. Но и это не все — в «Вэлко» можно оформить временную прописку!

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

Виктор Захаров

Директор ООО «Сервико»

Название происходит от английского «Welcome».

Цель

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

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

Квартиры отличаются планировкой и ценой. Те, что этажом повыше — стоят дороже.

Предпроектная аналитика

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

Составили видение проекта. Анализируя стейкхолдеров (всех заинтересованных в проекте людей), мы выявили их самые злободневные боли. У клиента болело одно, у арендаторов — второе, у администратора сайта — третье. Посмотрите сами.

Провели анализ целевой аудитории. То есть будущих арендаторов. И вот что для них было важно:

Безопасность сделки;
Отсутствие предвзятости, как это часто бывает — никаких ограничений по полу, национальности и «парам нельзя»;
Возможность посмотреть и забронировать квартиру заранее;
Возможность получить официальные документы (например, для работодателя);
Все удобства — техника, мебель, хороший ремонт;
Возможность поселиться в квартиру с маленьким ребенком или пушистым другом;
Чистота после прошлых жильцов.

Проанализировали конкурентов и разработали структуру, по которой будет делаться прототип. Главными стали Авито, Airbnb, ЦИАН, Домофонд, Юла и Booking. Посмотрели, что они предлагают, проанализировали сайты, структуру, навигацию, оформление. Подглядели фишки и придумали свои. Например, реферальную программу, подбор похожих предложений, доску объявлений и удобную форму оплаты, в которой цена считается сразу за весь срок аренды. Но самой главной особенностью стала сама идея того, что у «Вэлко» сдается весь 17-этажный дом.

Прототип

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

На этом этапе мы развили идею главной фишки — интерактивной модели дома на главной странице.

Welco_Proto from Info Pyrobyte on Vimeo.

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

Дизайн

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

Теперь про фирменный элемент. Мы объединили квадрат и круг. Квадрат олицетворяет жильца клубного дома. А круг означает безопасное пространство, которое окутывает его заботой и сервисом.

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

Welco_Main from Info Pyrobyte on Vimeo.

Мы отрисовали каждый полигон в Figma, а потом наложили их поверх плана. И еще связали их с данными, которые передаются с бэкенда, чтобы полигон менял свой цвет в зависимости от того, свободна сейчас квартира или нет!

Как взаимодействует арендодатель и арендатор

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

Перед бронированием арендатору надо внести залог 10 тысяч — сумма пойдет в счет месячной оплаты. За следующий месяц ему нужно внести уже месячный депозит. Он хранится на балансе арендатора и возвращается при выезде.

Если клиент забыл про бронь, поленился ее отменить или просто не приехал, сумма сгорает.

Размер депозита зависит от того, если ли у арендатора домашние животные. Если человек заезжает с кошкой, размер депозита увеличится в 1,5 раза.

Николай

Аналитик Pyrobyte

Счет формируется в 1С. Арендатор может оплатить проживание через:

СберБизнес;
Юкассу;
Реквизиты;
QR-код.

Информацию о начислениях и списаниях можно посмотреть в разделе «финансы».

Что может делать пользователь в личном кабинете

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

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

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

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

С чем мы настроили интеграции

С платежными системами. С «ЮКассой» и «СберБизнесом», потому что арендовать квартиру могут и физические лица, и юридические. Изначально планировалась только СберОплата b2c. Но когда с нашей стороны было почти все готово, клиент попросил переехать на ЮКассу, так как первый вариант стал для них неактуален. Благо, что SCRUM, по которому мы работаем, позволяет внедрять что-то новое уже в процессе. B2b оплату мы сделали через СберБизнес.

С ЮКассой никаких сложностей не было.

У них четко описанная API и есть SDK, что очень упрощает интеграцию. В SDK заранее прописана вся логика, ее остается только внедрить в проект и протестировать. А вот со СберБизнесом пришлось попотеть.

СберБизнес убрали систему webhook. Информация о платеже теперь не возвращается на сервер в автоматическом режиме. Статус операции «выполнено», «не выполнено» приходится отслеживать вручную, потому что информация об оплате появляется только через 5–20 минут.

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

С системой 1С. Так как для компаний интеграция 1С с сайтом — демонстрация высокого уровня сервиса и основное условие эффективности, то мы не упустили этот момент. Да и упустишь его! Для «Вэлко» интеграция с 1С автоматизирует рутинные процессы, потому что:

Хранит информацию о ценах на квартиры, услуги и коммунальные платежи. Кстати, забыли сказать, что они тоже входят в счет месячной оплаты;
Автоматически формирует счета на оплату;
Записывает информацию о статусе проведенных платежей;
Сохраняет данные о арендаторах.

Но без подводных камней, конечно, никуда.

Чтобы воплотить все задумки, нужно подробно описывать методы и параметры, которыми сайт будет обмениваться с системой. В этом нет ничего сложного. Но нужно заложить дополнительное время на согласования действий со стороны заказчика и поддержки 1С. Бывали случаи, когда 1С выдавал ошибку в ответ на корректные данные — типичная логическая ошибка на их стороне. Но самый главный бич — долгие ответы системы на запросы.

Что это значит для нас, как для разработчика?

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

Во-вторых, нужно заложить время на ожидания исправления багов в самой системе от 1С.

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

Что может делать администратор сайта в админ-панели?

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

Управлять услугами. Устанавливать их цену, менять название и описание.

Отслеживать платежи и договор. В админке он может посмотреть статус операций и с какой платежной системы пришла оплата, а еще выгрузить подписанные договора.

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

Все загруженные через админку выписки будут доступны в его личном кабинете.

Что может делать администратор зала в админ-панели?

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

Обычно мы делаем все наши админки на одной платформе — Inspinia. Практически вся работа, связанная с ними — серверная, над ней трудится бэкэнд. Она не предполагает кнопки, всплывашки и прочие красивости.

У тебя есть список → ты нажал кнопку → произошло действие

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

Если кликнуть на нужную квартиру, сбоку откроется панель, в которой можно:

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

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

Что в итоге?

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

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

Дарья

Менеджер проекта

Если у вас есть вопросы, напишите нам!

Чтобы не пропустить интересное, следите за нами:

#IT и инновации #Недвижимость #Аренда жилья

Pyrobyte
еще 12 публикаций

Лучшее в блогах

27.04.2024

Чем полезен хороший контент для сайта компании и как его создавать

Вчера

Шрифтовые пары на все случаи жизни: большая подборка для ваших документов

Вчера

Продолжается прием заявок в кейсбук Influencer Marketing

Позавчера

Как организовать рабочий день фрилансеру: 5 советов правильного тайм-менеджмента

Вам понравится

SpaceWeb

26.04.2024

SpaceWeb сообщает о росте популярности контейнеризации

Digital IT и инновации

Хостинг-провайдер SpaceWeb фиксирует положительную динамику в распространении ПО для контейнеризации в веб-приложениях и микросервисах. Спрос на платформу Docker с Portainer вырос на 174%.

Platforma: big data для бизнеса

24.04.2024

Новые подходы: как измерять телеаудиторию с помощью Big Data

Маркетинг IT и инновации

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