Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

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

Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

ГК «Просвещение» — ведущий российский холдинг в сфере образования, досуга и развития, с 1930 года на рынке. Реализует комплексные образовательные проекты: издание печатного и цифрового контента, обучение детей и взрослых, повышение квалификации педагогов, оснащение всех типов образовательных организаций.

В России каждый взрослый учился, а каждый школьник сегодня учится по учебникам «Просвещения». Но это не единственное направление деятельности компании — сегодня «Просвещение» не только известное издательство учебной литературы, но и создатель цифровых образовательных сервисов, размещённых на образовательной платформе LECTA, разработчик игр и игрушек, а также организатор социально-образовательных и просветительских проектов для учёбы и развития — от дошкольного образования и школы, до методической поддержки педагогов. Помимо этого, в 2023 году онлайн-проекты «Родительский университет» и «Учитель.Club» получили почетные награды в сфере образования.

Нам предстояло объединить их на одном ресурсе, чтобы представить «Просвещение» как полноценную цифровую экосистему и рассказать пользователям обо всех её возможностях.

Задача — создать единую цифровую платформу

Изначально сервисы «Просвещения» существовали на отдельных сайтах и не были связаны друг с другом. Некоторые создавалась много лет назад и требовали модернизации. Вопрос переработки всей цифровой инфраструктуры назревал давно, и в 2023 году компания обратилась к АЭРО с целью создания объединённой информационной среды и единого «окна» доступа для коммуникации всех целевых аудиторий группы компаний, представления полного перечня продуктов и сервисов ГК «Просвещение», для того чтобы обеспечить:

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

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

В рамках этой задачи АЭРО требовалось создать корпоративную и пользовательскую части платформы.

Корпоративный сайт

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

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

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

Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

Пользовательский сайт

Пользовательская часть сайта состоит из двух частей — контуров — объединяющих взаимодействие всех клиентов «Просвещения» на один мультисервис.

Внешний контур — это основное цифровое пространство с единой точкой входа во все сервисы. На главной странице пользователь может выбрать свою роль: родитель, педагог, ученик или образовательная организация. И далее посмотреть, что полезного может предложить ему «Просвещение». Например, ученики найдут на сайте не только учебные материалы, но ещё смогут узнать о разных профессиях, подготовиться к ЕГЭ или послушать онлайн-лекции по искусству.

Из внешнего контура пользователь может легко попасть в e-commerce часть сайта (внутренний контур) — единый каталог с печатной продукцией, электронными учебниками, цифровыми сервисами (такие как «Начинайзер», «К школе готов» и т.п.), а также бесплатными материалами (аудиоприложениями, методическими пособиями и пр.).

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

Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

Навигация по большому числу сервисов

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

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

Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

Из-за такой супернавигации нам пришлось искать, где разместить остальные элементы, в частности кнопку каталога и бургер-меню. Поскольку боковое меню заняло привычное место кнопки каталога (справа от поисковой строки), мы решили сделать её слева — получилось немного нетипично, но всё равно рядом с поиском. Бургер-меню расположили под поисковой строкой.

Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

Продуманный пользовательский опыт

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

Вот как нам удалось улучшить пользовательский опыт:

  • Предусмотрели все возможные паттерны поиска. Клиенты «Просвещения» ищут образовательную продукцию по-разному: кто-то — в каталоге, кто-то — через поисковую строку, кто-то использует оба инструмента. Мы постарались сделать удобный поиск сразу для всех — много точек входа в каталог, скроллинг товаров, фильтры, сортировка, рекомендации. Неважно, как человек привык искать товар — он может это сделать из любой точки сайта и удобным ему способом.
  • Выделили характеристики товаров, важные конкретным пользователям. Учителя и родители выбирают учебники по разным критериям. Например, первые обращают внимание на содержание, книжный номер ISBN, соответствует ли учебник ФГОС и входит ли он в ФПУ. Такие характеристики мы для удобства выносили на первый экран.
  • Придумали нестандартный прием, чтобы показать горящие предложения. В каталогах часто делают большие баннеры для демонстрации долгоиграющих акций — нам же хотелось показать информацию, актуальную прямо сейчас. Поэтому мы добавили stories — небольшой баннер-листалку, который показывает, например, как подготовиться к новому учебному году.
Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»
Создание единой экосистемы образовательных сервисов, запуск пользовательского и корпоративного сайтов. Кейс ГК «Просвещение»

Технологии

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

IT-ландшафт ГК «Просвещение» построен на сервис-ориентированной архитектуре (SOA) и микросервисах. Backend разработан на PHP и Symphony, frontend — на vue.js, React и Next.js

Инфраструктура работает на основе сервисов Яндекс.Облако и описана в Terraform, процесс CI/CD построен через Gitlab. Для хранения данных используется кластерная управляемая база данных PostgreSQL. Для мониторинга — Яндекс.Мониторинг, Prometheus и Grafana.

Результаты

Для оперативности мы сначала запускали MVP с базовой функциональностью, а потом дорабатывали. В результате нам удалось создать объёмную цифровую платформу, которая объединяет все продукты и сервисы ГК «Просвещение», даёт её клиентам полное представление обо всех возможностях холдинга, а также обеспечивает удобный доступ в e-commerce часть.

По итогам работ заметно вырос трафик на сайт. Число уникальных посетителей увеличилось почти в 2 раза, по сравнению с 2022 годом. При этом количество прямых заходов стало больше в 2,8 раз, что свидетельствует о росте узнаваемости нового бренда «Просвещения».

11
Начать дискуссию