Trasformazioni complesse
// height=300 lines=auto
let font;
let punti;
function preload() {
font = loadFont("assets/UbuntuCondensed.ttf");
}
function setup() {
createCanvas(670,300);
punti = font.textToPoints("testo", 30, 260, 320);
}
function draw() {
let vettori = [];
for (let i = 0; i < punti.length; ++i) {
let vettore = createVector(punti[i].x, punti[i].y);
let tempoY = frameCount / 20;
let valoreY = sin(tempoY) * sin(i/10);
vettore.y += map( valoreY, -1,1, -10,10 );
vettori[i] = vettore;
}
background(255);
for (let vett of vettori) {
circle(vett.x, vett.y, 2);
}
}
let tempoY = frameCount / 20;
let valoreY = sin(tempoY) * sin(i/10);
vettore.y += map( valoreY, -1,1, -10,10 );
Modifica le coordinate y aggiungendo la "fusione" fra un valore che oscilla con lo scorrere del tempo (sin(tempoY)) e uno che oscilla lungo il percorso dei contorni (sin(i/5)).
Vere e proprie deformazioni delle singole lettere si possono ottenere anche usando altri valori specifici di ogni vertice, ad esempio la distanza dall'origine:
let valoreY = sin(tempoY) * sin(vettore.mag()/10);
Strutturazione dei file:
- CARTELLA-SKETCH
- assets
- libs
- p5.min.js
- index.html
- sketch.js