Moiré di cerchi concentrici

    function setup() {
    createCanvas( 670, 300 );
    noFill();
    strokeWeight( 5 );

    background( 255 );
    for (let raggio = 5;  raggio < 700;  raggio += 10) {
        circle( 295, 150, raggio * 2 );
        circle( 375, 150, raggio * 2 );
    }
}
  

  for (let raggio = 5;  raggio < 700;  raggio += 10) {
    circle( 295, 150, raggio * 2 );
    circle( 375, 150, raggio * 2 );

Due serie di circonferenze con lo stesso passo, 10 pixel, e i centri a 80 pixel di distanza. Ogni circonferenza è spessa metà del passo, e da sola copre metà della tela.

Dove le circonferenze delle due serie coincidono resta scoperta metà della tela, e la zona appare a righe. Dove quelle di una serie cadono negli spazi dell’altra la tela è quasi tutta coperta, e la zona appare scura. Le bande scure e quelle a righe non sono disegnate da nessuna istruzione: è il moiré, l’interferenza fra due ripetizioni sovrapposte.

Far muovere il secondo centro con il mouse: spostare background() e il ciclo in una funzione draw(), e sostituire 375, 150 con mouseX, mouseY.

Il nome viene da un tessuto, il moiré, che si ottiene pressando insieme due strati di stoffa bagnata: i fili, con una trama simile ma non identica, lasciano riflessi ondulati. Lo stesso effetto compare fotografando uno schermo, quando la griglia dei suoi pixel interferisce con quella del sensore.