For this interaction sketch, Ahmed and I used the mouse and keyboard as a way to control various elements on the screen. Most of the interaction comes from the mouse – moving the mouse to certain locations changes the rotation speed of a square in the middle. When the mouse is clicked, randomly-sized ellipses of random colors appear at the clicked location; the square will also reset and change colors. When a key is pressed, the background changes to a shade of grey.
One part of the project that was successful was the square. We used the translate and rotate as well as mouseX and mouseY functions to make it move. We were also able to change the colors of the objects pretty easily by putting random inside the fill function all in the mousePressed event. However, we did run into a couple of problems. One of them was the translate function. When we used it to shift the canvas to the middle so the square could rotate about its own axis, the location of the ellipses became jumbled. This happened when we tried to make them randomly pop up around the screen, but they ended up going off the screen and being created in random locations. Another problem was going from processing to the openprocessing website. We originally had the project where when the mouse was clicked, ellipses would pop up in a circle around the square. However, this didn’t happen when pasted in the website, so we had to rewrite the code so ellipses would pop up wherever the mouse was clicked. Overall, the project was pretty successful, as we utilized many concepts from class and were able to complete the assignment.
https://www.openprocessing.org/sketch/505065
I’d be interested to see what your original code looked like, can you post that somewhere?
float xPos, yPos, rot;
float ease = 0.0001;
void setup() {
size(1000, 1000);
colorMode(HSB);
background(0);
}
void mousePressed() {
fill(random(100,255), random(100,255), random(100,255)); // random ellipse color
ellipse(mouseX, mouseY, random(50, width/5), random(50, height/5));
fill(random(100,256), random(100,256), random(100,256)); // random square color
}
void draw() {
translate(width/2, height/2);
rotate(rot);
rectMode(CENTER);
rect(0, 0, 300, 300);
rot += mouseX*ease;
rot += mouseY*ease;
}
// when key is pressed, clears circles to shade of grey
void keyPressed(){
background(random(255));
}
I see the differences, we can discuss this on Friday.