Корпоративный сайт для лизинговой компании

К нам обратилась компания, которая занимается лизингом автомобилей, техники и оборудования — от легковых машин до сельхозтехники и спецоборудования. Бизнес активно развивается, и клиенту потребовался надёжный цифровой инструмент для презентации услуг и работы с заявками.

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

— запустить собственную цифровую площадку для продвижения лизинговых услуг;

— получить дополнительный канал для привлечения новых клиентов и партнёров с возможностью масштабирования под рост бизнеса;

— повысить узнаваемость компании на рынке, усилить конкурентные позиции и укрепить лояльность к бренду.

Примечание: проект под НДА, поэтому кейс не содержит никаких графических материалов.

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

Перед стартом работ клиент прислал объёмный документ с подробными требованиями к функционалу сайта. Изучив техническое задание, взяли в работу страницы для первого релиза и провели по ним конкурентный анализ. Исследование помогло понять, как другие компании подходят к организации контента: какие блоки используют, какой функционал размещают, на чём делают акцент.

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

Например, один из важных с точки зрения бизнеса разделов — «Спецпредложения» — содержит акции от производителей и дилеров, государственные программы субсидирования лизинга и внутренние продукты компании. Для удобного изучения предложений разработали фильтр по предметам лизинга и маркам техники.

После согласования прототипов сразу отдавали их в дизайн, чтобы ускорить процесс разработки. Дизайн собирали на основе дизайн-системы, предоставленной клиентом. Для отдельных макетов и блоков самостоятельно готовили 3D-графику.

За восемь недель с момента старта сотрудничества наша команда:

— изучила бизнес-функциональные требования для MVP;

— провела две сессии интервью с бизнесом для обсуждения возникших вопросов и синхронизации в требованиях;

— сделала конкурентный анализ;

— спроектировала ключевые страницы и формы, включая главную страницу сайта, разделы «Компания», «Контакты» и форму заявки;

— собрала мудборд и подготовила концепцию главной страницы;

— разработала дизайн внутренних страниц и адаптивные версии для мобильных устройств и планшетов.

Этап включал в себя:

— бизнес-анализ;

— исследования пользователей;

— составление CJM и МИО;

— построение информационной архитектуры;

— проектирование интерфейсов;

— подготовку дизайн-макетов и адаптивов.

→ Бизнес-анализ

Начали с серии бизнес-интервью с представителями компании из разных отделов. Общались со стейкхолдерами, топ-менеджером по стратегическому развитию, с сотрудниками из отдела продаж и клиентского сопровождения. Интервью помогли погрузиться в бизнес-процессы компании, определить ответственных за ключевые этапы и выявить потребности, которые можно решить с помощью сайта. Ответы разложили на схемах в Figma.

→ Исследования пользователей

Выделили две ключевые роли: клиенты и агенты (лизинговые брокеры). Подготовили методологию исследования, в которой прописали цели и задачи, критерии отбора респондентов, вопросы для интервью.

Отдельно составили анкету для скоринга респондентов, по которой внешнее агентство подобрало для нас необходимых людей. Целевая аудитория была достаточно узкой. Нужно было найти ИП или представителей юрлиц, которые недавно брали лизинг и проходили весь процесс от выбора лизинговой компании до получения техники самостоятельно. В крупных компаниях за разные этапы работ отвечают разные люди: один за поиск лизинговой компании, другой за документы, третий за получение и ввод в эксплуатацию.

Для проведения исследования агентов необходимо было найти действующих специалистов, открытых к диалогу, при этом не сотрудничающих с нашим клиентом или хотя бы не имеющих его в качестве основного партнёра в брокерском портфеле.

С каждым респондентом провели глубинное интервью и по результатам ответов составили для каждой роли детальную карту пользовательского пути (CJM). Помимо основных показателей карты, дополнительно включали в каждый шаг цитаты с интервью, чтобы на презентации подсвечивать важные моменты словами респондентов.

Далее из каждой карты составили для клиента и агента модель информационных ожиданий (МИО). Зафиксировали для каждой роли:

— вопросы, на которые человек хочет получить ответ

— действия, которые он может совершить.

Метод помогает составить список необходимой функциональности на сайте для достижения большинством пользователей их целей.

CJM-ки и модели информационных ожиданий стали основой для создания информационной архитектуры проекта. Помимо основных разделов и подразделов она содержала названия контентных блоков, перечень функционала на страницах и кнопки действия.

→ Личный кабинет клиента

Начали работу с элементов навигации, затем перешли на внутренние страницы. В основном разделы состояли из табличных интерфейсов, в каждом из которых фокус на своей ключевой информации.

Учитывали максимальное и минимальное наполнение информации, пустые состояния. Кроме того, добавляли в местах, где это уместно, маркетинговые блоки: на калькулятор, заявки, дополнительные услуги.

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

— информация о транспортном средстве;

— условия лизинга;

— финансовые показатели компании;

— условия поставки.

Завершающим этапом была подготовка стартовой страницы — дашборда. Она содержит наиболее важные блоки для клиента:

— список ближайших платежей;

— статус оплат;

— активные заявки на лизинг;

— заявки на услуги.

→ Личный кабинет агента

По структуре и информации кабинет агента схож с кабинетом клиента, но есть и различия.

Например, все агенты перед тем, как получить доступ к кабинету, проходят процесс аккредитации. Без него работать в кабинете не получится. При этом для ИП, ООО и физических лиц спроектированы разные сценарии, которые основываются на юридических аспектах работы каждой организационно-правовой формы.

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

И, конечно, фокус в личном кабинете агента на значимой для него финансовой информации — комиссии, выплаты, лимиты. Это всё прозрачно и наглядно можно посмотреть на стартовой странице кабинета.

На базе проведённых исследований и бизнес-целей компании доработали существующие страницы и создали новые.

→ Калькулятор лизинга

Спроектировали и встроили в сайт функционал, который предлагает пользователям рассчитать предварительную стоимость лизинга онлайн. В процессе разработки калькулятор претерпел немало изменений. Вместе с клиентом обсуждали, какие предустановленные параметры показывать и какие критерии выводить в итоговом расчёте.

Основные требования, которые предъявлялись, — простота в использовании, вариативность расчётов и наглядность для пользователей.

→ Предметы лизинга

Разводящая страница, которая содержит перечень техники по категориям:

— для малого и среднего бизнеса;

— для крупного бизнеса.

Также на страницу добавились блоки про программы лизинга и процесс оформления заявки, чтобы предоставить пользователям достаточное количество информации для принятия решения.

→ Легковые автомобили

На этапе проектирования совместно с клиентом продумывали логику и порядок контента. Так, страница содержит блок с акциями и программами господдержки, чтобы сразу обратить внимание пользователей на выгодные предложения.

Есть несколько форм захвата, под разные потребности целевой аудитории:

— рассчитать предварительную стоимость через калькулятор;

— оставить заявку на специальные условия или помощь в подборе.

→ Корпоративным клиентам

На данной странице представлены условия лизинга для крупных компаний.

Страница содержит информацию о преимуществах, решениях для крупного бизнеса, видах лизинга, графиках платежей, программах субсидирования и порядке оформления транспорта в лизинг. При клике на карточки предметов финансирования появляется дополнительная информация о льготных программах для продукта и позициях банка в соответствующих рейтингах.

→ Дополнительные услуги

Страница содержит информацию о дополнительных услугах для клиентов компании, цифровых сервисах, правилах лизинга.

→ Субсидии

На данной странице представлен перечень программ господдержки с функцией фильтрации по предмету лизинга. Для каждой программы были разработаны графические материалы, соответствующие дизайн-системе компании.

→ Главная страница

После завершения работ по внутренним страницам, добавили на главную новые блоки: предметы лизинга и калькулятор стоимости.

Для блока с предметами лизинга в процессе работы делали несколько вариантов отображения. От бизнес-группы было требование — показать на главной все категории техники. В финальном варианте остановились на компактном слайдере.

В каждой плашке с техникой зашита мини-анимация, для которой мы раскладывали композицию на отдельные элементы, чтобы верстальщикам было удобно настраивать взаимодействие.

В рамках первого релиза запустили в сжатые сроки новый сайт, который позволил заказчику продвигать услуги финансовой аренды на собственной площадке. Пользователи стали быстрее находить компанию в поисковых системах, а на самом ресурсе собрана информация о деятельности компании, её услугах и спецпредложениях.

***

Второй релиз начался с исследования целевой аудитории. На основе глубинных интервью разработали CJM клиента и агента, составили информационную архитектуру с перечнем ключевой информации и функционала. В рамках него же у сайта появилось два личных кабинета: для клиента и агента. В них можно проводить расчёты, управлять заявками, подключать услуги, получать необходимую информацию в разрезе договоров.

***

Третий релиз дополнил сайт новыми разделами (предметы лизинга, корпоративным клиентам, субсидии, дополнительные услуги). Появился лизинговый калькулятор, который позволяет получать предварительные расчёты.