Panoramica
Un gioco di conquista a punti di controllo in cui il campo di battaglia è un intero pianeta. Lo orbiti, zoomi dal globo fino alla strada di una città, conquisti città, produci unità e affronti un'IA — mentre ogni cratere, incendio e colonna di fumo cambia il clima del pianeta.
Problema
Far sentire vivo un pianeta senza perdere la leggibilità di una mappa strategica: orbita e zoom fluidi, migliaia di oggetti su una sfera e una distruzione che ha conseguenze — usando solo Three.js.
Il mio ruolo
Concept, game design e direzione: regole, bilanciamento e aspetto. Il codice è stato scritto con l'aiuto dell'AI e verificato con partite automatiche.
Sfide
- Modificare il terreno in tempo reale — crateri, bruciature, suolo urbano spianato — senza ricostruire la mesh.
- Disegnare insieme alberi, edifici, veicoli e aerei su una sfera, di giorno e di notte.
- Costruire una camera orbitale senza blocco cardanico e senza OrbitControls, dal globo alla strada.
- Dare peso alla distruzione: collegare esplosioni, incendi, inquinamento, livello dei mari e condizioni di vittoria.
Soluzione
Un terreno a cubo-sfera di cui altezza, colore e normali si aggiornano localmente a ogni impatto; mesh istanziate per alberi, edifici e veicoli; una camera basata su quaternioni; shader procedurali per nuvole, atmosfera e oceano; e un piccolo modello di ecosistema che retroagisce sul gioco.
Architettura e approccio
- Terreno a cubo-sfera deformabile con lettura esatta dell'altezza: unità, strade e proiettili seguono i crateri.
- Rendering istanziato: 15.000 alberi, circa un migliaio di edifici con finestre notturne procedurali, centinaia tra auto, aerei di linea e navi.
- Pipeline HDR scritta a mano: buffer di scena MSAA, bloom, tone mapping, profondità di campo, ombre del sole, ombre delle nuvole cotte in una cube map, quattro preset di qualità con riduzione automatica.
- Pathfinding A* su un grafo di 9.000 nodi sulla sfera; le strade nascono dallo stesso grafo.
- Livello di regole: campagna a cinque missioni con stelle e tutorial guidato, nebbia di guerra e sei stratagemmi di comando (falsi eserciti, silenzio radio, spionaggio, blitz…) nello spirito degli strategici della guerra dell'informazione, punti di controllo, biglietti, economia, ricerca, sei tipi di unità tra cui artiglieria a tiro indiretto e un ingegnere ecologico che ripara i danni, un'IA che inganna e organizza ondate, e un attacco orbitale.
- Modello di ecosistema: foreste bruciate e inquinamento abbassano la biosfera, alzano i mari e oscurano il cielo.
Tecnologie
Risultato
Un gioco completo e giocabile su questo sito: gratis, senza pubblicità né tracciamento, e nulla oltre a Three.js — camera, particelle, shader, audio e interfaccia sono scritti a mano.
Cosa ho imparato
- Le conseguenze vanno tarate: il primo modello di ecosistema collassava in pochi minuti e ha richiesto un bilanciamento perché la guerra ferisca il pianeta senza chiudere la partita.
- Un ciclo di simulazione senza rendering rende rapida la taratura di IA ed economia: una partita intera in pochi secondi, poi si leggono i numeri.