Andrea Catalfamo – Geometric Typography – Refactoring

Il mio obiettivo era quello di alleggerire il testo e renderlo più corto e facile da comprendere.

https://www.perplexity.ai/search/64f55fd2-5e24-421b-9aad-d2ac82d78bb2

Risultato finale:
let r = 255, g = 255, b = 255;
let ar = 255, ag = 255, ab = 255;
let nr = 255, ng = 255, nb = 255;
let dr = 255, dg = 255, db = 255;
let rr = 255, rg = 255, rb = 255;
let er = 255, eg = 255, eb = 255;
let a1r = 255, a1g = 255, a1b = 255;

function setup() {
frameRate(60);
createCanvas(500, 500);
}

function draw() {
background(r, g, b);

let offsetX = mouseX – 100;
let offsetY = mouseY – 25;

if (mouseIsPressed) {
changeColors();
}

drawA(0, offsetX, offsetY, ar, ag, ab);

// Lettera N
fill(nr, ng, nb);
rect(35 + offsetX, 0 + offsetY, 6, 50);
rect(59 + offsetX, 0 + offsetY, 6, 50);
rect(41 + offsetX, 0 + offsetY, 6, 10);
rect(47 + offsetX, 10 + offsetY, 6, 10);
rect(53 + offsetX, 20 + offsetY, 6, 10);
rect(59 + offsetX, 30 + offsetY, 6, 10);

// Lettera D
fill(dr, dg, db);
rect(70 + offsetX, 0 + offsetY, 6, 50);
rect(88 + offsetX, 6 + offsetY, 6, 38);
rect(94 + offsetX, 12 + offsetY, 6, 26);
rect(76 + offsetX, 0 + offsetY, 18, 6);
rect(76 + offsetX, 44 + offsetY, 18, 6);

// Lettera R
fill(rr, rg, rb);
rect(105 + offsetX, 0 + offsetY, 6, 50);
rect(123 + offsetX, 6 + offsetY, 6, 14);
rect(129 + offsetX, 10 + offsetY, 6, 8);
rect(111 + offsetX, 0 + offsetY, 18, 6);
rect(111 + offsetX, 20 + offsetY, 18, 6);
rect(117 + offsetX, 26 + offsetY, 6, 8);
rect(123 + offsetX, 34 + offsetY, 6, 8);
rect(129 + offsetX, 42 + offsetY, 6, 8);

// Lettera E
fill(er, eg, eb);
rect(140 + offsetX, 0 + offsetY, 6, 50);
rect(146 + offsetX, 0 + offsetY, 24, 6);
rect(146 + offsetX, 22 + offsetY, 20, 6);
rect(146 + offsetX, 44 + offsetY, 24, 6);

drawA(175, offsetX, offsetY, a1r, a1g, a1b);
}

// Disegna la lettera A.
function drawA(x, offsetX, offsetY, cr, cg, cb) {
fill(cr, cg, cb);
rect(x + offsetX, 0 + offsetY, 6, 50);
rect(x + 24 + offsetX, 0 + offsetY, 6, 50);
rect(x + 6 + offsetX, 20 + offsetY, 18, 6);
rect(x + 6 + offsetX, 0 + offsetY, 18, 6);
}

// Cambia tutti i colori in modo casuale.
function changeColors() {
r = random(255); g = random(255); b = random(255);
ar = random(255); ag = random(255); ab = random(255);
nr = random(255); ng = random(255); nb = random(255);
dr = random(255); dg = random(255); db = random(255);
rr = random(255); rg = random(255); rb = random(255);
er = random(255); eg = random(255); eb = random(255);
a1r = random(255); a1g = random(255); a1b = random(255);
}