Spillutvikling i Phaser 3

Phaser 3 er et spillutviklingsrammeverk for javascript, og gir et godt utgangspunkt for å bygge både enkle og mer avanserte spill ved hjelp av javascript. De siste årene har jeg brukt mye tid med spillet Screeps, som har gjort at jeg har brukt mye javascript på fritiden, og jeg ønsker å prøve å få til litt spillutvikling med det.

Et alternativ er selvsagt å benytte Unity for dette, men hver gang jeg begynner å sette meg inn i det har det kommet en ny versjon og mye nye features. Dessuten synes jeg Unity passer best for 3D-spill, og med 2D-spill som jeg som oftest er interessert i så blir det litt mye overhead.

Logo for Phaser 3

Når jeg begynte å se litt på Phaser 3, så jeg at det var veldig kjapt å komme inn i, og det er utrolig kjapt å åpne opp Visual Studio Code og sette i gang. Jeg bestemte meg også bare for å sette meg ned å kode noe jeg var interessert i å lage, i stedet for å gå gjennom en haug av dokumentasjon. Det er etter min mening den beste måten å lære på.

Jeg er fortsatt ikke helt komfortabel med strukturen med GameObject, Scene og Game, men håper det begynner å komme på plass etter noen timer til. Ellers kan jeg anbefale å bare gå gjennom tutorialen på sidene deres, og ta det derfra. Jeg liker spesielt godt Examples-seksjonen deres, som i grunn er den jeg har lært mest fra.

Siden jeg er utrolig glad i typescript, tok jeg utgangspunkt i en ferdig starterkit med typescript, phaser 3 og webpack ferdig satt opp. Gjør du det samme, så vær oppmerksom på at phaser 3 har fått en del releases etter at de øverste treffene på starterkits på google er oppdatert, så pass på å oppdatere det manuelt.

Sphaser

Så hva har det første prosjektet mitt i Phaser3? Jeg kaller det Sphaser (arbeidstittel), og er et spill hovedsaklig inspirert av Aurora4x. Det er et utrolig bra spill, med et utrolig dårlig brukergrensesnitt. Inspirasjon er nok også hentet fra andre steder, slik som bokserien The Expanse.

Skjermbilde fra Aurora 4X

Sphaser starter i 2084, hvor jorden akkurat har blitt angrepet av en ukjent utenomjordisk rase. Kun 100 millioner overlever dette, og det blir din oppgave å guide skjebnen til menneskeheten videre.

Etter angrepet ligger det igjen spor som gjør at menneskene klarer å finne ut mer om denne ukjente teknologien. Blant annet så klarer de å form for overlyshastighetsmateriale som heter Tachyons for å bygge en helt ny generasjon av kraftigere motorer for romskip, som gjør det mulig å reise frem og tilbake innad i solsystemet i langt større fart enn i dag. De finner et partikkel som heter quantium, som kan benyttes på spesielle steder for å åpne opp warp gates mellom forskjellige solsystem.

Dette gir menneskene en unik mulighet til å begynne å kolonisere ikke bare vårt eget solsystem, men også andre stjerner. Etter hvert vil menneskene kanskje møte på den rasen som kom og utslettet mesteparten av menneskeheten tilbake i 2084.

Sphaser – Første prototype

Designdokumentene mine når jeg planlegger spill blir ofte så omfattende og store at det vil ta et spillstudio flere år å få ferdig et spill. Derfor har jeg blitt langt flinkere til å begrense omfanget etter hvert som jeg starter å utvikle.

Saturn i Sphaser, med månene og ringen rundt

I første prototype ønsket jeg å bygge opp solsystemet, samt legge til grunnleggende elementer som enkel grafikk, styring med mus og tastatur og tekst til spillet. Derfor bygde jeg opp en modell av solsystemet ut fra data fra wikipedia.

Deretter rendrer jeg dette i Phaser3, i korrekte avstander. Det betyr at både størrelser, omløpstider og alt annet skal være korrekt. Under kan du prøve ut prototypen, og her er noen tips om kontroller du kan trenge:

  • Page up/down: Raskere og tregere simulering (speed)
  • Space: Slå pause av og på
  • < og > (shift + <) for å zoome ut og inn (inspirert av Dwarf Fortress)
  • Scroll på mus: Zoom inn og ut (bruk shift samtidig for å endre hastigheten)
  • Piltaster: Flytt posisjon
  • Dobbelklikk med mus: Gå til posisijon
  • Hold og dra med mus: Flytt posisjon

Jeg anbefaler å zoome inn på f.eks. Jupiter eller Saturn. Jeg har også prøvd å få til ringen til Saturn, uten at jeg er helt fornøyd med hvordan dette vises så langt. Det er begrensa hvor godt denne embeda versjonen fungerer, siden f.eks. scroll vil gjøre at hele vinduet scroller, og bildet er litt lite. Vil du se det i full skjermstørrelse, kan du følge utviklingen til Sphaser her (ikke tilgjengelig lenger).

Sphaser – Videre plan

Jeg har etter hvert lyst til å jobbe videre med prosjektet, og jeg har definitivt noen ideer om hva jeg vil jobbe med videre:

  • Simulere asteroide-beltet, med mange mindre objekter
  • Simulere andre banetyper, slik at f.eks. kometer kan legges til.
  • Simulere et skip som beveger seg fra planet A til planet B.
  • Simulere 100 andre stjerner, som bli generert automatisk

På lengre sikt har jeg lyst til å legge til noe gameplay, f.eks:

  • Befolkningsendring-simulering basert på faktorer som trivsel, mattilgang etc.
  • Muligheten for å konstruere bygninger på planeter, og kolonisere nye planeter
  • Mulighet for å bygge bye objekter i bane rundt sola eller planeter.
  • Legge til et teknologi-tre, med mulighet for å utforske
  • Simulere ressurs-innhold på alle asteroider og planeter
  • Simulere gruveoperasjoner på asteroider og andre planeter
  • Simulere selskaper som utfører fraktoppdrag mellom destinasjoner
  • Mulighet for å designe skip
  • Mulighet for å rekruttere personer for å styre planeter og skip
  • Når jeg har et spillbart spill; implementere AI-motstandere

Akkurat nå tar jeg nok en liten pause fra Sphaser, og se litt på et annet spillprosjekt jeg har hatt liggende i Notepad så langt. Dette handler om tilebased spill, som trolig er mer naturlig i Phaser3, så får jeg se om jeg tar Sphaser videre eller i fremtiden prøver å simulere det i f.eks. Unity.