Smart LMS Антон Мишин

Категория
Мастерство
Номинация
Дизайн вебсайтов
Компания
НИУ ВШЭ
Бренд
Smart LMS
Ссылка

Эта работа
в других
номинациях

UX, UI & Journey Design

Задача проекта

Модернизировать интерфейс образовательного сервиса Вышки Smart LMS в пользу удобства и нативности, проработка кастомного UI/UX решения на основе API Moodle

Идеи и решения

Smart LMS (Learning Management System) — это многофункциональная образовательная платформа для студентов и сотрудников НИУ ВШЭ. Система обеспечивает универсальный доступ к образовательным курсам, оценкам и разнообразным сервисам Вышки. Smart LMS создан на базе API Moodle, что было нашим новшеством. Раньше российские и зарубежные вузы, работавшие на базе Moodle, использовали широкий функционал сервиса, закрывая глаза на серьезные проблемы с структурой и дизайном интерфейса. Используя инструменты API, изначально разработанные только для мобильных устройств, мы создали веб-интерфейс, который буквально «надет» сверху на систему Moodle — данные из образовательной системы отображаются в кастомном стильном и минималистичном интерфейсе, разработанном на основе дизайн-системы Вышки. Но в ходе разработки интерфейса возникла серьезная проблема — Moodle постоянно обновляется, и мы никак не могли предугадать, где и когда появится новые плагины, так что при разработке внешнего интерфейса была велика опасность быть догоняющими, всегда оставаться в стадии разработки и отрисовки все новых фичей. Поэтому мы совместили две версии — наш интерфейс отображается там, где он уже отрисован и функционирует, а те сервисы и вкладки, где дизайн еще не готов, отображаются отдельными элементами внутри нашего UI в оригинальном мудловском виде. Аккуратный пользовательский интерфейс сделал Smart LMS более удобным и нативным. Оригинальным решением стал генератор изображений для каждого образовательного курса и предмета. Генератор включает в себя 10 цветов и 25 текстур, из которых создает индивидуальное изображение для каждого курса, в зависимости от области знания и направления, помогая юзеру быстро найти нужную вкладку на листе по визуальным признакам. Такой подход помогает создать позитивный и дружественный образ сервиса