Selainpelien pelimoottorit

Transkriptio

1 Selainpelien pelimoottorit Teemu Salminen Helsinki Seminaaritutkielma Helsingin yliopisto Tietojenkäsittelytiede

2 ! 1 HELSINGIN YLIOPISTO HELSINGFORS UNIVERSITET UNIVERSITY OF HELSINKI Tiedekunta Fakultet Faculty Matemaattis-luonnontieteellinen tiedekunta Laitos Institution Department Tietojenkäsittelytieteen laitos Tekijä Författare Author Teemu Salminen Työn nimi Arbetets titel Title Selainpelien pelimoottorit Oppiaine Läroämne Subject Tietojenkäsittelytiede Työn laji Arbetets art Level Seminaaritutkielma Aika Datum Month and year Sivumäärä Sidoantal Number of pages 9 sivua + 0 liitesivua Tiivistelmä Referat Abstract HTML5-selainpeleille on tehty suuri määrä pelimoottoreita sen jälkeen, kun HTML5 julkaistiin virallisesti vuonna HTML5 mahdollisti helpon grafiikan piirtämisen JavaScriptillä, mikä puolestaan avasi uuden aikakauden selainpeleille ja samalla niiden pelimoottoreille. Suosituimpia HTML5-pelimoottoreita ovat olleet mm. Construct 2, Phaser ja PlayCanvas. Jokaisella niistä on ollut hyvin erilainen lähestymistapa HTML5-pelien tekemiseen. Construct 2 on panostanut graafiseen käyttöliittymään ja helppokäyttöisyyteen, Phaser on keskittynyt JavaScriptin hyödyntämiseen 2D-grafiikassa ja PlayCanvas on tavoitellut laadukasta 3D-grafiikkaa ja -animaatiota. Niillä kaikilla on oma lokeronsa riippuen kehittäjän omista tavoitteista. ACM Computing Classification System (CCS): Application specific development environments Integrated and visual development environments Avainsanat Nyckelord Keywords HTML5, JavaScript, selainpelit, pelimoottorit Säilytyspaikka Förvaringsställe Where deposited Muita tietoja Övriga uppgifter Additional information

3 ! 2 Sisältö 1 Johdanto 3 2 Construct Phaser 5 4 PlayCanvas 6 5 Vertailua 7 6 Yhteenveto 8 Lähteet 9

4 ! 3 1 Johdanto Selainpelejä on pitkään kehitetty erilaisilla selaimen lisäosilla, kuten Flashilla tai Javalla, mutta HTML5:n virallinen julkaisu vuonna 2014 merkitsi uuden ajan alkua selainpeleille. Sen jälkeen on alkanut olla mahdollista pelata yhä laadukkaampia selainpelejä ilman asennuksia, käyttäen pelkästään suoraan selaimessa toimivia HTML5-elementtejä ja JavaScriptiä [1]. Etenkin HTML5:n mukana tullut <canvas>-elementti on mahdollistanut selaingrafiikan helpon piirtämisen JavaScriptillä. Samalla selainpelien kehittäjien käyttöön on tullut kymmenittäin HTML5- pelimoottoreita. Niiden suosio, laatu ja toteutustavat ovat olleet vaihtelevia, mutta parhaat niistä ovat olleet jopa suurimpien peliyhtiöiden kuten Disneyn käytössä. Seuraavaksi tarkastellaan tarkemmin kolmea HTML5-pelimoottoria, jotka ovat olleet suosituimpien ja arvostetuimpien joukossa. Nämä pelimoottorit ovat Construct 2, Phaser ja PlayCanvas.

5 ! 4 2 Construct 2 Kuva 1: Construct 2 -pelimoottorin käyttöliittymä [3]. Construct 2 on tällä hetkellä suosituin HTML5-pelimoottori HTML5 Game Engines -sivuston mukaan [2], ja se on selvästi eniten aloittelijoille suunnattu HTML5-pelimoottori. JavaScript- tai muuta ohjelmointia siinä ei ole lainkaan, vaan käyttöliittymä on täysin graafinen. Construct 2 on käytännössä Windows-työpöytäohjelma, jolla voi tehdä drag-anddrop -periaatteella 2D-pelejä. Kaikki graafiset elementit asetetaan paikoilleen raahaamalla ne ruudulla haluttuihin kohtiin, ja pelitapahtumat luodaan omalla tapahtumakäyttöliittymällä, joka tekee suuren osan työstä kehittäjän puolesta. Pääasiassa pelikehittäjän harteille jää siis vain luoda 2D-elementit ja miettiä, millaisia pelitapahtumia peliin tulee. Rajoituksena pelimoottorissa on se, että ilmaisversiosta puuttuu monia ominaisuuksia. Muun muassa moninpeli puuttuu siitä kokonaan [3]. Lisäksi 3Dgrafiikkaa ei ole mahdollista käsitellä, vaan kaikki perustuu 2D-grafiikkaan.

6 ! 5 3 Phaser Kuva 2: Phaser Sandbox -käyttöliittymä [4]. Phaser on toinen suosittu HTLM5-pelimoottori, joka on suunnattu JavaScriptiä osaaville web-kehittäjille. Graafisia apuvälineitä pelinkehitykseen ei ole, mutta toisaalta siinä on paljon työkaluja JavaScriptin hyödyntämiseen 2D-peligrafiikan käsittelyssä. Phaser on käytännössä vain JavaScript-kirjastotiedosto, jonka funktioiden käyttäminen helpottaa peligrafiikan piirtämistä. Lisäksi Phaserille on tarjolla Phaser Sandbox -niminen työkalu, jossa voi lähteä kehittämään ja testaamaan Phaserilla toimivaa peliä suoraan selaimessa [4]. Phaser vaatii kuitenkin alkuun pääsemiseen enemmän opettelua kuin Construct 2. Toisin kuin Construct 2, Phaser on täysin ilmainen ja avointa lähdekoodia. Sitä voi siis hyödyntää isoissakin projekteissa ilman maksuja tai rajoituksia. Lisäksi se toimii millä tahansa alustalla, koska sen käyttö vaatii periaatteessa vain tekstinkäsittelyohjelman. 3D-grafiikkaan Phaser ei kuitenkaan sovellu.

7 ! 6 4 PlayCanvas Kuva 3: PlayCanvas-editorin käyttöliittymä [5]. PlayCanvas on myös yksi suosituimmista HTML5-pelimoottoreista, ja sen erikoisuutena on keskittyminen 3D-grafiikkaan. Toisin kuin Construct 2 tai Phaser, PlayCanvas antaa varsin monipuoliset työkalut 3D-pelien kehittämiseen. JavaScript-kirjaston lisäksi PlayCanvas tarjoaa selaimessa toimivan editorin, jolla voi visuaalisesti luoda 3D-malleja ja -pelialueita. Graafinen 3D-mallinnus voi helpottaa kehitystä tuntuvasti, ja graafisiin komponentteihin voi myös suoraan yhdistää JavaScript-skriptejä. PlayCanvas on työkaluna sen verran arvostettu, että sillä on tehty pelejä ja muuta 3D-grafiikkaa korkean profiilin organisaatioissa, kuten Samsungilla ja Disneyllä [5]. PlayCanvas-pelimoottorin JavaScript-kirjasto on ilmainen ja avointa lähdekoodia. PlayCanvas vaatii kuitenkin maksuja tietyistä ominaisuuksista, kuten yksityisten projektien perustamisesta tai selaineditorilla tehtyjen tuotosten viemisestä omalle tietokoneelle [5].

8 ! 7 5 Vertailua Construct 2 Phaser PlayCanvas 2Dgrafiikka 3Dgrafiikka Windowstuki Mac-tuki Linux-tuki Avoin lähdekoodi Täysin graafinen käyttöliitty mä Selainpohja inen kehitysymp äristö tarjolla Kuva 4: Pelimoottorien ominaisuuksien vertailua [2, 3, 4, 5].

9 ! 8 Kuten yllä olevasta taulukosta näkee, näillä kolmella HTML5-pelimoottorilla on jokaisella oma kohdeyleisönsä. Construct 2 on suunnattu aloitteleville pelinkehittäjille, joilla ei ole merkittävää ohjelmointikokemusta. Phaser sen sijaan on suunnattu JavaScript-kehittäjille, jotka ovat kiinnostuneita HTML5-pelien tekemiseen. PlayCanvas on suunniteltu 3D-grafiikan käsittelyyn selaimessa pääasiassa HTML5-peleissä, mutta myös muissa tarkoituksissa. Se, mikä näistä pelimoottoreista soveltuu kehittäjän omiin tarkoituksiin, riippuu täysin kehittäjästä. 6 Yhteenveto HTML5-selainpeleille on tehty suuri määrä pelimoottoreita HTML5:n virallisen julkaisun jälkeen. Suosituimpiin näistä ovat kuuluneet Construct 2, Phaser ja PlayCanvas. Jokaisella pelimoottorilla on oma kohdeyleisönsä, joten vaikka niiden suosio vaihtelee jatkuvasti, ei suuren pelimoottorivalikoiman olemassaoloa voi pitää turhana. Uusia HTML5-pelimoottoreita julkaistaan todennäköisesti jatkossa yhä enemmän ja nykyisistä tulee myös uusia versioita. Jos on kiinnostunut selainpelien kehittämisestä, lähivuodet tulevat olemaan kiinnostavaa aikaa.

10 ! 9 Lähteet [1] Jon Peddie, Play serious games in your browser, g= &type=article&urltitle=play-serious-games-in-your-browser. [ ] [2] [ ] [3] [ ] [4] [ ] [5] [ ]