For the in-class exercise, I decided to build up upon what we did during class with the pixels and played around with some of the variables. I had my own image from Thanos and first changed the ellipses to rectangles. Then, in the “pix” variable, I wanted to add a random integer from 0 to 99 to add to the color of pix in order to have a “bling” effect where the image would constantly sparkle like it is a GIF. I knew this was possible since the draw function acts like a loop, and the random values will constantly add differently every time the loop goes on.
I also played around with the constrain of increment, but one question I had in mind was “how to reverse the constrain?”, as in how do I make it so that the image zooms in the more I go left rather than right, the more I go up rather than down, etc. Because when I just reversed the values in the constrain function (1,990) to (990,1), the image would not zoom out. So maybe if I search online a bit more I will understand why this is happening.
Here is how the whole thing works, and before that is the code. Note that the main function is provided by Prof. Aaron Sherwood.
PImage a;
int x =0;
int y= 0;
int increment = 10;
void setup(){
background(255);
size(990,600);
a=loadImage("jeff2.jpg");
}
void draw(){
background(0);
a.loadPixels();
for (int y=0; y<height; y+=increment) {
for (int x=0; x<width; x+=increment) {
int loc = x+(y*width);
color pix=a.pixels[loc]+int(random(100));
fill(pix);
rect(x,y,increment,increment);
}
}
a.updatePixels();
increment=constrain(mouseY,1,600);
}