Как мы создали веб-игру для GeekBrains за неделю и привлекли 24 тысячи уникальных пользователей

Преодолеть преграды в игре, а затем — в учёбе и в жизни. Такую цель перед пользователями поставило агентство Go Mobile, создав игру для онлайн-платформы GeekBrains. В этой статье расскажем, как сделали увлекательную лендинг-игру на JavaScript всего за неделю и привлекли тысячи новых пользователей на образовательный портал.

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

Перед нами стояла задача создать игру, которая привлечёт на платформу новую аудиторию. Чтобы не просто создать трафик, а по-настоящему вовлечь аудиторию, мы добавили анкету. В ней пользователи рассказывали о своих предпочтениях и профессиональных планах, а в обмен получали скидку на обучение на подходящем им курсе.

Также пользователи оставляли на платформе контакты, чтобы принять участие в розыгрыше ценных призов от GeekBrains в стриме блогера Wylsacom.

Все началось с идеи. Мы хотели сделать игру, которая не просто развлекает, а вдохновляет на перемены. Стремились донести посыл: «Развивайтесь, несмотря на препятствия».

Мы искали интуитивно понятную механику, чтобы пользователь легко мог начать игру. При этом нам было важно вызвать азарт у пользователей.

Рассматривали два варианта механики. Первый: герой постоянно двигается и избегает опасные объекты (как в игре Flappy Bird). Второй: персонаж не даёт объектам упасть (вспомните электронную игру «Ну, погоди!», или «Волк ловит яйца»).

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

В нашей игре персонаж летает. На его пути возникают объекты, от них нужно уворачиваться. Управление простое: нажимаешь пробел — летишь вверх, отпускаешь — падаешь. Чем больше очков набирает игрок, тем больше скидка на курсы GeekBrains.

Подготовили три визуальные концепции: «Злые люди», «Хищники» и «Комната страха». В «Хищниках» и «Комнате страха» противниками стали выдуманные существа: антропоморфы или сверхъественные силы. В концепции «Злые люди» герой сталкивался с проблемами, которые близки пользователям, поэтому мы в итоге остановились на ней.

Главный герой — офисный сотрудник в супергеройском плаще. На протяжении пути он постоянно преодолевает препятствия. Всё как в жизни — хочется добиться большего, но что-то мешает:

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

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

На создание игры у нас было чуть больше недели, но мы всё успели и не поступились качеством. К моменту розыгрыша призов игра была полностью готова и много раз протестирована гоуллегами.

Помимо игры мы создали дизайн промоматериалов: баннеров и email-рассылки. Сохранили в них стилистику игры и усилили акцент на розыгрыше.

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

Анастасия Асташова, арт-директор

Кристина Симакова, проджект-менеджер

Диана Леймоева, иллюстратор

Никита Беляков, верстальщик-разработчик

Марина Науменко, копирайтер

Пётр Дремлюгин, джедай переговоров

Поиграть