О проекте
Корпоративный сайт финансового брокера, 2023 год. В проект вошли главная, страница услуг, блог с шаблоном статьи и пятью материалами и форма заявки — каждая страница в четырёх брейкпоинтах: Desktop, Tablet, Small Tablet и Mobile.
Контекст
Клиент приходит не за гарантией. Он приходит с горящим тендером.
Владелец малого бизнеса ищет банковскую гарантию или кредит, когда сроки уже поджимают, а банк мог отказать. Он не разбирается в продуктах и не доверяет посредникам. Сайту нужно за несколько секунд сказать: «это решаемо, вот сумма и срок» — и дать короткий путь к заявке.
Цель 1
Объяснить продукт.
Гарантии, кредиты, лизинг, факторинг — на языке выгоды. Сумма, срок и ставка вместо банковских терминов.
Цель 2
Вызвать доверие.
Банки-партнёры, понятные этапы, ответы на неудобные вопросы и экспертные статьи.
Цель 3
Сократить путь к заявке.
Кнопка заявки в каждом смысловом блоке и короткая форма из трёх полей.
Структура
Главная работает как воронка
Порядок блоков повторяет вопросы клиента: «что вы делаете» → «а если у меня сложный случай» → «как это будет» → «что именно вы предлагаете» → «вам можно доверять?» → «остались вопросы». В конце — форма.
- Оффер
- О нас
- Сложные случаи
- Этапы работы
- Услуги и выгоды
- Банки
- FAQ
- Статьи
- Заявка
Вокруг главной — ещё три сущности:
Страница «Услуги»
Кредитование, банковские гарантии, лизинг, факторинг, тендерное сопровождение.
Страница «Статьи»
Лента и шаблон статьи, 5 материалов.
Компонент «Форма заявки»
Pop-up поверх любой страницы.
Концепция
«Зелёный свет» для бизнеса
Тёмный графит задаёт серьёзный тон, который ждёшь от финансов. Зелёный работает как сигнал «одобрено»: он отмечает только действия и важные цифры. Low-poly кристалл — метафора компании: сложную структуру мы раскладываем на понятные грани.
Сложные случаи
Говорим о «нам отказали» открыто
Главный страх клиента — отказ. Поэтому на главной есть отдельный блок о нестандартных ситуациях: стоп-факторы, сложности с заказчиком, нехватка времени. Клиент находит свой случай в списке и видит кнопку заявки прямо рядом.
1 · Язык клиента
«Заказчик не согласовывает текст гарантии», «отражён убыток» — формулировки из реальных обращений, а не из банковского регламента.
2 · CTA в каждой группе
Клиент узнал свою ситуацию и сразу видит «Отправить заявку». Не нужно листать к форме.
3 · Зелёная рамка
Тонкий акцентный контур собирает плотный текст в карточки и делает блок самым заметным на странице.
Этапы работы
Процесс без тумана
Четыре шага от заявки до решения банка. Объёмные 3D-иконки делают сухой процесс осязаемым и разбавляют тёмную страницу.
Услуги
Сумма, срок, ставка — в одном взгляде
На странице услуг каждый продукт описан одинаково: короткий текст и мини-таблица с ключевыми параметрами. Вкладки переключают направления без перезагрузки.
Четыре состояния страницы — по вкладке на направление: кредитование, банковские гарантии, лизинг и факторинг. Структура карточки продукта одна и та же, меняется только содержание.
На главной услуги собраны в сетку, а «Все услуги» выделены зелёной плашкой.
Доверие
Банки-партнёры и честные ответы
Логотипы крупных банков сразу снимают вопрос «а вы вообще кто». FAQ отвечает на неудобное: «почему нам отказали», «как выйти из чёрного списка», «что делать при блокировке по 115-ФЗ». Ответы раскрываются по плюсу, поэтому список остаётся коротким.
Статьи
Экспертиза как инструмент продаж
Блог закрывает вопросы ещё до звонка и работает на SEO. В карточке ленты — заголовок, лид, дата и большое фото. Шаблон статьи держит длинный текст в двух колонках: подзаголовок слева, текст справа. Так длинный материал легко сканировать.
Адаптив
Четыре брейкпоинта для каждой страницы
Сетка ячеек перестраивается с четырёх колонок до двух, а услуги превращаются в вертикальный список с крупной кнопкой «Все услуги». Оффер и кнопка заявки остаются в первом экране на любом устройстве.
Слева направо: Desktop, Tablet 1024, Small Tablet 932, Mobile 430.
Мобильные версии ключевых экранов: главная, услуги, статьи, форма заявки.
Заявка
Три поля до консультации
Email, имя и телефон, без выбора услуги и загрузки документов: остальное менеджер уточнит на звонке. Форма стоит в конце главной и открывается как pop-up с любой кнопки «Отправить заявку».
Результат
Сайт отвечает «да» раньше, чем клиент успел спросить: оффер с суммой и сроком в первом экране, отдельный блок для тех, кому уже отказали, и кнопка заявки рядом с каждым смысловым блоком.
В проект вошли 9 страниц и состояний — главная, услуги, блог, 5 статей и форма заявки, — каждая в 4 брейкпоинтах. Страница «Услуги» собрана в 4 состояниях, по одному на направление.
Данных о конверсии после запуска нет, поэтому эффект здесь не заявлен. Ниже — как я бы его измерил и что проверил бы первым.
Как измерить эффект
- Конверсия в заявку — доля визитов, закончившихся отправленной формой, отдельно для десктопа и мобильных
- Заявки из блока «Сложные случаи» — сколько отправок начинается с его кнопок; это прямая проверка главной гипотезы
- Доля отказов на первом экране — понятен ли оффер с суммой и сроком за несколько секунд
- Путь «статья → заявка» — продаёт ли блог или только приводит трафик
Что проверил бы первым
- Блок «Сложные случаи» на втором экране против текущего места — меняется ли конверсия, если клиент видит свою ситуацию раньше.
- Форма из трёх полей против формы с выбором услуги — растёт ли число заявок и не падает ли их качество для менеджеров.
- Мини-таблица «сумма, срок, ставка» — по записям сессий: читают ли её до кнопки или пролистывают.