За месяц разработали приложение для шоу «Пульс» от видеоблогера-миллионника Славы Бустера

Слава Бустер — популярный российский стример и видеоблогер. У Славы 4,5 млн подписчиков на твиче, 3,7 млн на YouTube, и еще несколько млн в разных соцсетях :) Сейчас он с командой выпускает разный контент, в том числе развлекательные шоу. За приложением для одного из них к нам и обратились.

Шоу «Пульс» — это викторина, где игрок должен успеть ответить на все вопросы за 1000 секунд. Участник побеждает, если в конце игры на его счету остается хотя бы одна секунда. Главная фишка шоу такая: датчик измеряет пульс игрока, и чем он выше, тем быстрее сгорают секунды. А значит, меньше времени остается на ответы. Только спокойный человек может выиграть, ведь чем больше волнуешься, тем чаще бьется сердце.

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

Для большей вовлеченности зрителей все-таки лучше показывать настоящие данные, а не имитацию. Поэтому решили сделать отдельное приложение, в котором:

есть интеграция с пульсометром и данные выводятся прямо на экран;

автоматически идет подсчет оставшихся секунд;

секунды отнимаются по специальному коэффициенту, который зависит от скорости пульса;

классная визуализация — в кадре важна картинка.

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

О Purrweb команда Славы Бустера узнала благодаря приложению «Мотиваторы!», которое мы задизайнили и разработали для звезд шоу «Импровизаторы». Понравился яркий и стильный дизайн приложения, да и сработала рекомендация :)

А супер-сжатые сроки проекта нас не напугали. Мы умеем делать цифровые продукты быстро и для стартапов, и для корпораций, и знаем, как найти идеальное техническое решение, чтобы успеть даже к самому жесткому дедлайну и при этом не потерять в качестве и бизнес-ценности.

Правда, кроме сроков, на этом проекте был еще один челлендж — бюджет. Но и тут мы придумали, как помочь Славе и реализовать задумку.

Как остаться в рамках ограниченного бюджета и сделать красиво 

Разработка полноценного веб-приложения с глубокой интеграцией датчиков и сложной игровой механикой потребовала бы больше времени и ресурсов, чем позволяли сроки и бюджет. Поэтому мы предложили оптимальное решение — технический прототип, способный закрыть все задачи шоу на этапе съемок.

Главная цель проекта — дать зрителю убедительную картинку в кадре, а не создавать полнофункциональный продукт для широкого использования. Для этого не нужно сложное приложение — достаточно продуманного прототипа с настоящей логикой работы.

В отличие от интерактивных макетов, наш прототип реализован на уровне кода:

• в него заложен готовый дизайн;

• работает механика связи между пульсом игрока и оставшимися секундами;

• настроена интеграция с реальным устройством (пульсометром).

Такой вариант полностью устроил заказчика и отлично подходил под нашу задачу: добиться нужного визуального и технического эффекта в кадре. И конечно, остаться в рамках ограниченного бюджета и соблюсти жесткий дедлайн.

Хотя проект был небольшим по срокам, в плане задач он оказался очень насыщенным. Вот что наши ребята сделали за месяц:

• разработали техническую архитектуру;

• настроили обмен данными с пульсометром;

• сделали дизайн с анимациями;

• сверстали экраны интерфейса;

• сделали отдельный экран для администратора (старт/стоп игры);

• реализовали игровую механику.

Хладнокровные и горячие сердца 🤍❤️

Работает приложение так. В нем предусмотрены две роли: 

1. Игрок — отвечает на вопросы

2. Админ — запускает игру, нажимает на паузу в конце раунда и отнимает секунды за неправильные ответы. Да, потерять их можно не только из-за бешеного пульса 🙂

Все начинается с подключения пульсометра. Далее декодер расшифровывает сигнал и передает данные в приложение. Чтобы все работало корректно, у датчика и приложения должен быть одинаковый API.

Игровой процесс построен на трех основных экранах:

• Экран с таймером — здесь отображаются оставшиеся секунды; счет изменяется в зависимости от действий игрока и пульса.

Здесь анимация без отсчета секунд: их добавили уже на этапе разработки.

• Экран с пульсом — показывает, как часто бьется сердце игрока.

Так выглядит фоновая анимация:

• Экран с вопросами — он разрабатывался на стороне команды Славы Бустера.

Когда игрок ошибается, админ вручную отнимает секунды — но даже если ошибок нет, пульс сам может «съедать» время: чем он выше, тем быстрее убывают секунды.

Игра завершается, если у игрока заканчиваются секунды или админ вручную завершает раунд.На экране «Game Over» показываются максимальный и средний пульс игрока, а также число пройденных раундов. 

Финальное демо получилось нестандартным 🙂 Обычно мы шарим экран, чтобы клиент мог видеть работу приложения. Но в данном случае это не имело смысла: ведь у нас целых три экрана, просто демонстрация их по очереди получилась бы не очень наглядной. Поэтому разработчик устроил мини-студию: поставил камеры, подключил пульсометр и взял на себя обе роли — игрока и админа.

Он был спокоен и невозмутим. Все могли в реальном времени наблюдать его пульс и видеть, как анимации и таймер реагируют на изменения. Получилось очень наглядно и весело!

Мы передали команде Славы готовый файл с приложением. Ребята остались довольны результатом: им понравилось, как все выглядит и работает. Это было именно то, что нужно для шоу! 

А чтобы увидеть, как именно смотрится приложение в кадре, просто включите один из выпусков шоу Пульс — на YouTube или в ВК видео. Нет, это не реклама 😀