Giulia Gobbato – Coding Art – Informatica per il Design

/* — Procedimento — */

Impostato lo sfondo a (250) in un rettangolo 600×700 pixel.
Creato la funzione mySquare :
- Tolto lo spessore del quadrato con noStroke
- Impostato un colore fill RGB(129, 103, 123) con 70% di opacità che corrisponde a 178 come quarto valore
  fill(129, 103, 123, 178)
- Aggiunta la forma con di un rettangolo con square 60×60 pixel

Per il posizionamento ripetuto dei quadrati (tutorial):
- push() : lascia forme del grafico invariate
- translate(x,y) : muovere la forma originale in un nuovo punto copiandola
- pop() : ripristina lo stato originale del canvas dovuto al push()

Nella funzione draw() :
- Ho creato 10 suddivisioni per ogni riga dell’opera di Vera Molnar, aggiustando i quadrati(mySquare) nelle coordinate x e y nel modo più accurato rispetto all’immagine di riferimento :

//1
mySquare(25, 35);
mySquare(80, 45);
mySquare(125, 41);
mySquare(180, 46);
mySquare(225, 60);
mySquare(280, 67);
mySquare(325, 50);
mySquare(374, 43);
mySquare(430, 36);
mySquare(487, 47);

//2
mySquare(30, 97);
mySquare(80, 106);
mySquare(120, 90);
mySquare(179, 92);
mySquare(238, 118);
mySquare(295, 125);
mySquare(335, 105);
mySquare(374, 100);
mySquare(428, 90);
mySquare(484, 95);

//3
mySquare(25, 145);
mySquare(75, 140);
mySquare(120, 145);
mySquare(185, 160);
mySquare(235, 165);
mySquare(292, 175);
mySquare(335, 160);
mySquare(390, 165);
mySquare(428, 152);
mySquare(495, 170);

//4
mySquare(30, 190);
mySquare(75, 196);
mySquare(137, 221);
mySquare(190, 222);
mySquare(225, 230);
mySquare(278, 210);
mySquare(330, 200);
mySquare(393, 200);
mySquare(440, 213);
mySquare(485, 205);

//5
mySquare(20, 240);
mySquare(83, 270);
mySquare(125, 255);
mySquare(180, 257);
mySquare(230, 275);
mySquare(292, 276);
mySquare(340, 273);
mySquare(387, 250);
mySquare(440, 260);
mySquare(493, 270);

//6
mySquare(30, 305);
mySquare(83, 310);
mySquare(130, 325);
mySquare(170, 310);
mySquare(232, 345);
mySquare(285, 330);
mySquare(330, 310);
mySquare(395, 305);
mySquare(440, 307);
mySquare(490, 320);

//7
mySquare(23, 345);
mySquare(75, 360);
mySquare(133, 355);
mySquare(170, 371);
mySquare(235, 404);
mySquare(280, 370);
mySquare(335, 375);
mySquare(383, 350);
mySquare(444, 368);
mySquare(480, 370);

//8
mySquare(20, 407);
mySquare(78, 423);
mySquare(128, 418);
mySquare(180, 420);
mySquare(228, 440);
mySquare(285, 420);
mySquare(331, 420);
mySquare(390, 413);
mySquare(442, 418);
mySquare(500, 433);

//9
mySquare(22, 460);
mySquare(83, 470);
mySquare(132, 485);
mySquare(180, 481);
mySquare(230, 500);
mySquare(282, 450);
mySquare(331, 475);
mySquare(387, 476);
mySquare(438, 480);
mySquare(505, 485);

//10
mySquare(30, 530);
mySquare(78, 528);
mySquare(135, 535);
mySquare(175, 535);
mySquare(238, 563);
mySquare(285, 513);
mySquare(345, 550);
mySquare(390, 535);
mySquare(448, 534);
mySquare(505, 543);

Infine ho aggiunto blendMode(MULTIPLY) per scurire le zone sovrapposte tra i quadrati

Foto dell’opera di Vera Molnar, Interstices, 1986

Link all’editor di p5.js

Giulia Gobbato – Coding Art

Commenti

Una risposta a “Giulia Gobbato – Coding Art”

Lascia un commento Annulla risposta