Ипотечный калькулятор
Помогает оценить доступную сумму и подобрать ипотечную программу
Сбер · Домклик · 2024–2025
Единый кабинет ипотеки
Как мы синхронизировали четыре продукта и собрали из разрозненных интерфейсов один понятный путь покупки жилья
01 · Контекст
Ипотека – это
не один продукт
Сбер выдаёт больше половины ипотек в России. Но чтобы купить квартиру, клиенту нужно последовательно пройти четыре самостоятельных продукта.
Онлайн-заявка
Собирает данные заемщика, созаемщиков и документы, а затем выдает решение банка
Кабинет участников сделки
Объединяет покупателя, продавца, риелтора и застройщика до подписания сделки
Обслуживание ипотеки
Открывается после покупки и сопровождает клиента на всём сроке выплаты ипотеки
02 · Проблема
Процесс покупки жилья включал работу с 4 разными интерфейсами
Продукты развивались независимо:
в каждом появлялись свои паттерны, логика и визуальный язык.
03 · Первый подход
Собрать продукты из понятных модулей
Я предложил подход M&M’s — Mortgage and Modules. Каждый модуль решает одну задачу пользователя и может повторяться в любом из четырёх продуктов.
Мы собрали сквозную концепцию сразу для всего ипотечного пути — от первого расчёта до обслуживания кредита — и защитили её перед бизнесом.
Сценарии стали предсказуемыми: знакомая задача в новом продукте выглядела и работала так же, как на предыдущем этапе.
04 · Масштабирование
Подход вырос
в систему для всей компании
Мы проверили, можно ли масштабировать M&M’s дальше и описали интерфейс по аналогии со строением материи.
Компоненты дизайн-системы стали атомами, карточки и виджеты — молекулами, модули M&M’s — компонентами, а страницы продукта — готовыми сборками. Эта модель легла в основу глобального редизайна продуктов компании.
05 · Второй подход
Пять дизайнеров, один клиентский путь
Как дизайн-лид я собрал рабочую группу из пяти продуктовых дизайнеров. На регулярных брейнштормах мы смотрели и челленджили весь опыт клиента целиком.
01
Синхронизировать структуру страниц во всех продуктах.
02
Найти повторяемые модули и договориться об общих сценариях.
03
Полностью пересобрать онлайн-заявку
Разногласия превратились
в единые решения, а общая концепция – в задачи для каждой продуктовой команды
06 · Внедрение
Четыре продукта стали одним кабинетом
Мы пересобрали онлайн-заявку, синхронизировали её с калькулятором и привели web- и mobile-сценарии сделки к консистентному виду.
07 · Результат
>80%
обновлённых продуктов уже работают в проде