Как мы разработали сайт для Финзачета, а ~1 500 000 человек прошли его за 2,5 недели

Рассказываем, как мы в ДАЛЕЕ вместе с Банком России запустили за 1,5 месяца самый массовый зачет по финансовой грамотности для россиян.

Финзачет — это ежегодный онлайн-зачет, который проводится по инициативе Банка России с 2017 года. Он нужен, чтобы привлекать внимание населения к теме финансовой грамотности. Зачет помогает понять, насколько хорошо человек управляет личным или семейным бюджетом, ориентируется ли он в финансовых продуктах и услугах, сможет ли распознать мошеннические схемы.

Мы в ДАЛЕЕ работаем с проектом с 2021 года. Сначала с нуля разработали сайт для Финзачета — от user journey до рекламного продвижения. В 2021 году меньше чем за три недели в нем приняли участие 600 000 человек, а на сайт зашли более 900 000 уникальных посетителей. В этом году переделывали дизайн и привлекали новые сегменты аудитории, а также работали над отказоустойчивостью сайта. В итоге добились почти трехкратного роста прохождений зачета. И все это — за полтора месяца.

Как мы утверждали требования к проекту

Как показывает статистика за 5 лет, аудитория у Финзачета большая. Он популярен у разных категорий пользователей — от школьников и студентов до начинающих инвесторов, бизнесменов и пользователей финансовых приложений. В 2022 году Банк России еще и решил привлечь новые аудитории:

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

Отсюда вытекает первое требование к дизайну:

Дизайн Финзачета должен быть универсальным: привлекательным и понятным и школьнику, и студенту, и взрослому, и пенсионеру

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

Дизайн и юзабилити должны побуждать пользователя делиться ссылкой со знакомыми

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

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

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

Так родилась идея, которая сочетает строгие шрифты и яркую палитру, характерную для продуктов ЦБ, с иллюстрациями. Яркая подача стимулирует вовлеченность и продолжительную коммуникацию. Дизайн захватывает внимание пользователя за счет контрастов. Оба года мы не отходили от общей концепции, хотя дизайн 2021 и 2022 годов сильно отличается.

В прошлом году изюминкой были 3D-иллюстрации. Объемная иллюстрация была подобрана практически для каждого блока в интерфейсе, чтобы сделать акцент и сфокусировать внимание пользователя.

Дизайн 2021 года

В этом году мы отказались от 3D, сделав акцент на графичности и флэтовых иллюстрациях, которые подсвечивают важную информацию. Помимо этого использовали цветовое кодирование на сайте. Каждый лендинг имеет свой акцент — желтый для личного, розовый — для семейного.

Дизайн 2022 года

Структура сайта и разделение аудитории

Финзачет делится на два направления — личный с разбивкой по возрасту и семейный. Это значит, что на сайт заходят разные аудитории, и при этом нужно стимулировать их вернуться и попробовать силы на семейном этапе.

В 2022 году Финзачет предполагал несколько типов заданий:

1. Для школьников (с разбивкой по 4 категориям);
2. Для взрослых (18-60 лет, плюс два типа вопросов в зависимости от уровня: базовый и продвинутый);
3. Для пенсионеров (60+ лет).

Возраст участника определялся на этапе регистрации и при входе в ЛК пользователь автоматически получает доступ к зачету своей возрастной категории. Таким образом, user flow не перекрещивался, структура сайта упростилась.

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

Информационная подача

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

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

Страница с результатами

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

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

Вот некоторые персонажи из тех, что присваивались пользователям

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

Сертификаты по итогам прохождения теста

Как мы готовили сайт к суточным нагрузкам 200 000+ пользователей

А теперь самое интересное. Финзачет — инициатива федерального уровня и не только на словах. После запуска Банк России задействовал множество ресурсов для привлечения аудитории: миллионные базы рассылок, собственные ресурсы, а также рекламных специалистов агентства СКОТЧ. Такие нагрузки требуют соответствующей подготовки платформы.

Суточная посещаемость сайта Финзачета на момент проведения составила порядка 230 000 пользователей. В час на сайте находилось ~20 000 пользователей. При этом логика сайта такова, что один пользователь генерирует сразу много запросов к бэкенду. Например, при выполнении зачета сохраняется каждый шаг.

В этом проекте мы использовали методологию 12-факторного приложения. Это значит, что база данных (БД), кэш и пользовательские сессии представляют собой подключаемые к бэкенду ресурсы. Балансировщики нагрузки распределяют пользовательский трафик на пул бэкендов. Его можно расширять добавлением новых серверов для обработки большего числа запросов.

Помимо этого мы использовали SPA с CDN и с кешированием частоиспользуемых элементов сайта. Это помогло:

1. Снизить нагрузку на бекенд, увеличивая эффективность обработки бизнес-логики;
2. Масштабировать все слои архитектуры независимо друг от друга, добавляя ресурсы по мере надобности;
3. Повысить отказоустойчивость сайта, ведь помимо больших суточных нагрузок, проект никак не ограничивает пользователей по количеству прохождений зачета.

Результаты

Финзачет проходил с 1 по 18 декабря 2022 года. Вот результаты в цифрах:

1. Среднесуточная посещаемость — 230 000 человек
2. Пиковая посещаемость — 425 000 пользователей за день
3. Общее количество посещений за все время работы проекта — ~ 3 525 000 пользователей
4. Общее количество прошедших зачет — почти 1 500 000 человек.

ДАЛЕЕ — диджитал-агентство с командой из 200+ специалистов, на рынке с 2005 года. Занимаемся разработкой больших корпоративных проектов разной сложности для гигантов рынка: Банк России, Nestle, МЕДСИ, Sandoz, Haier.