Разработка Frontend для ВТБ (Казахстан)
ВТБ (Казахстан) — дочерний банк международной финансовой группы ВТБ,
в состав которой входит более 20 кредитных и финансовых организаций
по всему миру. Группа ВТБ представлена в странах СНГ, включая Казахстан,
Армению, Беларусь и Азербайджан.
О проекте
Мы реализовали разработку и адаптацию клиентских интерфейсов сайта ВТБ (Казахстан).
Сайт предоставляет доступ к широкому спектру услуг: от оформления кредитных продуктов и использования расчетных сервисов до поиска ближайших офисов и подачи онлайн-заявок. Мы создали интуитивно понятный и функциональный интерфейс, который отвечает потребностям клиентов и соответствует высоким стандартам банковской отрасли.
Выполненные работы
Разработка и вёрстка
пользовательского интерфейса
Реализация интерактивных
элементов: калькуляторы,
формы, выпадающие списки
Адаптивная вёрстка
для мобильных устройств
и планшетов
Валидация форм и защита
через reCAPTCHA
Разработка карты отделений и
банкоматов с фильтрацией и
интерактивным выбором точек
Оптимизация
производительности
и кроссбраузерная поддержка
Кредитный
калькулятор
Онлайн-калькулятор позволяет быстро рассчитать параметры кредита: сумму, срок и ежемесячный платёж. Удобный интерфейс помогает пользователям подбирать оптимальные условия без посещения отделения.
Пользователь вводит сумму и срок кредита, выбирает
тип платежей (аннуитет / равные доли).
При нажатии на кнопку «Рассчитать» мгновенно отображаются: ежемесячный платёж, общая сумма выплат, переплата и сумма ежемесячного платежа.
В мобильной версии калькулятор собран в компактную вертикальную форму, а результаты расчёта отображаются мгновенно после нажатия кнопки.
Ежемесячный платёж, общая сумма выплат и переплата выделены контрастным блоком, что делает сценарий понятным даже на небольших экранах.
Заявка на кредит
Кнопка «Подать заявку на кредит» ведёт к расширенной форме, где пользователь заполняет необходимую информацию. Форма адаптирована под разные кредитные продукты и категории клиентов, что делает процесс оформления понятным и последовательным.
В зависимости от выбранного кредитного продукта динамически изменяются поля формы: вид продукта, диапазоны суммы и срока, а также текстовые пояснения. Это позволяет учитывать особенности разных программ кредитования, сохраняя при этом единую логику
и структуру заполнения.
Карта отделений
и банкоматов
На сайте реализована интерактивная карта, которая помогает быстро найти ближайшее отделение
банка, банкомат, кассу или POS-терминал. Каждая точка обслуживания отмечена маркёром,
при клике на который отображаются адрес, часы работы и контакты.
Дополнительно доступна фильтрация по категориям торгово‑сервисных предприятий (например, супермаркеты, кафе, аптеки, АЗС и другие популярные локации),
где установлены терминалы и банкоматы.
Информация отображается как на карте с интерактивными маркёрами,
так и в виде списков, что делает поиск удобным на любых устройствах.
Раздел залогового
имущества
На сайте реализован раздел с актуальной информацией о жилой
и коммерческой недвижимости, находящейся в залоге
Детальная страница
объекта недвижимости
Переход на страницу объекта открывает детальную карточку с описанием, фотогалереей, техническими характеристиками, а также контактами ответственного сотрудника.
Выполненные работы
Адаптивная вёрстка карточек с фотогалереей
Корректное отображение данных в списках и на страницах объектов
Удобная навигация и наглядная подача информации
Технические детали
При разработке интерфейсов мы использовали проверенные и надёжные
инструменты, чтобы сайт работал стабильно и был удобным для пользователей
Было реализовано важное
требование — работа в Internet
Explorer 10, что является очень
сложной задачей для
современных сайтов
В разработке использовался
ReactJS
Все интерфейсы имели
5 версий адаптивов
под различные устройства
для максимальной
совместимости
Другие кейсы