Questo post tratta uno studio di coding creativo in p5.js, in cui unisco due linguaggi visivi in un unico fotogramma: una rigorosa struttura 3D di cubi a filo annidati e uno strato 2D piatto ispirato a Sonia Delaunay e all’Orfismo. Ho progettato il risultato specificamente per proiezioni VJ e performance di musica ambient.
Due sistemi in un’unica immagine
Ho costruito la base a partire da quattro cubi a filo, annidati l’uno nell’altro. Per prima cosa ho impostato ogni cubo per ruotare a un ritmo leggermente diverso, creando un ritmo meccanico calmo. Inoltre ho posto piccoli punti che orbitano e scivolano lungo i bordi — rimangono fedeli alla geometria, ma aggiungono un impulso vitale, come energia che scorre attraverso la struttura.
Su questo ho aggiunto una sovrapposizione orfica: anelli concentrici e archi che si sovrappongono, si intersecano e generano un collage di movimento. Ho mantenuto questo livello intenzionalmente piatto e grafico — un controcanto alla profondità dei cubi. Insieme, questi due sistemi creano una calma tensione visiva che regge bene durante proiezioni prolungate.
Il colore come movimento
Ho scelto una palette in linea con i contrasti simultanei di Delaunay: rosso, giallo, blu, arancione, verde, bianco e nero. Qui il colore non è una decorazione — è ciò che guida la percezione del movimento. Di conseguenza, l’immagine continua a mutare anche quando l’animazione rimane sottile, perché le rotazioni lente e i forti contrasti creano costantemente nuove combinazioni.
Un dettaglio chiave: tratto il bianco come spazio anziché come vernice. Lascio trasparenti i segmenti che normalmente sarebbero bianchi, così il fondo nero risulta visibile. Perciò gli anelli danno l’impressione di essere intagliati nell’oscurità — più leggeri e più architettonici.
Perché si adatta alla musica ambient
La musica ambient non richiede montaggi veloci. Ha invece bisogno di immagini che possano respirare. Per questo ho mantenuto l’animazione lenta e stratificata. I cubi forniscono la struttura. I cerchi e gli archi introducono ritmo e movimento di colore. Inoltre, i punti in orbita formano un impulso costante. Per tutto ciò, insieme costruiscono una tensione discreta che funziona bene in proiezione — puoi osservarla per minuti e continuare a scoprire nuove combinazioni.
Collego questo studio di coding creativo direttamente al mio lavoro di proiezione VJ dal vivo in Resolume.
Note tecniche — p5.js WEBGL
Ho realizzato il visual in p5.js in modalità WEBGL a 1920×1080. Ho costruito tutto a partire da forme semplici e pattern ripetuti: anelli come geometrie segmentate, archi come livelli che ritagliano, cubi come wireframe. Ho scritto il codice completo da zero, senza shader o dipendenze esterne — solo composizione e movimento.
Infine, se vuoi esplorare altro di questo lavoro, visita la panoramica sul coding creativo o la pagina musicale FDR-Sound.