Guglielmo Villa – Generative Landscape

OBIETTIVO VISIVO:
Lo sketch mostra un paesaggio composto da una pista da sci, attraversato da una funivia che sale, e le montagne sullo sfondo. Cliccando sulla canvas l’ambiente si trasforma da diurno a notturno: il cielo e il paesaggio si scuriscono, appaiono le stelle, la funivia si illumina dall’interno.

SCOMPOSIZIONE LOGICA:

1. Setup e stato globale: in setup() viene creata la canvas 400×400 e impostato il frameRate. Le variabili globali gestiscono lo stato dell’intera scena: isNight (booleano giorno/notte), scrollOffset e speed (avanzamento e velocità dello scorrimento del paesaggio) e slope, calcolata come rapporto tra dislivello e larghezza della pista, in modo che il moto di traslazione segua la stessa inclinazione del disegno della pista.
2. Livello 1 – Sfondo: ad ogni frame scrollOffset viene incrementato. Il cielo è disegnato riga per riga con un ciclo for che interpola (lerpColor) tra due colori scelti in base a isNight, ottenendo un gradiente verticale diverso per giorno e notte. Se è notte, un blocco condizionale aggiunge stelle fisse: randomSeed(42) garantisce che le posizioni casuali restino identiche ad ogni frame, evitando il tremolio.
3. Livello 2 – Nuvole: la funzione custom nuvola() disegna una nuvola componendo cinque ellissi. Viene richiamata quattro volte con push()/translate()/pop(), in modo da posizionarla in punti diversi della canvas senza dover ricalcolare le coordinate delle singole ellissi; il colore cambia (bianco/grigio) in base a isNight.
4. Livello 3 – Paesaggio scorrevole: la funzione custom paesaggio(night) disegna montagne (triangoli su tre piani di profondità, con tonalità più scure e fredde di notte) e la pista da sci (poligono chiaro). Per creare lo scorrimento infinito, un ciclo for (i = -1; i <= 1) disegna tre copie affiancate del paesaggio, traslate di dx (resto di scrollOffset diviso il periodo) sia in x che in y (moltiplicando per slope), così il paesaggio scorre in diagonale rimanendo sempre coerente con l’inclinazione della pista, senza soluzione di continuità ai bordi.
5. Livello 5 – Figura (funivia): disegnata per ultima, sopra tutti gli altri livelli, e fissa rispetto alla canvas (rappresenta il punto di vista dell’osservatore a bordo). Il cavo è una semplice linea; la cabina è costruita con beginShape()/vertex() per gli attacchi meccanici e con rettangoli per carrozza e finestre. I colori (rosso, azzurro, grigi) sono definiti tramite variabili condizionali su isNight, così la cabina risulta più scura e le finestre più “calde/illuminate” di notte rispetto al giorno.
6. Interattività: mousePressed() inverte il valore di isNight ad ogni click, propagando il cambiamento a tutti i livelli precedenti (cielo, nuvole, montagne, cabina) e trasformando istantaneamente l’intera scena da diurna a notturna e viceversa.

USO AI:
Ho utilizzato l’intelligenza artificiale in primo luogo per formare il gradiente che ha colorato il cielo. Successivamente, dopo aver disegnato la canvas statica, ne ho fatto uso per impostare l’animazione della canvas.