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

Булавкин Иван, Корпоративный университет РЖД

Контекст

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

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

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

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

С чем столкнулись?

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

Какие порталы были до редизайна?

1. Учебный портал: на него люди приходят, когда их отправляют на обучение в Корпоративный университет. 

Какие функции там были:

• Личный кабинет слушателя, в котором он может редактировать свои данные
• Отдельно вынесен блок “Мои достижения”: сколько курсов, тестов прошел слушатель, какой рейтинг, если в программе предусмотрен рейтинг
• документы об образовании (появляются через 10 дней после окончания обучения)
• Индивидуальный план развития
• Самооценка по корпоративным компетенциям
• Задания peer2-peer — с взаимной проверкой
• Очные программы, переведенные в онлайн-формат. Традиционно у нас были очные программы, которые формировались специально под конкретные задачи, например, программы кадрового резерва. После ковида мы перенесли все это в онлайн, и у нас на портале появились сложные программы, в которых есть и разные траектории, и рейтинги, и ИПР, и самооценка. Это достаточно сложные с методической точки зрения программы, но они в срочном порядке переводились в онлайн-формат, в результате появилось много временных решений — “костылей”.

2. Открытый портал

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

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

Мы решили, что пришло время навести порядок и идти в редизайн.

Что сделали? Этапы проекта

1. Анализируем и определяем цели. Описываем текущее и желаемое состояние системы, оцениваем трудозатраты.

Понятная документация — это очень важно, особенно когда все устроено так же сложно, как было у нас. Если ее нет (а чаще всего ее нет), то времени на анализ текущего состояния системы нужно заложить с запасом, чтобы адекватно описать, как все работает.

2. Проектирование и разработка новой архитектуры. Разработка frontend и backend архитектуры.

3. Разработка графического дизайна. Продумываем и создаем дизайн. 

Заметим, что чем больше согласующих эту графическую часть, тем дольше эта история будет продолжаться. Как мы поступили? Сделали маленький опрос в двух группах, показали несколько форматов этого дизайна. Выиграли два варианта. Мы взяли лучшее от каждого из них и дальше работали короткими итерациями: в понедельник дизайнер присылает несколько вариантов страницы, мы смотрим, согласуем, собираемся внутри отдела и “докручиваем”. К следующему понедельнику дизайнер рисует очередную страницу. И таким образом практически за месяц мы сделали весь дизайн.

4. Верстка страниц портала, тестирование. 

5. Переезжаем на продуктив. Обновляем портал, объединяем наши три прежние портала и запускаем в новом дизайне:

В результате:

• Единый портал с понятной структурой и планом дальнейшего развития
• Упрощение администрирования
• Удобное и понятное использование для сотрудников

Что будет происходить после запуска нового дизайна и наши рекомендации:

1. Ждите наплыва запросов. Закончить редизайн очень сложно. 
2. Больше кастомизации — больше работы. Если делаете кастомизацию — в штате нужно иметь разработчика. 
3. Документация. Подробная документация — это та вещь, которая должна быть обязательно в ТЗ, потому что это целый большой серьезный этап.