SpaceWar – kehityspäiväkirja

HTML-tiedosto ➝ Client–Server ➝ Unity WebGL

Tälle sivulle olen koonnut SpaceWar-projektin kehitysvaiheet: miten selainpohjainen yhden HTML-tiedoston proto kasvoi moderniksi client–server -arkkitehtuuriksi ja lopulta Unity-versioksi, joka pyörii kauniisti myös selaimessa.

Yhteenveto

Kolme päävaihetta, sama visio: kevyt, nopea ja helposti lähestyttävä avaruusstrategia.

JS – Single HTML

Selainprototyyppi
(HTML + JS)

Ensimmäinen versio eli yhden HTML-tiedoston selainpeli. Toimi itsenäisesti, mutta koodin ylläpito ja jatkokehitys vaativat refaktorointia.

Pelaa JS-protoa

HTML5 Three.js Tone.js

Milestones

Valitse aikakausi nähdäksesi virstanpylväät.

7.5.2025
Proton rakentaminen alkaa
JavaScript-harjoite wikipelin innoittamana. Ensimmäinen viikko ilman tarkkaa dokumentaatiota – kokeilua, nopeita iterointeja ja “luovaa hulluutta”.
14.5.2025
Ensimmäinen itch.io -julkaisu
Peli ulos ja devlog auki: “Thanks for checking in”.
15.5.2025
AI-tutkimus alkaa
Havainto: AI on ankea → katsaus eri lähestymistapoihin ja oman AI:n kehitysideoihin. Devlog: “A new week and a new AI”.
20.5.2025
“Uusi AI” julkaistu
Ensimmäinen merkittävä AI-versio itch.io:ssa.
touko 2025 (loppu)
AI-testauksen vaikeudet
Takaisin piirustuspöydälle – dynaamiset säästöpossu-budjetit AI:lle. Devlog: “Piggybanks for dynamic AI”.
1.6.2025
Toimiva AI, joka säästää ja skaalaa
AI kehittää tähtiään ja rakentaa suurempia aluksia – resurssien säästö tuo strategiaa. Devlog: “The AI that should’ve been is finally here”.
1.6 - 10.6.2025
Särmien hiomista ja tulevaisuudenhaaveita
Visioidaan endgame-lisäyksiä ja tavoitteita. Devlog: “Next up: late game additions”.
10.6.2025 →
First playable preview on valmis.
Päätös jatkaa kehittämistä. Näyttötyön aiheeksi valikoitui pelin refaktorointi client-server -arkkitehtuuriin, mikä teoriassa mahdollistaisi myös moninpelin tulevaisuudessa.

Arkkitehtuuri & teknologiat

Korkean tason katsaus projektin kolmeen “aikakauteen”.

JS-proto (selain)

  • Kevyt yhden tiedoston prototyyppi itch.io-jakeluun.
  • Hyvä nopeaan iterointiin ja ideointiin.
  • Pelin peruspalikat kasaan ja pelin idea esille testattavaksi.

Client–Server (web)

  • Frontend: Three.js-renderöinti, UI & ääni (Tone.js).
  • Backend: Node.js + Express – pelitila ja logiikka.
  • Synkronointi: Socket.IO reaaliaikaiseen diff-päivitykseen.
  • Tietokanta: MongoDB + Mongoose.

Unity WebGL

  • Visuaalisempi toteutus Unityn työkaluilla.
  • Build selaimeen (WebGL) – helppo jakaa ja pelata.
  • Jatkokehitys: moninpeli, Steam-julkaisu

Pääkohteet & linkit

KohdeKuvausLinkki
itch.ioJulkaisu ja pelattava buildpecatus.itch.io/spacewar
WikiExplorerInspiraation lähde (linkkien verkosto)lassesimonen.fi/wikiExplorer
itch.ioUnity buildpecatus.itch.io/spacewar-unity
GitHubLähdekoodi (refaktoroitu)github.com/pecatus/SpaceWar-Refactored

Dokumentaatio & Linkit

Tärkeimmät dokumentit ja lähdekoodi koottuna yhteen paikkaan.

Näyttötyö

Varsinainen näyttötyödokumentaatio, joka sisältää projektisuunnitelman, toteutuksen yksityiskohdat ja analyysin.

Lataa näyttötyö (PDF)→

Projektipäiväkirja

Yksityiskohtainen päiväkirja projektin etenemisestä, haasteista ja oivalluksista refaktoroinnin aikana.

Lue päiväkirja (PDF)→

Lähdekoodi

Refaktoroidun Client-Server -version koko lähdekoodi ja projektitiedostot löytyvät GitHubista.

Selaa GitHubissa (LINKKI)→