Jak tworzy się grę wideo html5

Rycerz z przestrzeni kosmicznej na swoim statku, zaprasza Cię do gry, a kiedy się decydujesz, nagle widzisz siebie prowadzącego statek kosmiczny, starając się uniknąć kul i strzelać do wrogów, których nie jest mało. W ten sposób rozpoczyna się nowa gra html5 na stronie gier wideo Spritted, o nazwie War Games: Space Dementia. „Pomysł ten narodził się, ponieważ chciałem stworzyć grę o tematyce akcji Arcade. Bardzo podoba mi się gra Robotron 2084; wydaje mi się być prosta i przyjemna więc pomyślałem, że właśnie na niej się zainspiruje”, wyjaśnia Eduardo Ortega, szef projektu Spritted, który chciał ujawnić wszystkie tajemnice i wraz z swoim zespołem, wyjaśnił jak postępują, aby stworzyć grę wideo.

Eduardo, który opisuje siebie jako “pasjonata gier wideo, który lubi prostą i bezpośrednią grywalność, jaką zapewniają klasyczne gry”, wpadł na pomysł stworzenia War Games: Space Dementia jako prostej i poręcznej “gry zręcznościowej”. Pierwszym etapem w procesie twórczym gry jest pomysł, a gdy jest on już ustalony, zostanie przekazany do skryptu, to znaczy omówienia o czym będzie dana gra. W tym celu, zespół który wdroży życie do tej nowej gry powinien spotkać się i ustalić plan, który będzie realizować.

“Gdy już jestem pewien, jaki rodzaj gry chcemy stworzyć, spotykamy się i tworzymy ogólny plan tego, z czego będzie składała się gra”, wyjaśnia Ortega. Wraz z nim pracują programista i projektant. Ten ostatni wykonuje pierwszy szkic interfejsu użytkownika, to znaczy menu, przyciski i przejścia między ekranami. Jest także odpowiedzialny za doświadczenie użytkownika, co składa się na „rozwinięcie całego ciągu ekranów i wydarzeń w sposób intuicyjny i przyjazny dla użytkownika” jak wyjaśnia Ortega. I ostatecznie rozwój gry, to znaczy ekrany, wrogowie, przedmioty itp., i cały ogólny szkic. Gdy projektant zrealizuje te wszystkie zadania i przedstawi je, czeka na zielone światło od Eduardo i w ruch wchodzą pozostałe czynności: szkice projektanta i pierwsze kody programisty.

Pasja i inspiracja, muzy projektu gier wideo.

Daniel Peña jest odpowiedziany za tworzenie postaci i nadanie formy fizycznej obiektom znajdującym się w grze. Projektant Spritted pracował wcześniej w agencjach reklamowych, ale jego pasja związana z grami wideo sprawiła, że obecnie je projektuje. Ten młody człowiek z Valladolid powiedział, że pomysł zaprojektowania War Games: Space Dementia przyszedł mu do głowy podczas słuchania piosenki z lat osiemdziesiątych ‘Avalon’ de Roxy Music. Na tej podstawie oraz po zatwierdzeniu projektu przez Eduardo Ortega, postanowił stworzyć postacie związane z legendą Króla Artura oraz o Rycerzach Okrągłego Stołu.

Pierwotny tytuł gry miał brzmieć Defenders of AVA, ale Daniel Peña pomyślał, że być może zrozumiany zostanie jako odniesienie do nordyckiej grupy ABBA i został zmieniony na Knights of Space, aby nie wprowadzać w błąd. Jednak ze względu na kwestie handlowe, wybrany został aktualny tytuł. Tytuł Knights of Space, który był hołdem dla Strażników Galaktyki Marvel” wyjaśnia Peña, który również przyznał, że dodał pewien akcent podczas projektowaniu logo.

Proces projektowania jest zaskakująco klasyczny. Daniel potrzebuje jedynie kartki i ołówka do tworzenia szkiców, a gdy już posiada jasną wizję i jest zadowolony ze swojej pracy, skanuje wyniki i przekazuje je ilustratora. Ten program Abdobe umożliwia na skanowanie ilustracji, które stworzył. Grafika, która została zainspirowana, pamiętajmy, na Królu Arturze. “K1-ARZ na pokładzie swojego statku XK-LIBUR powinien bronić 3 sektorów, które otaczają KM-LOT”; w ten sposób Peña opowiada historię War Games: Space Dementia i wyjaśnia, że K1-ARZ jest galaktyczną wersją Króla Artura.

Ujawnia również, że inspiracja estetyczna dla tej gry pochodzi od ilustratora i ojca bohatera komiksu Hellboy, Mike Mignola, i jego charakterystycznych kontrastowych odcieni, brak koloru i wielokątów, z którymi zazwyczaj pracuje. Poza wpływem klasycznych gier Arcade z lat osiemdziesiątych, takich jak Tron, Asteroids lub R-Type.

Programowanie, podstawa gry wideo.

Koncentrując się na swojej pasji związanej z prostą grywalnością, Ortega zaproponował programiście swój pomysł stworzenia gry wideo o przetrwaniu przy użyciu jednego ekranu. David Santín komentuje, że tworzy gry od kiedy miał jedenaście lat, a teraz jest twórcą gier wideo w Spritted. Kiedy menadżer projektu zlecił temu młodemu człowiekowi z Madrytu, aby stworzył grę zainspirowaną na Robotron 2084, od razu przyszła mu na myśl gra Smash TV.

David od zawsze lubił tę klasyczną grę Arcade i poprzednika Robotron 2084, tak więc postanowił podążać z dynamiką Smash TV w celu stworzenia War Games: Space Dementia. Roboton ukazał się w 1982 roku, ale celem gry było wyeliminowanie robotów, które zbuntowały się przeciwko ludziom w roku 2084 i ratowanie ludzi którzy przetrwali. Później, w 1990 roku, stworzony został Smash TV, którego cel przetrwania był taki sami: uczestnik programu telewizyjnego musi pokonać swoich napastników i gromadzić ‘powerups’.

“Zdecydowaliśmy się stworzyć grę statków, ponieważ jej rozwój był prostszy”, wyznaje David. Ponieważ jest to gra, którą obserwujemy z lotu ptaka, projektowanie statku kosmicznego widzianego z góry jest łatwiejsze niż tworzenie człowieka. David wyjaśnia, że tworzenie gry jest podobne do „narysowania małej animacji na rogach książki, a kiedy przewracamy strony rysunek ten nabiera życia; każda strona to sprite”. To czym nazywamy „sprite” jest równoznaczne z klatkami ze świata filmu. 

W klasycznym War Games: Space Dementia, gra od początku była tworzona z widokiem z góry, i właśnie dlatego wybraliśmy statki, aby uniknąć tworzenia się ośmiu stanowisk, które wymagają ruchu osoby: przód, tył, w bok, itd. „Jeżeli tworzysz czołg lub samolot, widziany z lotu ptaka, jako że nie ma on głowy ani szyi, jedyne co musisz zrobić to sprite”, wyjaśnia David. Osiem stanowisk wymaga osiem razy więcej czasu, zarówno dla programowania –ponieważ każdy ruch wymaga swojego kodu- jak i dla zaprojektowania.

David programuje według wzorów jakie otrzymuje od Daniela. Pracują ramię w ramię i wspólnie podejmują decyzję, chociaż David jest odpowiedzialny za przypisywanie sztucznej inteligencji do każdego obiektu w grze, to znaczy określonego zachowania. „Każdy rodzaj statku posiada swoje unikalne zachowanie i inteligencję. Początkowe poziomy są powolne i posiadają nieregularne ruchy, za to ostatnie nie posiadają wiele błędów i są w stanie śledzić Cię w drużynie i przewidzieć każdy Twój ruch”, wyjaśnia Santín.

Można zapewnić ruch i wyjątkowe zachowanie każdego obiektu w grze dzięki zarzadzaniu zmiennych, które tworzą Wszechświat, i według Santín „niektóre z tych zmiennych to prędkość, grawitacja, szybkość reakcji, siła strzału, życie, zdolność prowadzenia i automatyczny obrót”, 

Bez wątpienia, jedną z największych trudności z jakimi borykał się David podczas tworzenia War Games: Space Dementia było uzyskanie dobrego wyniku, pomimo ruchu statków, pocisków, postaci, itp. Które znajdują się w grze. „Trudno jest znaleźć na rynku gry w HTML5 zdolne do poruszania tylu obiektów jednocześnie, z tak dobrym wynikiem”, dodaje David.

Html5, uniwersalnym językiem?

Santín wyjaśnia, że “programowanie w html5 ma wiele trudności, w szczególności zakres wydajności, ponieważ nie jest tak wydajny jak język ojczysty, ale jego zaletą jest cross-platform." Język ojczysty jest typowy dla konkretnego procesora, a każdy z nich posiada swój; Apple, Android, itp. „Jeżeli programujesz aplikację za pomocą jej rodzimego kody, to tak jakbyś dokonał tego w „języku”, tego urządzenia, przez co nie musisz niczego „tłumaczyć” i jest to szybsza metoda.

Dlatego też nie można powiedzieć, że html jest językiem zrozumiałym dla wszystkich, ale nie jest ojczysty, dlatego tez nie będzie tak skuteczny. „Dzieje się to, gdy używa się wspólnego języka, a następnie każde urządzenie musi być zinterpretowane w swoim własnym języku”, komentuje David.

Z tego powodu, programista musi położyć szczególny nacisk na stworzenie wydajnego kodu, ponieważ gra będzie dostępna na każdego rodzaju urządzeniach, od zaawansowanych komputer do starszych telefonów z wolnymi połączeniami. Html5 nie będzie zachowywać się w ten sam sposób na różnych urządzeniach, dlatego wymaga wiele testów, aby w końcowym wyniku wszystko działało sprawnie.

W rzeczywistości, grając na telefonie, będziesz miał wrażenie prowadzenia statku kosmicznego dzięki dynamice dual joystick, charakterystyce z Robotron 2084 i Smash TV. I dzięki Phaser, którym jest Framework, z którego korzysta David do programowania gier, powstałby plug-in z dual joystick i nie byłoby potrzeby tworzenia go od nowa.

“Phaser to Framework, który stanowi zbiór struktur programistycznych ukierunkowanych na rozwiązywanie różnego rodzaju problemów. W szczególności Phaser ma na celu tworzenie gier wideo”, wyjaśni Santín. Jest odpowiedzialny za zarządzanie sprites, wprowadzenie dźwięku, posiada narzędzia do tworzenia gier i koncentruje się na dostarczaniu ich z bardzo wysoką wydajnością.

Mimo, że początkowym pomysłem Eduardo Ortega było stworzenie prostej gry o przetrwaniu, która posiada jeden ekran –który pozwala na grę w nieskończoność do momentu w którym przegrasz- rezultat był zupełnie inny. Widząc potencjał gry i czas, który można było jej poświęcić (wyznają, że zbiegło się to z latem), jego twórcy postanowili pójść naprzód i w rezultacie stworzyli grę html5 znacznie bardziej rozwiniętą i szczegółową. W skrócie, gra statków podzielona na trzy obszary, w których bohater musi zmierzyć się z pięcioma rodzajami wrogów, które atakują na różne sposoby i za każdym razem musi pokonać końcowego potwora. To magia gier wideo i mechaniki tworzenia.

Artykuł napisany przez Paula Gil Alonso