Кейс 03Каталог квартир с шахматкой и ипотекойКонцепт

Северный парк

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

Клиент: Застройщик, жилой комплекс в Минске
Срок разработки: 21 день
Год: 2026
Стек: Next.js, TypeScript, CSS Modules, Vitest

Первый экран сайта «Северный парк» на телефоне

01 Задача бизнеса

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

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

02 Решение

Каталог фильтруется по комнатности, цене, площади, этажу, корпусу и отделке. Состояние фильтров попадает в адрес, поэтому менеджер может отправить клиенту готовую подборку.

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

Страница квартиры содержит SVG-планировку, характеристики и ипотеку с уже подставленной ценой. Расчёт аннуитета и дифференцированного платежа покрыт тестами.

03 Ключевые функции

01
Шахматка корпусов
Корпус, подъезд, комнатность. Свободные, забронированные и проданные квартиры отличаются цветом.
02
Каталог с фильтрами
Комнатность, цена, площадь и сортировка. Результаты пересчитываются сразу, карточки и таблица переключаются.
03
Страница квартиры
Планировка в SVG, характеристики, срок сдачи и форма записи на просмотр.
04
Ипотечный калькулятор
Стоимость, взнос, срок и ставка. Платёж, переплата и необходимый доход считаются на лету.