CyberMaze 3D

Che cos'è CyberMaze 3D?

CyberMaze 3D è un labirinto rompicapo tridimensionale che funziona interamente dentro un browser web, senza download, senza creare un account e senza installazione prima che compaia il primo corridoio. È stato realizzato per GitHub Game Off 2026, dove il tema era SHIFT, e l'interpretazione è letterale anziché decorativa.

Le pareti sono vive. I corridoi si alzano, sprofondano e cambiano percorso con un conto alla rovescia in tempo reale mentre il giocatore è ancora dentro il labirinto, quindi una rotta calcolata dieci secondi fa potrebbe non essere quella che esiste ora. Ogni rimescolamento deriva da scambi di archi dell'albero ricoprente nella teoria dei grafi, il che mantiene l'uscita matematicamente raggiungibile per quante volte la disposizione si ribalti. Non esistono stati bloccati.

Due telecamere sostengono l'esperienza. Una è una vista a inseguimento a livello del suolo che mantiene il giocatore dentro il labirinto; tenendo premuto Space la vista si solleva in un ologramma dall'alto dell'intera struttura. La lingua dell'interfaccia segue il browser, con cinese o inglese disponibili e commutabili in qualsiasi momento, e il codice sorgente è distribuito con licenza MIT.

Come giocare

L'obiettivo è raggiungere l'uscita di un labirinto che si rifiuta di restare fermo. I giocatori percorrono i corridoi mentre scorre un conto alla rovescia; quando scatta, sezioni di parete si sollevano, scendono o cambiano percorso, e lo stesso spazio diventa un problema diverso. Il progresso non riguarda solo la velocità, perché uno spostamento può aprire una scorciatoia o chiudere il corridoio proprio davanti.

Due abilità danno un vantaggio. Premere G forza un singolo rimescolamento cinetico, che trasforma il labirinto in qualcosa che si può cambiare di proposito invece di aspettare che accada. Premere F emette un impulso di scansione olografico che disegna la rotta ottimale da dove si trova il giocatore, così una svolta sbagliata può essere corretta invece di peggiorare la situazione.

Raggiungere l'uscita non mette fine al ragionamento. Un resoconto a fine partita colloca il percorso reale in 2D accanto alla soluzione ottimale A*, poi riporta il tempo impiegato, il numero di passi e una valutazione in stelle, con un replay disponibile per la revisione. Vedere lo scarto tra la linea percorsa e quella calcolata è il modo più rapido per capire dove una rotta ha sbagliato e che cosa chiedeva davvero il labirinto.

Controlli

Il movimento usa W A S D o i tasti freccia per attraversare i corridoi. Tenendo premuto Space si solleva la telecamera nell'ologramma dall'alto del labirinto completo. G attiva un singolo spostamento delle pareti e F emette l'impulso di scansione che rivela la rotta ottimale dalla posizione corrente. Q ed E ruotano la telecamera in passi fissi di 90 gradi, il che mantiene l'orientamento prevedibile quando la disposizione si ribalta.

Altri due tasti regolano la vista anziché il labirinto. V attiva o disattiva la telecamera a inseguimento e H passa a una vista cinematografica pulita a schermo intero per guardare la struttura senza ostacoli. Escape o P mettono in pausa la partita e aprono le opzioni per qualità grafica, audio e tema visivo.

Su uno schermo tattile, uno swipe fa avanzare di una cella alla volta, e un dock flottante lungo la parte inferiore dello schermo contiene controlli a un tocco per rotazione, vista dall'alto ed entrambe le abilità. Ciò significa che l'impulso di scansione e il rimescolamento forzato restano a portata di mano senza tastiera, e la rotazione della telecamera usata per l'orientamento su desktop ha un equivalente tattile diretto.

Consigli per la prima partita

Il conto alla rovescia cambia l'aritmetica di ogni decisione. Un corridoio lungo è un impegno, e l'abitudine più sicura è controllare la disposizione prima di addentrarsi in un tratto che uno spostamento potrebbe riscrivere alle spalle.

L'impulso di scansione è più prezioso all'inizio, non alla fine. Emetterlo prima di scegliere una direzione insegna la forma del labirinto più in fretta che emetterlo dopo una svolta sbagliata, e l'ologramma dall'alto risponde a una domanda diversa: non dove passa la linea ottimale, ma quanta parte della struttura resta da attraversare.

• Emettere l'impulso di scansione a un incrocio anziché a metà di un corridoio, così la linea rivelata può essere seguita subito.
• Tieni premuto Space a un punto decisionale per leggere l'intero labirinto prima di spendere il conto alla rovescia in un tentativo.
• Tieni G da parte per il momento in cui un corridoio si chiude, dato che un rimescolamento forzato è una risposta utilizzabile una sola volta a una rotta bloccata.
• Ruota la telecamera in passi di 90 gradi con Q ed E per mantenere la stessa mappa mentale mentre le pareti si muovono attorno.
• Dopo alcune partite, confronta la proiezione 2D del percorso effettuato con la linea A* per individuare la svolta in cui la rotta ha deviato.
• Apri il laboratorio di algoritmi e osserva BFS e A* esplorare lo stesso labirinto, perché la differenza nel loro ordine di ricerca spiega molto su perché una rotta ha la meglio.

Contenuti e rigiocabilità

Il resoconto a fine partita è il motivo principale per rigiocare. Proietta in 2D il percorso realmente seguito accanto alla soluzione ottimale A* e registra replay, tempo, passi e una valutazione in stelle, così il miglioramento è misurabile anziché affidato alle sensazioni. Inseguire una valutazione in stelle migliore sulla stessa disposizione mutevole dà a ogni partita un obiettivo chiaro oltre al semplice raggiungimento dell'uscita.

C'è anche un laboratorio di algoritmi per i giocatori che vogliono vedere il meccanismo invece di limitarsi a giocarci contro. La generazione del labirinto con DFS e Prim e la ricerca del percorso con BFS, DFS e A* possono essere esaminate fotogramma per fotogramma, sia manualmente sia in autopilota. Poiché le pareti si spostano tramite scambi di archi dell'albero ricoprente, osservare la fase di generazione rende visibile invece che astratta la garanzia dietro ogni rimescolamento.

Tre temi visivi danno allo stesso labirinto un carattere diverso, e l'interfaccia può passare dal cinese all'inglese quando il giocatore vuole. Cinquanta unit test coprono le invarianti di generazione del labirinto e di ricerca del percorso, il tipo di fondamenta che conta in un gioco in cui un singolo scambio di archi errato spezzerebbe la promessa che l'uscita sia sempre raggiungibile.

Presentazione e prestazioni

Tutto è renderizzato proceduralmente in Three.js anziché assemblato da grafica preesistente, e tutto il suono è sintetizzato dal vivo nel browser con oscillatori WebAudio. La build usa React 18, react-three-fiber, TypeScript e Vite, e funziona come pagina nativa del browser anziché come applicazione installata.

I tre temi visivi sono atmosfere davvero diverse. Hologram è vetro luminoso alla luce del giorno; Cyber Void è neon scuro sullo sfondo dello spazio profondo; Aurora Surge usa colonne viola e fasce di luce energetica. Cambiare tema fa parte del menu di pausa insieme alle opzioni audio e qualità grafica, quindi l'aspetto può essere adattato ai propri gusti o a ciò che lo schermo gestisce comodamente.

Il sistema di telecamera fa gran parte del lavoro di presentazione. La visuale a inseguimento a livello del suolo comunica la scala delle pareti mentre salgono e scendono, mentre l'ologramma dall'alto trasforma lo stesso spazio in un diagramma leggibile. Tenere premuto Space per passare tra queste due letture di un unico labirinto è l'idea visiva su cui è costruito l'intero gioco, e la visuale cinematografica a schermo intero riduce al minimo l'interfaccia per uno sguardo pulito.

A chi è rivolto

I giocatori di puzzle che apprezzano regole stabili e una plancia instabile sono il pubblico naturale. Si può stare certi che il labirinto non intrappolerà mai il giocatore, quindi la sfida è navigazione e tempismo, non fortuna; di solito una partita persa può essere ricondotta a una decisione precisa.

È adatto anche a chiunque sia curioso del pathfinding. Il laboratorio di algoritmi rende BFS, DFS e A* qualcosa di osservabile, e il confronto dopo la partita mette il percorso del giocatore a confronto con quello ottimale, uno strumento didattico molto migliore di un diagramma. Studenti e sviluppatori autodidatti che studiano la ricerca su grafi troveranno il ciclo insolitamente diretto.

Infine, si adatta a brevi sessioni nel browser. Non c'è nulla da installare e nessun account da creare, l'interfaccia può passare tra cinese e inglese, e i controlli touch con un dock flottante lo rendono giocabile su uno schermo tattile con uno swipe per cella. I tre temi sono un modo semplice per evitare che una pausa con un puzzle veloce abbia sempre lo stesso aspetto.