Разработка интерактивной highload-платформы для Международного киберфестиваля RUKAMI
Клиент
Технопарк «Сколково»
Отрасль
Технологии
Технологии
Kubernetes, Laravel Framework, React, Sass, Node.js, PHP, SSR, TypeScript, Mobx, Socket.io, MySQL, Redis, GitlabCI, PWA
RUKAMI — это некоммерческий фестиваль идей и технологий.
В нем участвуют школьники и студенты, которые занимаются в кружках технического творчества. Проект объединяет тысячи юных мейкеров со всех уголков России и энтузиастов кружкового движения из других стран.
Завоеванные премии
Задачи
- 1.Разработать платформу
- 2.Запустить систему личных кабинетов
- 3.Реализовать игровую механику из техзадания
- 4.Обеспечить бесперебойную работу ресурса в дни фестиваля
Сложности
Сжатые сроки: 6 месяцев на объем работ, которые обычно занимают около года
Разработка высоконагруженной платформы с высокой степенью отказоустойчивости
Процесс
У фестиваля Rukami уже был сайт rukamifest.com. Но не был рассчитан на большие нагрузки. По сути, это был простой информационный сайт с минимальным функционалом.
А в 2020 году из-за коронавируса фестиваль перенесли в онлайн. Чтобы провести все онлайн-активности «по одному адресу», заказчик решил сделать из старого сайта сложную платформу с системой личных кабинетов, интеграцией с Youtube для прямых трансляций, игровыми элементами. Платформа должна была заменить собой полноценный офлайн-фестиваль и выдержать нагрузку в 50 тысяч посетителей единовременно.
Новый концепт
Сайт – это город будущего Метаполис.
В городе есть разные локации (они же - треки программы фестиваля): Гравити Холл, Диджитаун, Технокампус, Кибер-гарден, Тесла театр, Сайенс Хилл. А еще Трибуна для защиты конкурсных проектов, Квеструм с видеоквестом, Погружение (3D-инсталляция с музыкой), Галерея (выставка цифрового искусства), Метапорт с видео-экскурсиями, Селфипарк для селфи зрителей и многое другое.
Чтобы принять участие в онлайн-фестивале, пользователь регистрируется по email или через соцсети и начинает получать игровую валюту Метаполиса – метакоины. В дни проведения фестиваля их можно потратить на видеоквест и другие активности. Кроме того, количество метакоинов определяет место участника в общем рейтинге.
Как сделана платформа?
UI приложение на React содержит в себе пользовательский интерфейс для всех сервисов проекта: регистрации пользователей, личного кабинета, портала, активностей. Является точкой входа на проект для всех пользователей. Реализовано как SPA на React. Работает по HTTP/HTTPS-протоколу, запрашивая данных с бэкенд-сервисов через API.
Участники фестиваля могут общаться между собой, используя сервис обмена сообщениями. Это приложение с интенсивным обменом данными на Nodejs, с использованием фреймворков Express и Socket.IO. Сервис обмена сообщениями работает асинхронно по HTTP/HTTPS-протоколу, через WebSocket, напрямую взаимодействуя с базой данных.
Система личных кабинетов
Зарегистрированный пользователь может добавить свой проект на фестивальный конкурс, предложить спикера или другую активность в программу. Пользователь с правами администратора проверяет предложенные проекты и дает по ним свои комментарии, составляет публичную афишу, может выгружать базы данных, исправлять чужие учётки (менять роль пользователя).
Дизайн
Совместно с субподрядчиком наша команда проделала большую работу по разработке нового дизайна фестиваля. Только для регистрации дизайнеры подготовили 11 макетов. Вебпрактик работал над внутренней частью платформы, а Студия Лебедева отвечала за пользовательский дизайн.
Получилось две абсолютно разные концепции, которые предстояло подружить между собой. В итоге систему навигации с публичной части внедрили во внутреннюю часть платформы.
Для защиты платформы от DDoS-атак и ради повышенной отказоустойчивости микросервисы сайта были размещен в Yandex Cloud, файлы - в Yandex Object Storage.
Результаты
Интерактивная платформа, выдерживающая большую нагрузку;
2 дня бесперебойной работы;
220 онлайн-активностей;
28-29 ноября платформу посетили 60 тысяч зрителей.
Команда
Вебпрактик
Александр Букуров
руководитель проекта
Полина Герасимова
менеджер проектов отдела разработки
Иван Поддубный
руководитель отдела разработки
Сергей Волошин
Back-end teamlead
Анна Золотова
Front-end разработчик
Павел Воробьёв
старший Front-end разработчик
Константин Кулишов
старший DevOps инженер
Сергей Буланов
Back-end разработчик
Пётр Клёнкин
старший Back-end разработчик
Александр Гурнак
Back-end разработчик
Сергей Аверкиев
Back-end разработчик
Пётр Шкумат
Back-end разработчик
Мария Лапиева
старший Front-end разработчик
Антон Шевцов
Front-end разработчик
Сергей Близнюк
Front-end разработчик
Даниил Никонюк
Front-end разработчик
Дмитрий Волошин
Front-end разработчик
Олеся Прокопенко
Front-end разработчик
Мурад Саркаров
Front-end разработчик
Василий Яковенко
Front-end разработчик
Николай Цай
старший дизайнер
Анна Сластён
дизайнер
Роман Возный
контент-менеджер
Отзыв
Профессионализм команды позволил проекту Rukami в кратчайшие сроки организовать и провести в онлайне мероприятие с участием более 30 000 зарегистрированных пользователей. Были воплощены в жизнь наши самые невероятные идеи по вовлечению и удержанию молодежи на портале во время мероприятия, в том числе реализован сложный дизайн, созданный Студией Артемия Лебедева, разработана система регистрации и учета активностей посетителей и многое другое. Вместе нам удалось сделать онлайн-мероприятие интересным, вовлекающим и ярким»»