Образование в «Финуслугах»

Контекст

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

Роль

Единственный дизайнер раздела, вела и редактуру текстов. В команде — iOS- и Android-разработчики. Отвечала за навигацию, витрину, шаблоны экранов и новые форматы контента

Процесс

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

Ключевые решения

Главная раздела

Проблема: до нужного каталога пользователь проходил через несколько экранов, а витрина показывала не то, что нужно на входе

Решение: сократила путь до каталогов с 3 шагов до 1, вынесла на главную «Моё обучение» и прямые входы во все форматы — курсы, вебинары, эксперты, статьи. Второстепенное убрала вглубь

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

Карточки и каталоги

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

Решение: привела карточки к одному виду, упростила фильтрацию — она свернулась в компактную строку с модалкой вместо полэкрана, а в каталоге видно рейтинг, уровень и объём материала

Один тип карточки на все каталоги, отдельный вид «Моё обучение» с прогрессом по курсам и компактный фильтр в модалке

Раздел «Статьи»

Проблема: статей в приложении не было — короткий разбор темы можно было получить только внутри курса

Решение: добавила отдельный формат — каталог статей с фильтром по темам и детальную страницу с удобной вёрсткой, тегами и временем чтения

Новый каталог статей и шаблон страницы — теги, время чтения и вёрстка с подзаголовками

Архив вебинаров

Проблема: после эфира вебинар пропадал из приложения — пересмотреть запись было негде, хотя она сохранялась

Решение: разделила вебинары на будущие и прошедшие, добавила архив с записями. Эфир больше не теряется — к нему можно вернуться в любой момент

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

Отдельный экран архива — все прошедшие вебинары с датами и записями

Уроки: читаемость и обратная связь

Проблема: текст и картинки в уроках были свёрстаны плотно, читать тяжело. А собрать обратную связь по конкретному уроку было нечем

Решение: переверстала уроки — крупнее текст, воздух между блоками. В конце каждого урока добавила оценку по звёздам

Оценка урока стала новым каналом обратной связи — за первый месяц пользователи оставили 137 оценок

Тесты

Проблема: проверить, усвоил ли пользователь тему, было нечем — обучение заканчивалось последним уроком

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

Вопрос за вопросом, в конце — разбор каждого ответа с пометками «верно / неверно» и результат в процентах. Ниже 85% система предлагает пройти тему заново

Тёмная и светлая тема

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

Один и тот же экран вебинара в светлой и тёмной теме — макет один, палитры обе

Результат

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