Компания «Комус» продает офисные товары, бумагу и картон, упаковку, оборудование и мебель для офиса, технику, расходные материалы, товары медицинского назначения и пр. Компании принадлежат 7 фабрик в Подмосковье и других регионах России по изготовлению пластиковой упаковки, офисных товаров и бумажных изделий, а также собственный полиграфический центр и контакт-центр. Название «Комус» образовано от словосочетания «комплексные услуги». Основанный в 1990 году, бренд славится корпоративной культурой, вовлечением сотрудников и членов их семей в жизнь компании.
В Digital-агентстве VediTa для внутрикорпоративного портала компании «Комус» разработали веб-сервис для проведения новогоднего розыгрыша призов среди сотрудников компании, трансляции видео-поздравлений, викторины и моментальной лотереи. Программа состоит из 10 этапов, каждый из которых включает блоки трансляций видео-поздравлений, розыгрыша, викторины. На некоторых этапах дополнительно введен блок гран-при — розыгрыш особо ценных призов. Моментальная лотерея проводится самостоятельным разделом.
Трансляция мероприятий разделяется на заставки, 10 этапов и финал. Продолжительность всех мероприятий — от 3 до 4 часов. Возможные виды контента: видеоролики, заставки, музыкальные фрагменты, изображения призов.
Технические параметры:
-
Программная платформа для разработки панели управления — фреймворк Yii 2.0.
-
Утвержденная конфигурация сервера для обработки панели управления и публичной части, с возможностью масштабирования для повышения производительности.
-
Адаптация к высоким нагрузкам: трансляция видео должна корректно отображаться при совместной работе 12 000 пользователей.
-
Поддержка масштабирования контента на CDN-сервера компании без загрузки основного сервера лотереи.
-
Фоновая обработка победителей викторины по крону с занесением данных в БД.
Функциональные требования:
-
Видео должны проигрываться автоматически в соответствии с определенным в тайлмлайне порядком. Обязательно превью в соответствии со спецификацией HTML5.
-
Наличие прелоадера в текущий момент трансляции при перегрузке страницы.
-
Возможность управления звуком трансляции на стороне пользователя.
-
Поддержка трансляции статичного (страницы и скрипты) и медиаконтента (аудио, изображения, видео) в популярных браузерах на десктопах и мобильных устройствах.
Розыгрыш — блок каждого из 10 этапов лотереи, в процессе которого в режиме реального времени определяются и демонстрируются списки победителей и их выигрыши.
-
Пользователи должны видеть непрерывный процесс розыгрыша, анимацию списка участников и определения победителей, отображение выигранных ими призов.
-
Обязателен рандомный порядок отображения участников розыгрыша, чтобы сотрудники одного подразделения не следовали друг за другом по порядку.
-
Утверждается равномерно сбалансированный интервал отображения победителей, чтобы гарантированно провести награждение на каждом этапе.
-
Каждые несколько секунд строка с данными одного из сотрудников подсвечивается, он объявляется победителем, ниже появляется изображение и наименование приза.
-
Система должна программно корректировать время последовательного отображения, чтобы каждый победитель был гарантированно показан не менее 3 секунд.
-
В нижнем окне во время розыгрыша отображаются победители и названия их призов, есть возможность просмотра всех победителей.
Гран-при — блок этапа лотереи, определяющий розыгрыш особо ценных призов: например, автомобиля.
-
Пользователь должен видеть непрерывный процесс розыгрыша, анимацию определения победителя.
-
Список пользователей должен быть анимирован и двигаться в фото-окне снизу вверх. При выборе победителя его ФИО должно быть подсвечено, отображено фото приза и его название.
-
Результат награждения отображается в нижнем окне.
Викторина проходит на каждом из 10 этапов лотереи. В ходе викторины пользователи вписывают в веб-форму ответы на вопросы. Результаты обрабатываются автоматически по определенному алгоритму и отображаются на экране в режиме реального времени.
-
Для онлайн-викторины прописывается конкретное время для ответа.
-
Пользователь может ответить только 1 раз.
-
При введении данных сотрудника (ФИО, должность) они автоматически проверяются на клиентской стороне, и отправляются на обработку серверу Nginx только при соответствии ID пользователя в системе.
-
При введении ответов в веб-форме автоматически проводится корректировка автозамены Ё/е, удаление лишних пробелов, проверка на наличие / отсутствие латиницы и пр.
-
Отправка ответов контролируется сценарием на клиентской стороне. На сервер отправляются только правильные ответы, неправильные системой не учитываются.
-
Автор вопроса не может отвечать на собственный вопрос. Но он может стать победителем, если на вопрос не дали верного ответа.
-
Если правильных ответов несколько — определение победителей строится с учетом ранее полученных ими коэффициентов по заданным алгоритмам викторины.
-
При перезапуске призы для викторины должны быть распределены случайным образом и не повторяться.
Моментальная лотерея на первых 9 этапах розыгрыша отображается как инструкция для участников, а при наступлении 10 этапа — содержит выигрышные комбинации, которые участники сверяют с изображениями под стираемым слоем на лотерейном билете. Лотерейные билеты получают все сотрудники. Переход в лотерею — по кнопке в шапке корпоративного портала.
-
Моментальная лотерея запланирована на 10 этап трансляции, и до его наступления пользователь должен видеть только инструкцию для участников.
-
При перезапуске лотереи списки пользователей должны быть смешаны.
По завершении всех игровых мероприятий на экране застывает итоговая заглушка с поздравлениями с Новым годом.
Наша реализация отличается от существующих решений следующим:
1) Достаточно одной машины, на которой все крутится: БД, публичная часть, панель управления. Вертикальное масштабирование реализовано за счет увеличения ресурсов машины: в отличии от горизонтального масштабирования имеет предел за счет увеличения машин приложений, но подходит для решения конкретных задач. При этом выдерживает нагрузки значительно выше заданных, с минимальными используемыми ресурсами.
2) Является активным приложением, т.е. все функциональные звенья загружаются сразу и управляются через JS. Плюсом активного приложения также является экономия трафика.
3) Более четкая синхронизация процесса (расхождение не более 1 сек. на разных клиентах)
4) Более анимированное, при этом менее критичное к различным браузерам и ОС.