SVG-vektorigrafiikan soveltuvuus selainpeleihin

Abstract

Tämän työn tarkoituksena on selvittää SVG:n (Scalable Vector Graphics) sopivuus Internet-selaimella pelattavien tietokonepelien alustaksi. Tutkittavia näkökulmia ovat muun muassa tämänhetkinen selaintuki, grafiikan laatu, animointi, tuotantotavat, hiiren ja näppäimistön käyttömahdollisuudet sekä skriptien tarpeellisuus.

Aluksi työssä tutustutaan vektorigrafiikan luonteeseen ja sen etuihin bittikarttakuviin nähden. Samalla vilkaistaan muutamia jo olemassa olevia vektorigrafiikkamuotoja ja tehdään pikakurkistus rasterointiin. Sitten esitellään SVG yleisellä tasolla ja tehdään alustavia arvioita siitä, miksi se voisi soveltua käytettäväksi selainpeleissä. Tämän jälkeen syvennytään pelinäkökulmaan. Siinä otetaan selvää, miten peleissä vaadittavia ominaisuuksia saadaan toimimaan SVG:n kanssa. Lopuksi SVG:n soveltuvuus pelialustaksi todetaan itse tehdyllä pelillä. Esimerkkipeliksi toteutettiin Suomen Punaisen Ristin koulupäihdevalistusta tukeva seikkailupeli, jossa pelaaja joutuu tekemään valintoja. Pelin suunnittelu ja toteutus onnistuivat huolellisen ja jatkuvan testauksen ansiosta.

Tulosten perusteella monenlaisia SVG-pelejä voidaan tehdä suurelle yleisölle. Kerättyjen tietojen ja käytännön kokeilun avulla voidaan muodostaa arvio, mitä pelityyppejä SVG:llä voidaan toteuttaa. Rajoittavia tekijöitä havainnoidaan koko työn pituudelta.

The objective of this study is to analyse feasibility of SVG (Scalable Vector Graphics) for computer games which are playable on web browsers. The main focus is related to practical issues such as current browser support, quality of graphics, animation, code production, input devices (mouse and keyboard) and necessity of scripts.

First the study takes a look into vector graphics in general and its advantages compared to bitmap graphics. It contains brief descriptions of some vector graphics technologies (other than SVG) and a quick look inside rasterizing. Then SVG and related technologies are introduced with considerations why SVG might be used in web browser games. After that follows the analysis how typical elements for computer games are implementable with SVG. Finally the feasibility of SVG in web browser games is demonstrated with a self-made example game. The game was an adventure game for supporting Red Cross's drug education in schools. The game design and implementation were successful due to careful and continuous testing.

The results show that at many kind of SVG games can be done for the wide public. With help of collected information and practical coding it is possible to make an estimation which game types apply for SVG. Limitation factors are noted across in the study.