Mini Project 3: Generative Motion

Project Title: Generative Motion Sketches

link1 leave: https://editor.p5js.org/jl14064/sketches/SywY_Hn52

link2 migration: https://editor.p5js.org/jl14064/sketches/EqWyVCbeS

link3 measles: https://editor.p5js.org/jl14064/sketches/WK0XCLZRI

Description:

These are the 3 sketches I made with linear, random, oscillation, circular, and angular motion.

I would like to thank Professor Godoy for the clarification of “a combination of (at least) two types of motion in a single sketch”. At first, I created two objects in one sketch with two different kinds of motions. However, Professor Godoy pointed out that it should be one object with two kinds of motions. From the misunderstanding, I started to have a deeper sense of generative art for its ambiguous description and interpretation.

1.LEAVE:

The first one is what I call “the leave”. It falls in a linear way while it twists in oscillation. This resembles the leaves falling in nature. 

x = x + 5*sin(ld);
y = y + random(5);

If the mouse is pressed, it will change its location rapidly as if a strong wind blows the leave away.

if (mouseIsPressed)
{ //wind
x = random(width)
y = y + random(5)
}

2.MIGRATION:

The second one is called “migration”. Inspired by birds’ migration, moving between two locations at different times, I combined the “reappearance” in linear motion with the circular motion.

if (x<=0||x>=width){
cx = width - cx
s = 0

Alternately, the lollipop vortex appears on the left side and right side of the canvas.

x = cx + cos(frameCount*0.1) * s;
y = cy + sin(frameCount*0.1) * s;
fill(random(255),random(255),random(255));
circle(x, y, random(50)); //initialize
s = s + 0.1

3. MEASLES

The third one is called “measles”. It is my first attempt to make an angular motion. It really took me a considerable amount of time to figure out the differences and functions among angleVel, angle and radDist. With random introduction, it demonstrates the unpleasant encounter with measles.

angleVel = random(5)
angle = angle + angleVel;

// calculate the position
x = width/2 + cos(angle) * radDist;
y = height/2 + sin(angle) * radDist;

// display the circle
circle(x, y, dia)
radDist = radDist + 1

Leave a Reply

Your email address will not be published. Required fields are marked *