For this assignment, I wanted to make something not so elaborate, but with a bit of randomness. After watching Casey Reas’ Eyeo talk, I find the concept of creating art with random elements interesting. One of the first ideas I had was to create a ball that multiplied each time it hit the wall. Despite wanting to do this, I realize that it would not have been possible due to the fact that I wanted to keep myself limited by the current knowledge taught in class. Yes, as students, we should find more information on how to do things, but in the same philosophy of designing video games, often creativity is found under restrictions.
Therefore, I decided to make something continuous, something that would fill the entire canvas with elements. For this, I particularly added the background code outside the draw()
function and put it in the setup()
, as I would create the illusion that many figures are being drawn at the same time. After I decided this, I wanted to create a simple algorithm that would dictate what type of ellipse, where, what color, shape and X and Y coordinates it would be. There are many variations to allow for a colorful variety of ellipses to be drawn rapidly on the canvas. Although, despite having most of the homework “finished,” I knew that it would not have been enough.
So, after a bit of thought on how to do it, I decided to add a circle that would bounce after detecting a collision with the canvas boundaries. It is similar to a practice we did in class, but that I could not finish on time due to working a bit slower than the rest of the class. The bouncing circle (or ball) was the trickiest part because I did not want to make something static, but rather entirely random to allow for different generative art.
I only used for()
loops for this code as I did not find any use for while()
, at least, in what I wanted to do. Also, if you click on the canvas, it will clean and reset everything. Likewise, the ball will always start on random positions, axis and at random speeds.
Particularly, I feel happy because I could figure out how to make the ball bounce every time in hits the walls. Here is the code behind it:
//Bouncing ball.
fill(0) //The ball in black color, in this canvas, looks the best (at least in my opinion).
//Check if the ball is passing the boundaries. If yes, determine the wall and assign a random X velocity and Y velocity value that keeps the ball inside the canvas.
if(cx+vx+cw>=0 && cx+vx+cw<=width && cy+vy+cw>=0 && cy+vy+cw<=height){
print("It works.");
} else if (cx+vx+cw>=width){
randomdecision = int(random(0,2))
if (randomdecision==0){
boundaryc = 2;
} else {
boundaryc = 3;
}
} else if (cx+vx+cw<=0){
randomdecision = int(random(0,2))
if (randomdecision==0){
boundaryc = 1;
} else {
boundaryc = 4;
}
} else if (cy+vy+cw<=0){
randomdecision = int(random(0,2))
if (randomdecision==0){
boundaryc = 1;
} else {
boundaryc = 3;
}
} else if (cy+vy+cw>=height){
randomdecision = int(random(0,2))
if (randomdecision==0){
boundaryc = 2;
} else {
boundaryc = 4;
}
}
//Once the wall is detected, and a decision is made as to which direction it should go, the ball will bounce according to the side, and will be randomly assigned an X and Y velocity.
if (boundaryc == 1){
vx+=random(1,5);
vy+=random(1,5);
} else if (boundaryc == 2){
vx-=random(1,10);
vy-=random(1,10);
} else if (boundaryc == 3){
vx-=random(1,10);
vy+=random(1,10);
} else if (boundaryc == 4){
vx+=random(1,10);
vy-=random(1,10);
}
circle(cx+vx,cy+vy,cw) //Once all the randomness is applied, the circle is drawn following the established rules.
This task, at least personally, was not that challenging, although I felt I could do more. For future projects, I would like for my art to have a system that allows creating certain patterns randomly.