Generative image Programming
A short course about creating generative images through programing.
For my individual project for this course, I chose to try to make a "loading screen" similar to animation in processing created with selected equations as its path to follow.
A large part of the basic code came from Recreating Vintage Computer Art with (2015) which is then about recreating old computer art. This video then gave me the basis and the foundation to start creating something as I did not have absolutely any experience with coding and programming before this course.
A large part of the basic code came from Recreating Vintage Computer Art with (2015) which is then about recreating old computer art. This video then gave me the basis and the foundation to start creating something as I did not have absolutely any experience with coding and programming before this course.
A large part of the code I learned from "processing.org" and its many tutorials.
As with how I learned about colors from Color (2008).
This led to me being able to add my own colors of my choice and with any opacity
Some small parts came from coordinate System and Shapes (2008) which allowed one to change the position of the objects in processing
Found out a little more about how certain basic functions such as strokes worked from chapter 2 in "Generative Art" (2011) which was extremely useful.
As with how I learned about colors from Color (2008).
This led to me being able to add my own colors of my choice and with any opacity
Some small parts came from coordinate System and Shapes (2008) which allowed one to change the position of the objects in processing
Found out a little more about how certain basic functions such as strokes worked from chapter 2 in "Generative Art" (2011) which was extremely useful.
I then worked a lot to make the code more complex and make it more of my own work. I did this by adding a great extra features.
The code is made up of 3 different patterns made up of lines all with a definite path to follow with some small random formulas set to make it visually interesting.
All this then creates a fairly satisfying pattern that spins around itself.
I also made a version where I increased the number of lines to 94 instead of 20 to make a slightly more static animation that keeps its shape but still rotates around itself.
the pattern also has randomly selected colors with reduced opacity so as not to make the animation too spastic and irritating to the eyes.
All this then creates a fairly satisfying pattern that spins around itself.
I also made a version where I increased the number of lines to 94 instead of 20 to make a slightly more static animation that keeps its shape but still rotates around itself.
the pattern also has randomly selected colors with reduced opacity so as not to make the animation too spastic and irritating to the eyes.
Something I would have liked to get in but never really succeeded with was some kind of interactivity, but it never really came out due to time pressure and other difficulties. Went through prossecing.org a lot again and looked at Interactivity (2014) and Sound (2014) but never managed to get these examples to work on my own code. I wanted some kind of interaction that changed the algorithms for the Lines, for example, depending on the sound that enters the mic or just a push of a button.
float t;
// Antal “LINES”
static final int NUM_LINES = 20;
//static final int NUM_LINES = 94;
// ^ byt för antal liner
// Skärmupplösning/färg
void setup() {
//fullScreen();
size(1920, 1080);
background(20);
}
//Line färg/tjocklek
void draw () {
background(15);
stroke(random(255)+100,random(255)+100,random(255)+100,90);
strokeWeight(random(2,5));
// plats på skärm
translate(width/2, height/2);
// formler
for(int i = 0; i < NUM_LINES; i++){
line(x1(t + i), y1(t + i), x2(t + i), y2(t + i));
line(x3(t + i), y3(t + i), x4(t + i), y4(t + i));
line(x5(t + i), y5(t + i), x6(t + i), y6(t + i));
}
t+= 0.1;
}
// rörelse mönster
float x1(float t) {
return sin (t / 10) * 100 + sin(-t / 25) * random(2);
}
float y1(float t) {
return cos (t / 10) * 400 + sin(-t/20) * random(2);
}
float x2 (float t) {
return sin (t / 10) * 600 + sin(-t) * + cos(t) * random(2);
}
float y2 (float t) {
return -cos (t / 10) * 200 + cos(-t / 50) * random(2);
}
float x3(float t) {
return sin (t / 15) * -100 + sin(t / 10) * random(2);
}
float y3(float t) {
return cos (t / 15) * -300 + sin(t/10) * random(2);
}
float x4 (float t) {
return sin (t / 15) * -500 + sin(t) * + cos(t) * random(2);
}
float y4 (float t) {
return -cos (t / 15) * 350 + cos(t / 10) * random(2);
}
float x5(float t) {
return sin (t / 15) * 450 + sin(t / 10) * random(2);
}
float y5(float t) {
return cos (t / 15) * 250 + sin(t/10) * random(2);
}
float x6 (float t) {
return sin (t / 15) * 100 + sin(t) * + cos(t) * random(2);
}
float y6 (float t) {
return -cos (t / 15) * 100 + cos(t / 10) * random(2);
Referenser
Alexander Miller (2015, 28 oktober). Recreating Vintage Computer Art with
Processing[Youtube-Video] Hämtad från https://www.youtube.com/watch?v=LaarVR1AOvs
Shiffman, D. (2008) System and Shapes 20/02-2020 från https://processing.org/tutorials/drawing/
DuBois, L & Thoben, W. (2014). Sound. Hämtad 20/02-2020 från
Pearson, M (2011, juli) Generative Art. Manning Publication Co
Reas, C & Fry, Ben. (2014) Interactivity. Hämtad 20/02-2020 från https://processing.org/tutorials/interactivity/
Shiffman, D. (2008). Color. Hämtad 20/02-2020 från https://processing.org/tutorials/color/