Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

На днях закончился очередной этап масштабной всероссийской акции «Урок цифры», темой которого в этом году стала разработка игр. Специально для неё мы создали тренажёр, где, двигаясь по сюжету, школьники 1-11 классов смогли попробовать себя в роли разработчиков, художников, аниматоров, геймдизайнеров, тестировщиков, маркетологов — и даже основателей компании.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Помимо методологических и технических подробностей разработки профориентационного тренажёра. Помимо признаний в том, какой «Урок цифры» крутой. Помимо всего этого, мы бы хотели рассказать вам историю одной игры, которая 11 лет назад открыла двери в игровую индустрию для маленькой студии из Пензы, а теперь делает то же самое для миллионов школьников со всей страны.

В 2007 году в BIT.GAMES началась трансформация из компании по созданию сайтов и рекламных баннеров в игровую компанию. У нас набралось достаточно экспертизы в работе на Flash, так что разработка игр стала вполне естестественным вариантом нашего дальнейшего развития.

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

Но платить зарплаты нужно было продолжать, и мы взялись за разработку нового проекта. Не то у нас подгрузились образы из детства, не то желание обратиться к чему-то доброму и родному — сейчас уже не вспомнить, но через пару недель перед нами лежали наброски идей мира Домовёнка, который убирается в доме, ругается с Кикиморой, дружит с Бабой Ягой и пытается перехитрить Кощея.

Скрин из документа по концепт-арту. 2010 год
Скрин из документа по концепт-арту. 2010 год

За три месяца нам удалось сделать первую релизную версию, и игра удачно вышла в свет накануне Нового года. Почти все новогодние праздники «Домовята» провисели в новинках игр на «Одноклассниках» и смогли набрать немалую стартовую аудиторию. Мы снова не были готовы к такому потоку, зависшим серверам и прочим прелестям большого онлайна. Но на этот раз сориентировались быстрее — и всё завертелось.

В течение 10 лет мы расширяли сказочный мир, вводили новых героев и локации, придумывали квесты.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

По истечение этого времени проект все еще жил, но уже не в полную силу. Flash начал стремительно устаревать, социальные игры окончательно проиграли мобильным: поддерживать игру становилось всё сложнее. С закрытием Flash мы планировали закрыть и «Домовят». Но не тут-то было. Игру спасли… фанаты.

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

Пришлось сдаться. К тому моменту мы уже присоединились к VK и именно поэтому Домовята перебрались в игровой стор MY.GAMES.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

«Домовята» стали нашей первой успешной игрой. Дальше было ещё множество проектов, в том числе выстрелившая спустя 4 года RPG «Гильдия героев». Но именно благодаря «Домовятам» мы научились делать игры и почувствовали, каково это.

И так вышло, что после обращения наших коллег из VK с просьбой сделать тренажер для тех, кто хочет почувствовать, каково это — делать игры, у нас не было сомнений — Домовёнок и его чудесный мир справится с этой задачей лучше всех. Ведь однажды у него уже получилось это здорово сделать с нами.

Команда, разработавшая тренажер

Вот уже два года мы в BIT.GAMES самостоятельно растим себе кадры в ИГРОХАБе — бесплатном образовательном проекте для тех, кто хочет в геймдев. Другого выхода нет: боль регионального найма поймут только те, кто в регионах нанимает.

История с тренажерами доказывает правильность выбранного когда-то пути: три разработчика, два художника и два аниматора, участвовавших в его создании, — как раз-таки выпускники академий ИГРОХАБа. Мало того — кураторами у ребят были те, кто годом ранее так же выпустился из наших образовательных проектов. Сейчас они выросли настолько, что способны полноценно курировать начинающих.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Да, вы всё правильно поняли: тренажер для школьников создали бывшие геймдев-школьники. За два месяца.

Как это было: методология

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

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Далее эта теория закреплялась практикой — теми самыми мини-играми. На весь проект их набралось 9 штук.

Важный момент — тренажер не был одним для всех. Мы сделали три разных подхода для трёх категорий школьников с задачей в том числе подсветить привычные школьные предметы и их непосредственную связь с игровыми профессиями. И в этой работе нам здорово помогли методисты из Учи.ру. Именно они подсказывали, что из множества наших идей гарантированно запомнится школьникам, а что тут же вылетит из головы. Когда стоит увеличивать теоретическую нагрузку и бомбить терминами, а когда важно только покликать, повертеть и насмешить. Тяжело, 14 лет разрабатывая игры, «обнулиться» и посмотреть на геймдев глазами первоклашки или 16-летнего подростка. Но совместно мы смогли.

1-4 классы

Для 1-4 классов тренажер раскрывает три основные игровые профессии: художник, аниматор и программист.

В мини-игре про художников ребята создают своего уникального Домовёнка из набора параметров: глаза, нос, рот, прическа, одежда, также можно подобрать локацию.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Нам повезло побывать на открытом уроке и увидеть, как это работает на деле, а не только по счётчику прохождений. Удивительно, но даже в таком юном возрасте уже виден индивидуальный курс каждого отдельно взятого ребенка: кто-то строго ориентировался на заданные референсы, кто-то хаотично подбирал образы и миксовал разные стили, а кто-то просто веселился и таким образом тоже постигал азы 2D-арта.

Дальше собранный уникальный персонаж переходит на следующую стадию — к аниматорам. Здесь мы тренировали чувство позы:

Умеющий бегать, приседать и прыгать Домовёнок теперь отправляется в зону визуального программирования. В нём важно включить игровую логику и на память воспроизвести последовательность команд:

А в финале тренажера — подводим итоги:

5-8 классы

Для ребят постарше добавляется больше профессиональных терминов и раскрываются дополнительные профессии: геймдизайнер, тестировщик, маркетолог. Мини-игры были сделаны по типу clicker — в этом возрасте детям прикольно щёлкать на скорость в условиях ограниченного времени.

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

Геймдизайнеры руками Бабы-Яги по аналогии с яйцеловкой вылавливали хорошие идеи, которые до этого обсуждали в теоретическом блоке с Марусей:

А маркетологи учились прилагать усилия, чтобы сделать игру популярной:

Видео по итогам блока:

9-11 классы

Здесь всё уже совсем серьёзно — погружение в продюсирование и менеджмент.

Для простоты мы разделили процесс на три части:

  • препродакшн,
  • продакшн,
  • постпродакшн.

Формат мини-игр был немного модифицирован: теперь они крепко вплетались в сюжет специальными игровыми окнами, в которых приходилось выбирать управленческие решения.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Будет ли это ААА-игра или казуальная? Провести корпоратив и сплотить коллектив или пока повременить? Взять на работу опытного спеца за дорого или начинающего за дёшево?

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Как верно распределить работу на дашборде и кто за что отвечает?

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

Видео по итогам блока:

Как это было: разработка

Разработка велась в Unity 2021 версии с интегрированным движком Fungus — он стал базой, где реализовывалась логика, диалоги и разветвление. В нём же запускались мини-игры, написанные с нуля. Плюсом — GIT для контроля версий и JavaScript для отправки данных на сервер.

Арт делали в Illustrator, анимацию — движения персонажей, VFX, idle, визуал локаций, комиксы — в Spine. Для лицевой анимации использовали технологию Rhubarb Lipsync — движения рта персонажа соответствовали ритму голоса. К слову, озвучкой тоже занимались мы: персонажи говорят голосами наших разработчиков, художников и админов.

Сложности: скорость интернета

Нам было важно, чтобы игра одинаково хорошо запускалась и в большой московской гимназии, и в маленькой школе села Поим, Пензенской области. За счёт текстур, спрайтов и видео тренажёр весил 160 МБ. Вроде бы это мало, но для наших целей — критично много. Мы перелопатили кучу документации, пережали текстуры и оптимизировали размер до 60 МБ.

За два дня до официального старта на тестовом запуске стало понятно, что игра всё еще тяжела для школьных компьютеров и сети, которая, помимо учебной части, занята всякого рода административкой. Мы сжали снова — до 30 МБ. Да, на экранах кинотеатров теперь не поиграешь, а вот в школе с самым медленным интернетом — вполне. А чтобы тренажеры грузились еще быстрее сделали поэтапную подгрузку и настроили CDN.

Но и это полностью проблему не решало. Поэтому мы дополнительно подстраховались рекомендациями для учителей:

  • Прогружать игру до начала урока.
  • Не проводить уроки одновременно на всех машинах. Хоть игра и весила крошечные 30 МБ, но при запуске на 60 устройствах одновременно эти 2 ГБ превращались в фаталити для многих школ.
  • Если совсем всё плохо — скачивать exe-файл и запускать с компьютера напрямую, без подключения к интернету. Маленький кусочек данных в этом случае отправляется только один раз — при получении сертификата.

Итак, за первые три дня после старта и наплыва сотен тысяч школьников мы смогли эту проблему укротить.

Баги и костыли

Отстреливать собственные баги и придумывать костыли приходилось и нам, а не только нашим ученикам. Иначе это было бы не совсем трушное геймдев-просвещение.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Последовательности в Fungus

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

  • Затемнение экрана в одном блоке и отсутствие затемнения экрана в другом, из-за чего вся игра ломалась;
  • Выход персонажа не в то время, не в том месте, из-за чего они все накладывались друг на друга;
Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве
  • Неправильная озвучка или озвучка, которая просто не останавливалась в нужный момент, из-за чего все говорили поверх друг друга;
  • Выдача неверных параметров в тренажере 9-11 классов из-за того, что какой-то из блоков не прошел проверку, и статистика просто не собиралась;
  • Движок не видел, что запускаются мини-игры, и продолжал диалоги героев поверх них.

Помимо этого, возникали проблемы с интеграцией Spine-моделей в проект:

  • Лысые домовята,
  • Коллизии,
  • При импорте из Spine задавались неверные размеры и пропорции персонажей, в связи с чем на сценах были не модели героев, а какие-то уродцы.
Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

Чтобы решить эти проблемы, мы постарались правильнее выставить скелет моделей. Для этого мы изучили систему смены скинов, отключили лишние кости, расширили функционал Spine SDK и Fungus, чтобы включать и выключать нужные анимации, а также в любой момент менять скины Домовёнка в зависимости от того, в каком виде он поступает в обработку после мини-игры «Художник».

Что с губами?

Использованный Rhubarb не всегда грамотно взаимодействовал с проектом: все губы героев были сделаны отдельным объектом, который мы цепляли на кости героев, импортированных из Spine.

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

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

Эта проблема решилась добавлением одной строки в скрипте прикрепления губ к модели Spine + более кропотливым и внимательным подходом к интеграции.

Много-много тестов

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве

В связи с интеграцией тренажера в webGL вылезало множество подводных камней:

  • У этого метода подгрузки в браузер статических картинок и видео не поддерживался iOS выше 14.8 версии. И хотя предполагалось, что большая часть прохождений будет именно со школьных компьютеров в рамках уроков, оставить без внимания тех, кто захочет потренироваться со смартфонов, мы не могли.
  • Видеофайлы в формате MP4 не запускались в одном браузере, но работали в другом. После смены формата вывода видеофайлов они начали запускаться в другом, но переставали в первом.
  • Передача информации из Unity webGL на сервер тоже оказалась непростой задачей: то людям выдавались неверные сертификаты, то пересылало не на ту страницу, то вообще не работало.
  • Черные экраны, вылеты, отсутствие загрузок, проблемы с отображением шрифтов — на каких-то устройствах это было, на каких-то нет.

Хорошо, что все эти проблемы проявились задолго до большого старта, и в этом непростом деле ловли мелких багов нас выручил BrowserStack. Мы бесконечно тестировали и оптимизировали готовые тренажеры на различных устройствах и версиях ПО. Это была самая скрупулезная часть нашей работы, но тем не менее — это был потрясающий опыт.

Итоги в цифрах — фактические

Тут мы хотим похвастаться:

  • 2 879 226 прохождений;
  • 85 регионов России приняли участие в проекте. Такому масштабу способствовала слаженная работа огромного количества людей из Министерства образования, Министерства Цифры и образовательного департамента VK;
  • 11 лет спустя игра «Домовята» омолодилась и обрела новое образовательное применение;
  • 7 начинающих игроделов сделали свой первый проект, который обучал еще более начинающих игроделов;
  • 2 месяца на полноценный тренажер с 9 мини-играми — знаем, умеем, практикуем.

Итоги в мыслях — философские

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

А ещё надеемся, что из этих миллионов:

  • сотни тысяч задумаются о том, что в игры можно не только играть — игры можно создавать;
  • десятки тысяч — попробуют программировать в Unity, рисовать в Photoshop, анимировать в Spine, считать баланс в Excel;
  • тысячи — создадут свои маленькие студии и сделают своих прорывных «Домовят».

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

Урок цифры: как мальчишки и девчонки, а также их родители профориентировались в геймдеве
2727
2 комментария

Обучение детей, дело хорошее, но не кажется ли вам, что с ростом возраста/класса стоит и несколько менять визуал?

1
Ответить

Определенно стоит. Это был наш первый опыт включения в образование, поэтому да – мотаем на ус 🙂

Ответить