На главную
UX/UI-дизайнер
2026
Финансовая
поддержка
Фонд микрофинансирования субъектов малого и среднего предпринимательства, микрокредитная компания Санкт-Петербурга
Разработка удобного и интуитивно понятного интерфейса. Структура сайта должна соответствовать стандартам
цель
Figma
многостраничный
fond-mfo.ru
многостраничный
fond-mfo.ru
роли и команда
Менеджер
Полный цикл коммуникаций с заказчиком, сбор требований, график работ
UX/UI-дизайнер
Анализ конкурентов, дизайн макетов, адаптив, тестировка готового сайта
Верстальщик
Разработка на WordPress, адаптация под мобильные устройства
Арт-директор
Согласование решений, финальное ревью, помощь в коммуникации
роли и команда
Менеджер
Полный цикл коммуникаций с заказчиком, сбор требований, график работ
UX/UI-дизайнер
Анализ конкурентов, дизайн макетов, адаптив, тестировка готового сайта
Верстальщик
Разработка на WordPress, адаптация под мобильные устройства
Арт-директор
Согласование решений, финальное ревью, помощь в коммуникации
Анализ
  • Определение цели бизнеса, уточнение вводных и ограничений
  • Анализ конкурентов
  • Сбор данных из открытых источников
  • Формирование гипотез
вёрстка
  • Вёрстка главной страницы сайта на конструкторе WordPress
  • Тестирование и согласование
  • Сборка внутренних страниц
дизайн
  • Первый вариант дизайна главной страницы сайта
  • Внесение изменений
  • Адаптация страниц под мобильную и планшетную версию
ЭТАПЫ работы
Работа разбита на этапы, для каждого определены отдельные дедлайны
ЭТАПЫ работы
Работа разбита на этапы, для каждого определены отдельные дедлайны
Анализ
  • Определение цели бизнеса, уточнение вводных и ограничений
  • Анализ конкурентов
  • Сбор данных из открытых источников
  • Формирование гипотез
вёрстка
  • Вёрстка главной страницы сайта на конструкторе WordPress
  • Тестирование и согласование
  • Сборка внутренних страниц
дизайн
  • Первый вариант дизайна главной страницы сайта
  • Внесение изменений
  • Адаптация страниц под мобильную и планшетную версию
Сбор данных
Контекст
Государственная организация, выдающая займы бизнесу
Задача
Создать удобный сайт, повышающий доверие к компании и конверсию заявок на займы, проходящий проверки проверяющих организаций
ЦЕЛЬ
клиентА
Хочу быть уверен в надёжности фонда
Боюсь попасть на мошенников
Мотивирует наличие лицензий, отчётов, официальной информации и знаки доверия
ЦЕЛЬ
бизнесА
Увеличить конверсию в выдачу займа на 15%
Снизить отказы на этапе заявки на 25%
Нарастить портфель займов на 20% в год
Проходить проверки без штрафов
Ограничения
Требования закона к наполнению сайта
Ограниченный бюджет на разработку
Сбор данных
Контекст
Государственная организация, выдающая займы бизнесу
Задача
Создать удобный сайт, повышающий доверие к компании и конверсию заявок на займы, проходящий проверки проверяющих организаций
ЦЕЛЬ
клиентА
Хочу быть уверен в надёжности фонда
Боюсь попасть на мошенников
Мотивирует наличие лицензий, отчётов, официальной информации и знаки доверия
ЦЕЛЬ
бизнесА
Увеличить конверсию в выдачу займа на 15%
Снизить отказы на этапе заявки на 25%
Нарастить портфель займов на 20% в год
Проходить проверки без штрафов
Ограничения
Требования закона к наполнению сайта
Ограниченный бюджет на разработку
анализ конкурентов
Я провела анализ прямых и косвенных конкурентов с целью выявить эффективные паттерны привлечения и построения доверия пользователей
Плюсы
  • Наличие primary CTA рядом с оффером упрощает путь к оформлению
  • Быстрый свод ключевых цифр помогает принять решение «за секунды»
  • Сегментация по кейсам помогает пользователю понять релевантность продукта
  • В карточках CTA «Оформить онлайн» даёт прямой путь к конверсии
минусы
  • Нет подсказок «для кого» (ИП, ООО), сложно выбрать
  • Нельзя быстро сравнить условия разных кредитов
Плюсы
  • Вкладки позволяют пользователю быстро переключаться между темами
  • Пошаговая схема снижает неопределённость — пользователю понятно, что от него требуется
  • Визуальные карточки с иконками хорошо сканируются
  • Каждый блок фокусируется на одной выгоде, что облегчает выбор для разных потребностей
минусы
  • Отсутствие явной CTA‑кнопки (например, «Подать заявку») — затрудняет начало взаимодействия
Плюсы
  • Есть CTA‑кнопки — путь к конверсии присутствует
  • Ясный заголовок — сразу понятно, что предлагают; крупный визуал привлекает внимание
  • Сегментация выгод по кейсам — помогает быстро сканировать причины взять кредит
  • Короткие заголовки концентрируют внимание на ключевых преимуществах
  • Вкладки дают быстрый доступ к важной справочной информации
минусы
  • Отсутствуют явные доверительные маркёры (лицензия, регулятор, отзывы)
Плюсы
  • Чёткое обозначение ролей помогает ЦА сразу себя узнавать
  • Ключевые параметры (ставка, срок, схема погашения) вынесены в видимую зону
  • Калькулятор платежей — пользователь может подставлять числа и сразу получать расчёт
минусы
  • Перегруженный дизайн и слабый контраст, текст сложно читать
  • Красная кнопка и обводка выглядят как ошибка ввода данных
  • Маски в полях ввода не убираются автоматически при вводе своих значений
  • Таблица визуально громоздкая
Плюсы
  • Условия займа видны сразу, можно быстро оценить предложение
  • Вовлекающий текст на кнопке создаёт доверительный тон
  • Кейсы повышают доверие и показывают реальные результаты помощи
  • Сетка из карточек легко сканируется
минусы
  • Логотипы визуально конкурируют с контактами — фокус распылён
  • Красная подсветка условий вызывает тревогу
  • Слабое описание не даёт понять суть блока, теряется интерес
discovery
Исследовала пользовательский опыт с помощью данных в интернете: изучила статьи и материалы в интернете — как люди оформляют займы, на какие факторы обращают внимание при выборе МФО и что для них важно
Гипотезы
1
Мы предполагаем, что если все услуги будут отображены на первом экране, это повысит количество переходов к услугам, потому что пользователи сразу увидят релевантные предложения и начнут их изучать
2
Мы предполагаем, что если в карточках услуг сразу обозначить, для кого выдаётся займ, это повысит конверсию в целевые заявки, потому что пользователи быстрее найдут ассоциацию для себя
3
Мы предполагаем, что если на главной странице разместить блок с реальными историями успеха, это повысит уровень доверия и конверсию в заявки, потому что клиенты увидят примеры успешного опыта
4
Мы предполагаем, что закрепление меню с кнопкой «Подать заявку» увеличит процент заявок, потому что пользователи всегда будут видеть ключевое действие и смогут переключиться на подачу заявки
Гипотезы
1
Мы предполагаем, что если все услуги будут отображены на первом экране, это повысит количество переходов к услугам, потому что пользователи сразу увидят релевантные предложения и начнут их изучать
2
Мы предполагаем, что если в карточках услуг сразу обозначить, для кого выдаётся займ, это повысит конверсию в целевые заявки, потому что пользователи быстрее найдут ассоциацию для себя
3
Мы предполагаем, что если на главной странице разместить блок с реальными историями успеха, это повысит уровень доверия и конверсию в заявки, потому что клиенты увидят примеры успешного опыта
4
Мы предполагаем, что закрепление меню с кнопкой «Подать заявку» увеличит процент заявок, потому что пользователи всегда будут видеть ключевое действие и смогут переключиться на подачу заявки
Макет
Подбирали структуру, которая пройдёт все проверки и закроет задачи бизнеса
Обозначили сферы, убрав сложные формулировки
займы СМСП
сферы лёгкой промышленности
и дизайна
дизайн и лёгкая промышленность
Разместили все услуги на главном экране
настроили скролл для возможного расширения услуг
По желанию клиента истории успеха не стали выносить в отдельный блок
Кнопку для подачи жалоб сделали без акцента
Порядок выстроили по требованию закона и с учётом пользы для бизнеса
Большой блок с информацией разбили на разделы в аккордеонах
МОБИЛЬНАЯ ВЕРСИЯ
Проработала десктоп, определила общий тон и визуальную систему, затем выполнила адаптив
Что в итоге
Заказчик будет сам наполнять сайт, поэтому мы использовали простые блоки WordPress, чтобы можно было легко вносить изменения без дополнительной вёрстки. По спорным вопросам консультировались с верстальщиками
Проект доведён до релиза: согласованный макет внедрён на WordPress, ключевые страницы оперативно собраны в системе. Сайт запущен и стабильно функционирует
Соответствие нормативным требованиям подтверждено — штрафов за несоответствие не поступало
Что в итоге
Заказчик будет сам наполнять сайт, поэтому мы использовали простые блоки WordPress, чтобы можно было легко вносить изменения без дополнительной вёрстки. По спорным вопросам консультировались с верстальщиками
Проект доведён до релиза: согласованный макет внедрён на WordPress, ключевые страницы оперативно собраны в системе. Сайт запущен и стабильно функционирует
Соответствие нормативным требованиям подтверждено — штрафов за несоответствие не поступало
другие кейсы
На главную
Спасибо за просмотр!

Made on
Tilda