Lia Zaffonato – Generative Landscape

OBIETTIVO VISIVO:
Un paesaggio costiero generativo con ciclo giorno/notte completo. Il paesaggio alterna un giro di giorno (sole, nuvole, colline verdi, mare blu) e un giro di notte (luna, stelle, colline scure) in loop continuo.
L’utente può interagire in tempo reale con click e scroll del mouse, facendo apparire oggetti o cambiando la velocità del tempo.

SCOMPOSIZIONE LOGICA:

  1. Background (cielo): funzione disegnaCielo() con lerpColor per transizioni graduali tra notte, alba, giorno
    e tramonto.
  2. Stelle: funzione disegnaStelle() con ciclo for
    e randomSeed fisso per tenerle ferme. Scintillio graduale ottenuto con sin(frameCount + i).
  3. Astro: funzione disegnaAstro() che fa percorrere a sole
    e luna un arco matematico con cos/sin. Giri pari = sole, dispari = luna.
  4. Nuvole (funzione custom): funzione disegnaNuvola(x, y, dimensione, colore) riutilizzata 5 volte in un ciclo for. Le nuvole si muovono lentamente e cambiano colore al tramonto.
  5. Ground: funzione disegnaGround() con curveVertex e noise per colline e mare ondeggianti. I colori cambiano tra giorno e notte.
  6. Interattività: click crea uccelli (giorno), stelle cadenti (notte) o gocce sull’acqua. Lo scroll del mouse controlla la velocità del tempo.

USO AI:
Ho usato Claude come supporto durante tutto il progetto, soprattutto quando non trovavo gli errori nel mio codice,
e infine per controllare commenti e identazione.
I prompt più importanti sono stati 3:

  1. “Come gestisco oggetti diversi (uccello, stella, goccia) creati al click e aggiornati ogni frame?” Ho capito come separare la creazione (mousePressed) dall’aggiornamento (aggiornaOggetti), usando un array condiviso con oggetti tipizzati, push() per aggiungere e splice() al contrario per rimuovere.
  2. “Ho una variabile tempo che cresce continuamente. Come faccio a sapere a quale giro sono e se è giorno o notte?” Ho capito così il concetto di floor(tempo) per contare i giri e % per sapere il momento del giorno, che è diventato il meccanismo centrale di tutto il progetto.
  3. “Come faccio a cambiare la velocità del tempo con la rotella del mouse?”
    Ho capito mouseWheel() e event.delta.

Commenti

Lascia un commento