Перейти к содержимому
Антон ГончаровРазработчик ИИ-систем
RUEN

Веб-приложение · финансы · сравнение

Ипотечный калькулятор

Клиент агентства видит рекламные 4,9% и не понимает, что через три года платёж вырастет вдвое, а «Семейная» ему не положена без ребёнка до 6 лет. Калькулятор проверяет условия каждой программы по сделке и заёмщику, считает график со сменой ставки и показывает, одобрит ли банк такую нагрузку на доход.

Сценарий: Агентство недвижимости «Ключ» — вымышленное: подбор квартиры и ипотеки в Екатеринбурге.

Скриншот демо: Ипотечный калькулятор

Открыть демо

Открыть приложение

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

Приложение работает в браузере: на сервер ничего не отправляется.

Что показывает демо

  • Каталог программ: ставка, льготный период застройщика, минимальный взнос, лимит, тип жилья и условия заёмщика

  • Сравнение программ с причинами отказа и отметками «ниже платёж» и «меньше переплата»

  • Аннуитетные и дифференцированные платежи, пересчёт при смене ставки

  • График по годам с диаграммой, раскрытие по месяцам, выгрузка в Excel и печать

  • Досрочные платежи — разовые и ежемесячные, с уменьшением срока или платежа

  • Нагрузка на доход, максимальный кредит, нужный доход и налоговый вычет

  • Ссылка на расчёт и заявка брокеру с проверкой телефона

Как попробовать

  1. Посмотрите программы

    Для семьи с ребёнком подходят три из пяти; у «Вторичного жилья» видно, почему нет.

  2. Выберите «Ставку от застройщика»

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

  3. Добавьте досрочный платёж

    Во вкладке «Досрочно» — 500 000 ₽ через год сокращают срок и экономят на процентах; переключите на уменьшение платежа.

  4. Проверьте бюджет

    Уменьшите доход — нагрузка перевалит за 50%, и станет видно, какой кредит банк одобрит.

Без платных нейросетей

Банки, ставки и лимиты вымышленные, расчёт идёт в браузере. Заявка брокеру никуда не отправляется. В рабочем проекте каталог программ подтягивается из админки или API банка, а заявка с расчётом уходит в CRM.

Демо работает без API-ключей OpenAI, YandexGPT или GigaChat. Там, где рабочая система обращается к модели, стоит локальная заглушка с тем же интерфейсом — поэтому демо бесплатно, всегда доступно и ничего не выдумывает.

Что будет в рабочем проекте

  • Каталог программ из админки: ставки, льготные периоды, лимиты и условия заёмщика
  • Заявка в CRM с выбранной программой, графиком и ссылкой на расчёт
  • Интеграция с API банков или ипотечного брокера: предодобрение без визита
  • Виджет калькулятора на страницах объектов застройщика

Стек

  • React 19
  • TypeScript
  • Vite
  • Tailwind CSS

Основано на

Книги и дисциплины, идеи из которых работают в этом демо.

  • Книга · Джордж Сэмюэль Клейсон

    Самый богатый человек в Вавилоне

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

Комментарий от разработчика

Антон Гончаров

Разработчик ИИ-систем · Python

Для бизнеса

  • Клиент видит все программы сразу и понимает, почему часть ему не подходит, — до заявки, а не после отказа банка.
  • Рекламная ставка застройщика показана честно: с платежом после льготного периода.
  • Нагрузка на доход и вычет отвечают на вопрос «потяну ли я» — заявки приходят подготовленными.

Для разработчиков

  • График строится помесячно: аннуитет пересчитывается при смене ставки и после досрочных платежей.
  • Условия программ — данные каталога, проверка eligibility возвращает причины отказа текстом.
  • Расчёт в браузере, состояние в ссылке и localStorage; 15 тестов на математику.

Советы

  • Совет 01

    Храните ставки вне вёрстки: ЦБ и банки меняют их чаще, чем выкатывается сайт.

  • Совет 02

    Нагрузку на доход считайте по платежу после льготного периода — банк смотрит именно на него.

Нужен такой же для вашего бизнеса?

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

Написать в TelegramОставить заявку

Другие демо в этом разделе

Все демо

  • Веб-приложение · распознавание речи · нейросеть в браузере

    работает

    Голосовая заявка

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

    • React
    • TypeScript
    • Нейросеть в браузере

  • Веб-приложение · звонок в браузере · распознавание и синтез речи

    работает

    Голосовой оператор доставки

    Робот принимает заказы по телефону вместо администратора: слушает, переспрашивает, проверяет адрес по зонам доставки, считает сумму и читает заказ перед подтверждением. Звонок идёт прямо в браузере — кнопка «Позвонить», без номера телефона.

    • React
    • TypeScript
    • Нейросеть в браузере

  • Веб-приложение · распознавание речи · контроль отдела продаж

    работает

    Речевая аналитика звонков

    Звонок отдела продаж превращается в расшифровку по ролям, оценку по скрипту и заполненную карточку сделки: клиент, контакты, интерес, озвученная цена, следующий шаг и задача менеджеру. Речь распознаёт Whisper прямо в браузере.

    • React
    • TypeScript
    • Нейросеть в браузере

  • Веб-приложение · документы · DOCX и PDF

    работает

    Генератор КП и договора

    Менеджер заполняет анкету сделки — покупатель, товары, скидка, НДС, — а коммерческое предложение, договор поставки и счёт собираются на листе A4 на глазах. На выходе — Word, PDF или JSON.

    • React
    • TypeScript

  • Веб-приложение · B2B · КП в PDF

    работает

    Конфигуратор цены

    Менеджер собирает заказ на все окна квартиры: тип, размер, створки на схеме, профиль, стеклопакет и цвет. Правила производства проверяются сразу, скидки и рассрочка считаются сами, КП с номером уходит в PDF.

    • React
    • TypeScript

  • Веб-приложение · смета · PDF

    работает

    Калькулятор сметы ремонта

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

    • React
    • TypeScript

  • Веб-приложение · витрина · чекаут · заказы

    работает

    SPA-каталог на React

    Магазин целиком в браузере: поиск с подсказками и исправлением раскладки, фасеты с живыми счётчиками, ссылки на любой фильтр, избранное, корзина с промокодом и чекаут с выбором слота доставки. Заказы видны в «Моих заказах» со статусами, их можно повторить или отменить.

    • React
    • TypeScript

  • Машинное обучение на Python · работает в браузере

    работает

    Аналитика отзывов с маркетплейсов

    Отзывы с Wildberries, Ozon и Яндекс Маркета через API продавца: модели scikit-learn определяют тональность и о чём пишут покупатели, тревога поднимается в первую неделю всплеска жалоб, новые темы находятся сами, а ответ уходит обратно через API площадки. Модели обучаются прямо в браузере.

    • Python
    • React
    • TypeScript

  • Виджет для сайта · нативный JS · одна строка

    работает

    Виджет AI-консультанта

    Консультант для любого сайта, который ставится одной строкой: отвечает по базе знаний со ссылкой на источник, собирает заявку и зовёт оператора. Написан на чистом JavaScript без фреймворков — весь виджет 21 КБ в gzip.

    • Нативный JS

  • Виджет для сайта · нативный JS · заявки

    работает

    Квиз-форма заявки

    Квиз вместо длинной формы: шесть вопросов с ветвлением, в конце — расчёт по прайсу. Менеджер получает заявку с оценкой «горячая / тёплая / холодная» и источником рекламы, а вкладка «Аналитика» показывает, на каком шаге уходят люди.

    • Нативный JS

  • Backend на Python · вебхуки → amoCRM и Битрикс24

    работает

    Интеграционный хаб заявок

    Заявки с сайта, из рекламы, звонков, почты и ботов приходят на вебхуки, приводятся к одному виду, проверяются на дубли, распределяются по менеджерам и доставляются в amoCRM и Битрикс24 — с повторами, когда CRM недоступна.

    • Python
    • React
    • TypeScript