Как создается html5 видеоигра

Джентльмен из космоса на своем космическом корабле, приглашает вас играть. И как только вы решитесь, то обнаружите, что управляете этим кораблем, уворачиваясь от пуль и стрельбы нападавших, которых не так уж и мало. Так начинается новая html5 игра сайта видеоигр Spritted, под названием War Games: Space Dementia.  “Появилась вот такая идея, потому что я хотел создать тематическую игру — Аркадную экшен игру. Мне очень нравится Robotron 2084; она кажется простой и увлекательной, поэтому именно от нее мне и пришло вдохновление ”, - объясняет Эдуардо Ортега, руководитель проекта Spritted, который, вместе со своей командой, решил открыть все секреты и объяснил, каким образом они создают видеоигру.

У Эдуардо, который описывает себя как "приверженец видеоигр, которому нравится простая и прямая игра, а именно классическая игра", появилась идея создания  War Games: Space Dementia , как "Аркадной игры, простой и удобной ". Первым шагом в творческом процессе игры — это определение идеи, и как только она определена, она переходит в сценарий, то есть в то, в чем она будет состоять. Для этого, команда, занимающаяся разработкой игры, должна собраться вместе и установить план.

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

Страсть и вдохновение, музы игрового дизайна.

Даниэль Пенья отвечает за создание персонажей и придание физической формы вещам внутри игры. Дизайнер Spritted ранее работал в рекламных агентствах, но его пристрастие к видеоиграм, в конечном итоге, привело его к их разработке. Этот молодой человек из Вальядолида рассказывает, что идея создания War Games: Space Dementia пришла ему во время прослушивания песни эпохи восьмидесятых: ‘Avalon’ от Roxy Music. Принимая во внимание название и по одобрению Эдуарда Ортеги, он решил создать персонажи вокруг легенды о короле Артуре и рыцарях Круглого Стола. 

Первоначальным названием игры было Defenders of AVA, но он подумал, что, возможно, ее будут сравнивать с поп-группой ABBA и изменил его на Knights of Space, чтобы не создавать путаницы. Тем не менее, в конечном итоге, он выбрал нынешнее название, опираясь на коммерческие цели. "Название Knights of Space было в некой мере данью Стражам Галактики Marvel", -объясняет Пенья, отмечая, что он интегрировал этот маленький значок в дизайн логотипа.
Процесс проектирования, на удивление, довольно классический. Даниэлю всего лишь необходима бумага и карандаш для создания эскизов. И как только он имеет четкое представление и удовлетворен результатом, он их сканирует и отправляет в Illustrator. Это программа Adobe, которая позволяет переводить в цифровую форму созданные иллюстрации. Иллюстрации были вдохновлены, помните, королем Артуром. "К1-АРЗ на борту своего корабля XK-LIBUR, чтобы защитить три сектора, которые окружают KM-LOT”; так описывает Пенья аргумент War Games: Space Dementia и объясняет, что К1-АРЗ - это галактическая версия короля Артура.

Он также говорит, что эстетическое вдохновение для этой игры ему пришло от иллюстратора и “отца” комикса Hellboy, Майка Миньола, и от его отличительных, противоречивых тонов, отсутствия цвета и полигонов, с которыми он, как правило, работает. А также от влияния таких классических аркадных игр восьмидесятых годов, как Tron, Asteroids или R-Type.

Программирование, скелет видеоигры.

Сосредоточившись на своей страсти к простому геймплею, Ортега предложил программисту свою идею создания простой и одноэкранной видео игры на выживание. Давид Сантин рассказывает, что он создает игры с одиннадцати лет, и в настоящее время является разработчиком видеоигр Spritted. Когда менеджер проекта дал задание этому молодому мадридцу создать игру, вдохновленную Robotron 2084, ем сразу же пришла на ум игра Smash TV.

Давиду всегда нравилась эта классическая аркадная игра, наследница Robotron 2084, поэтому он решил проследить динамику Smash TV для создания War Games:Space Dementia. Игра Robotron вышла в 1982 году, и целью игры было устранить роботов, которые восстали против людей в 2084 году и сохранить жизнь выжившим. Позже, в 1990 году, была создана Smash TV , в которой цель выживания была такой же: участник телевизионной программы из будущего должен убить нападавших и собрать ‘powerups’.

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

В случае War Games: Space Dementia, игра с самого начала планировалась с учетом вида сверху, поэтому они остановили свой выбор на кораблях, чтобы избежать создания восьми положений, которые необходимы для создания движения человека: спереди, сзади, со стороны, и т.д. "Если вы создаете танк или самолет, с видом с высоты, так как они без головы и без шеи, то просто необходимо сделать sprite", - утверждает Давид. Восемь положений требуют в восемь раз больше времени, как для программирования, так и для дизайна, потому, что каждое движение нуждается в коде.

Давид программирует в соответствии с дизайном, который ему предоставляет Даниэль.Они работают вместе и принимают решения вместе, хотя Давид отвечает за придание искусственного интеллекта каждому объекту игры, то есть определенное поведение. "Каждый тип судна имеет уникальное поведение и интеллект. Корабли нижних уровней, медленные и неустойчивее в движениях, а последние, наоборот почти не имеют места для ошибки и способны преследовать вас командой и предвидеть все ваши последующие шаги, " - говорит Сантин.

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

Конечно, одной из самых больших трудностей, с которой Давид столкнулся при создании War Games: Space Dementia, было получить хорошую производительность, несмотря на все движения судов, ракет, персонажей и т.д. игры. "Очень трудно найти на рынке html5 игры, где бы передвигалось много объектов одновременно и с хорошей производительностью ," - подводит итог Давид.

HTML5, универсальный язык?

Сантин объясняет, что "программирование в HTML5 имеет много трудностей, особенно в производительности, так, как она не такая мощная, как на родном языке, но имеет преимущество то, что она кросс-платформенная." Родной язык является типичным для конкретного процессора, и каждый имеет свой; Apple, Android и т.д. "Если вы запрограммируете приложение на родном коде, это приравнивается к тому, если бы это было сделано на «языке» устройства, поэтому нет необходимости "переводить "и все происходит быстрее."

Таким образом, мы можем сказать, что html - это язык понятен всем, но не является родным, поэтому он не будет столь эффективным. "Это то, что должен использовать общий язык, а каждое устройство должно интерпретировать потом на своем языке", - говорит Давид.

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

На самом деле, играя с мобильного телефона у вас такое ощущение, будто вы управляете космическим кораблем. И все это благодаря динамике двойного джойстика, характерного для SmashTV и Robotron 2084. И благодаря тому, что Phaser , который является Framework, используемый Давидом для программирования игры, просто додал в игру plug-in двойного джойстика, без создания его с нуля.

"Phaser является Framework, что сводится к набору целевых структур для разрешения проблем. В частности Phaser направлен на создание видеоигр", - говорит Сантин. Отвечает за управление sprites, введение звуков, и имеет инструменты для создания игр, и ориентирован на предоставление высокой эффективности

Несмотря на то, что первоначальной идеей Эдуардо Ортега было создание простой игры на выживание и с одним экраном, что позволило бы играть до бесконечности, результат оказался совсем другим. Увидев потенциал игры, и уделив время (признаются, что совпало с летом), создатели пошли дальше и в конечном итоге создали html5 игру, гораздо более развитую и более усовершенствованную. Одним словом, игру космических кораблей, разделенную на три зоны, где главный герой должен противостоять пяти типам врагов, которые атакуют по-разному и побеждить монстра. Это и есть магия видеоигр и механика создания.

Статью написала Паула Хиль Алонсо.