+75% NPS и +9% SCI. Редизайн LMS-системы VK Education

VK Education — образовательная платформа VK для школьников, студентов, преподавателей и начинающих IT-специалистов.

На платформе обучаются десятки тысяч пользователей по 30+ направлениям, а более 1000 выпускников уже работают в VK.

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

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

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

Исследование и аудит платформы

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

На этом этапе сформировали CJM и User Flow для основных сценариев обучения.

Что выявили

• пользователям сложно ориентироваться между программами и дисциплинами;

• прогресс обучения недостаточно прозрачен;

• многие сценарии выглядели как система контроля, а не образовательная среда;

• визуальная система перестала соответствовать масштабу продукта.

Создание дизайн-концепции

Концепцию проектировали внутри дизайн-гайдов VK. Это позволило сохранить узнаваемость экосистемы VK и одновременно обновить визуальный язык платформы.

Сначала провели аудит существующего UI Kit:

• выделили компоненты для переиспользования;

• определили слабые места;

• собрали список недостающих элементов.

После этого разработали концепцию на двух ключевых сценариях:

• страница профиля;

• страница урока.

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

Что изменили

• обновили типографику;

• пересобрали сетку;

• переработали карточки;

• улучшили иерархию контента;

• сделали прогресс обучения более заметным;

• добавили больше визуальных ориентиров.

Перепроектирование ключевых сценариев

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

• ленту и образовательные программы;

• блоги;

• профиль пользователя;

• страницу дисциплины;

• страницу урока;

• чат;

• домашние задания;

• настройки профиля;

• систему коммуникации между студентами.

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

Масштабирование и систематизация

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

Это позволило сократить количество уникальных решений и сделать интерфейс более предсказуемым для пользователей.

Что передали

• дизайн всех ключевых разделов LMS;

• компонентную библиотеку;

• спецификации для разработки;

• дизайн-сценарии для дальнейшего развития продукта.

Редизайн помог сделать образовательную платформу более понятной и комфортной для пользователей. После запуска обновления команда VK Education зафиксировала рост ключевых показателей удовлетворённости:

— общий CSI вырос на 9%;

— индекс удовлетворённости новым дизайном превысил 75%.

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