Разработка презентационного сайта для финтех-компании Corefy

Для
Corefy
В 2020 году агентство Goodface разработало презентационный сайт для платформы Corefy. Клиент создал инновационный финтех-продукт, и одним из наших главных вызовов стал поиск способа простого объяснения сложной идеи и правильного стилистического решения.

О клиенте

Corefy — это универсальная многофункциональная платежная платформа для онлайн-бизнеса и финансовых учреждений. Она объединяет в себе более 650 провайдеров и более 400 платёжных методов. С помощью Corefy можно принимать оплаты или производить взаиморасчёты в любой валюте, из любой точки Земли, как каноническими способами вроде кредитных карт, так и криптовалютами. Отдельное преимущество системы — умная маршрутизация оплат, которая позволяет обеспечить минимальные комиссии для транзакций.

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

В 2018 году Corefy получил бронзовую награду PaySpace Magazine Awards в категории «Лучший техфин проект», а годом позже попал в тройку самых востребованных стартапов первого дня на WebSummit 2019 в Лиссабоне. В 2021 Corefy стал сертифицированным процессором Google Pay.

Задача

Изначально Corefy обратился в Goodface за редизайном сайта. Компания быстро развивается, поэтому сайт, хоть и был относительно новым, уже не отражал её реального масштаба и возможностей. Многих продуктов Corefy на сайте вообще не было. К тому же старый сайт устарел стилистически.

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

Процесс разработки

Структура

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

Важную роль в этом сыграла визуальная подача.

Визуальный стиль

У Corefy много продуктов, поэтому сразу было ясно, что сайт будет большим, а каждому отдельному разделу придётся уделить внимание.

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

Поскольку продукты Corefy концептуально сложны, их трудно объяснить пользователю просто текстами. Поэтому на старом сайте для этого использовались иллюстрации, явно навеянные заставкой сериала «Кремниевая долина», милого сердцу большинства стартаперов.

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

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

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

Недостатки старых иллюстраций:

  • сложности масштабирования;
  • сложное восприятие и понимание для пользователей;
  • ограничения в визуализации контента;
  • трудоемкость создания иллюстраций.


Преимущества новых иллюстраций:

  • простое понимание визуальной информации;
  • универсальность;
  • быстрая реализация;
  • современный стиль.


Изначально Денис (СЕО Corefy) хотел оставить иллюстрации. Ранее в них вложили много сил и энергии. Но при всей проработанности они уже успели устареть, при этом стиль иллюстраций ставил перед нами выбор: подстраиваться под них или пытаться пройти путь заново. Мы не склоняли клиента к тому или иному решению. Просто попробовали оба подхода — и в итоге поняли: новому сайту нужен свой голос.

Максим Якубович, CEO Goodface, руководитель проекта

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

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

Чтобы сделать иллюстрации еще более понятными и компактными, часть из них мы анимировали.

Сайт адаптирован под разные устройства, но в приоритете было мобильное представление — сейчас основной трафик идёт с мобильных.

Corefy постоянно добавляет новые продукты и услуги. Чтобы упростить доработку сайта, разработали дизайн-систему, которая позволяет команде дизайна быстро собирать новые страницы.

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

Руководство по фирменному стилю

Дружественность к поисковикам

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

Чтобы обеспечить быстродействие, мы реализовывали анимации для сайта с помощью кода на фронтенде.

«На этом сайте много анимаций, и все они сделаны кодом, а не видео — чтобы сократить скорость загрузки. На этапе фронтенда мы плотно взаимодействовали с SEO-командой Corefy. Большое внимание мы уделили оптимизации, многие страницы разогнали до показателя 98–99 на Google Page Speed».

Максим Якубович, CEO Goodface, руководитель проекта

Google PageSpeed Insights

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

Безопасность

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

Взаимодействие с клиентом

Работа требовала серьёзной вовлечённости со стороны Goodface. Для проекта мы выделили отдельную команду: 2 дизайнера, иллюстратор, 2 разработчика и менеджер проекта. Но и команда Corefy сыграла большую роль в этом проекте.

Мы выстроили взаимодействие в формате Agile team. При таком подходе клиент выступает в роли Product owner и является частью команды. Он непосредственно влияет на формирование списка задач, приоритизацию и составление требований к задаче. Это даёт клиенту гибкость в сроках и объёмах выполненных задач, ведь он сам непосредственно влияет на процесс разработки. Но, с другой стороны, он получает и обязанности в проекте: он должен наполнять задачи и создавать бизнес-логику.

Итоги

Результатом этого проекта стал большой презентационный сайт на 30+ страниц. Для представления сложного финтех-продукта была задействована графика, анимация, инфографика.

Сайт быстро загружается, несмотря на большое количество графики и анимации. Средняя скорость загрузки страниц, согласно Google Speed Search, составляет 85 для мобильных, 90+ баллов для десктопов, для некоторых страниц этот показатель равен 98–99.

В 2020 году этот проект занял 1 место на конкурсе Web Awards в категории «Банки, финансы, страхование».

Отзыв клиента

Связаться с нами

Cайт агентства www.goodface.agency Телеграм t.me/Goodfaceagency

·
837
·
goodsuper 7

Команда проєкту

Клієнт

Corefy
Corefy
Головна