# data[].attributes.body
void setup() {
// This is the size of the screen
size(800, 800);

}

void draw() {
// This is where you all the code for the shapes as shown below

// This sets the background colour - black is 0 or white is 255)
background(0);

squares(60, 60, 50, 10, 1, 255);
// square(x position, y position, size in pixels, gap between shapes, number of squares, colour - black is 0 or white is 255);

circles(120,60,50,10,1,255);
// square(x position, y position, size in pixels, gap between shapes, number of circles, colour - black is 0 or white is 255);

triangles(180, 60, 50, 10, 1, 255);
// square(x position, y position, size in pixels, gap between shapes, number of triangles, colour - black is 0 or white is 255);
}

// Do not toach the code below here
void squares(int xStart, int yStart, int s, int gap, int number, int c) {
rectMode(CENTER);
noStroke();
fill(c);
int x = xStart;
int y = yStart;
for (int i =0; i<number; i++ ) {
rect(x, y, s, s);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void circles(int xStart, int yStart, int s, int gap, int number, int c) {

noStroke();
fill(c);
int x = xStart;
int y = yStart;
for (int i =0; i<number; i++ ) {
ellipse(x, y, s, s);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void triangles(int xStart, int yStart, int s, int gap, int number, int c) {
int x = xStart;
int y = yStart;

noStroke();
fill(c);

for (int i =0; i<number; i++ ) {
int x1 = x-s/2;
int y1 = y+s/2;
int x2 = x+s/2;
int y2 = y+s/2;
int x3 = x;
int y3 = y-s/2;

triangle(x1, y1, x2, y2, x3, y3);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void mousePressed(){
// This will save the image into a folder called Image
save("image/pic.png");

}

# data[].attributes.body
This software programme (below )has been devised as a simple method of allowing the user to experience and developing an understanding of
Procedural Drawing.  The system rules are as follows.
1.  You can only use black and white.
2.  There are only 3 shapes, a square, a circle and a triangle.
3.  You can define the rules for position, scale and quantities.
By defining your own 3rd set of rules how many variants can you create? This is your challenge.

# data[].attributes.body
https://www.instagram.com/generativeartworks/
https://studioanf.com/untitled-procedural-drawing/
https://medium.com/@_stc/procedural-drawing-fb18aab70268

# data[].attributes.body
This software programme (below)
has been devised as a simple method of allowing the user to experience and developing an understanding of
Procedural Drawing.  The system rules are as follows.
1.  You can only use black and white.
2.  There are only 3 shapes, a square, a circle and a triangle.
3.  You can define the rules for position, scale and quantities.
By defining your own 3rd set of rules how many variants can you create? This is your challenge.

# data[].attributes.body
void setup() {
// This is the size of the screen
size(800, 800);

}

void draw() {
// This is where you all the code for the shapes as shown below

// This sets the background colour - black is 0 or white is 255)
background(0);

squares(60, 60, 50, 10, 1, 255);
// square(x position, y position, size in pixels, gap between shapes, number of squares, colour - black is 0 or white is 255);

circles(120,60,50,10,1,255);
// square(x position, y position, size in pixels, gap between shapes, number of circles, colour - black is 0 or white is 255);

triangles(180, 60, 50, 10, 1, 255);
// square(x position, y position, size in pixels, gap between shapes, number of triangles, colour - black is 0 or white is 255);
}

// Do not toach the code below here
void squares(int xStart, int yStart, int s, int gap, int number, int c) {
rectMode(CENTER);
noStroke();
fill(c);
int x = xStart;
int y = yStart;
for (int i =0; i<number; i++ ) {
rect(x, y, s, s);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void circles(int xStart, int yStart, int s, int gap, int number, int c) {

noStroke();
fill(c);
int x = xStart;
int y = yStart;
for (int i =0; i<number; i++ ) {
ellipse(x, y, s, s);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void triangles(int xStart, int yStart, int s, int gap, int number, int c) {
int x = xStart;
int y = yStart;

noStroke();
fill(c);

for (int i =0; i<number; i++ ) {
int x1 = x-s/2;
int y1 = y+s/2;
int x2 = x+s/2;
int y2 = y+s/2;
int x3 = x;
int y3 = y-s/2;

triangle(x1, y1, x2, y2, x3, y3);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void mousePressed(){
// This will save the image into a folder called Image
save("image/pic.png");

}void setup() {
// This is the size of the screen
size(800, 800);

}

void draw() {
// This is where you all the code for the shapes as shown below

// This sets the background colour - black is 0 or white is 255)
background(0);

squares(60, 60, 50, 10, 1, 255);
// square(x position, y position, size in pixels, gap between shapes, number of squares, colour - black is 0 or white is 255);

circles(120,60,50,10,1,255);
// square(x position, y position, size in pixels, gap between shapes, number of circles, colour - black is 0 or white is 255);

triangles(180, 60, 50, 10, 1, 255);
// square(x position, y position, size in pixels, gap between shapes, number of triangles, colour - black is 0 or white is 255);
}

// Do not toach the code below here
void squares(int xStart, int yStart, int s, int gap, int number, int c) {
rectMode(CENTER);
noStroke();
fill(c);
int x = xStart;
int y = yStart;
for (int i =0; i<number; i++ ) {
rect(x, y, s, s);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void circles(int xStart, int yStart, int s, int gap, int number, int c) {

noStroke();
fill(c);
int x = xStart;
int y = yStart;
for (int i =0; i<number; i++ ) {
ellipse(x, y, s, s);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void triangles(int xStart, int yStart, int s, int gap, int number, int c) {
int x = xStart;
int y = yStart;

noStroke();
fill(c);

for (int i =0; i<number; i++ ) {
int x1 = x-s/2;
int y1 = y+s/2;
int x2 = x+s/2;
int y2 = y+s/2;
int x3 = x;
int y3 = y-s/2;

triangle(x1, y1, x2, y2, x3, y3);
x=x+s+gap;

if (x>width-s/2) {
x=xStart;
y=y+s+gap;
}
}
}

void mousePressed(){
// This will save the image into a folder called Image
save("image/pic.png");

}

# data[].attributes.body
Take 3 regular shapes and create and use these to create 16 irregular shapes.

# data[].attributes.body
Create a word using squares circles and triangles