eSports → Дизайн и разработка

Собери свою Dream Team

Собери свою Dream Team — мини-приложение в Телеграме, где пользователь крутит колесо и собирает пятёрку игроков из участников турнира PW Shanghai Major 2024.

Задача: Превратить идею с колесом игроков в Телеграм мини-приложение.

Дизайн

Разработка

Dream Team

Турниры обычно освещают сухими новостями. Телеграм-канал CS2NEWS хотел к финалу PW Shanghai Major 2024 не пост про турнир, а интерактив — чтобы читатель сам поучаствовал, а не просто прочитал.

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

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

В CS2 команда — это пять игроков, у каждого своя роль. Я изучил, какие роли встречаются в командах, и выделил шесть основных.

Кнопка «Начать» запускает колесо с реальными составами всех команд мажора в Шанхае, которые я собрал сам. На выпавшего игрока пользователь выбирает одну из шести ролей, выбранная подсвечивается, и колесо крутится снова, пока не соберётся пятёрка с разными ролями.

Выбор ролиИконки ролей

Когда команда готова, приложение генерирует картинку для скачивания. Макет карточки делал я, а генерацию писала София. Если состав не понравился, колесо можно покрутить ещё раз.

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