Introduction:
This week during recitation, we first received a workshop about the map function, and then we were able to chose which workshop we wanted to go to.
I chose to go to the Media Manipulation workshop while my final project partner, Salome, chose to go to the Object Oriented Programming workshop. In regards to our final project, we are creating an interactive learning device (sort of like a game, but for the more desired outcome that you are able to learn from it), where we will be relying on media and images to teach people about how to sort their trash. I chose to go to this workshop, but I am focusing more on the design aspect of our interface and our project. Part of my responsibilities include designing the interface we will use for the project as well as designing the playing cards and other physical elements. From previous recitations and in-class assignments, I was having issues regarding how to call images and also how to play videos and manipulate image data. After the workshop, however, I feel I am more comfortable with the functions and how to write them.
For my recitation project, I created a “Tom and Jerry” short 🙂
I used case() and switch() to make it more interactive, so that people had to press certain keys in order to make certain images appear. I thought this was fun also because the effect is a flip-book effect but also like a “jumping-old-timey-camera” which is more representative of the era from which Tom and Jerry were born.
Here is the video:
https://drive.google.com/open?id=1dTdVN7FLOc1goxONO67BEBH7_Vb6ynrv
Code:
PImage photo;
PImage photo1;
PImage photo2;
PImage photo3;
PImage photo4;
PImage photo5;
void setup() {
size(1000, 1000);
photo = loadImage(“TOM.jpg”);
photo1 = loadImage(“house.jpg”);
photo2 = loadImage(“bell.jpg”);
photo3 = loadImage(“knife.jpg”);
photo4 = loadImage(“tj.jpg”);
photo5 = loadImage(“mouse.jpg”);
println(“Press these keys on your keyboard: s , h , a, w, a, d, e , r, q , f, t, g”);
println(“hint: hold the keys down for full effect”);
//load image from your laptop
}
void draw() {
background(0);
//int image = 20;
map(0, 0, 255, 0, 1023);
}
void keyPressed(){
switch(key){
case’a’:
image(photo, 200, 400);
break;
case ‘s’:
image(photo1, 800, 800);
break;
case ‘d’:
image(photo2, 600, 200);
break;
case ‘e’:
image(photo2, 600, 400);
break;
case ‘r’:
image(photo2, 600, 600);
break;
case ‘f’:
image(photo5, 300, 800);
image(photo3, 100, 800 );
break;
case ‘g’:
image(photo4, 450, 450);
break;
case ‘h’:
image(photo5, 600, 800);
image(photo1, 800, 800);
break;
case ‘w’:
image(photo5, 600, 800);
image(photo1, 800, 800);
image(photo, 200, 400);
break;
case ‘q’:
image(photo5, 300, 800);
break;
case ‘t’:
image(photo, 100, 500);
image(photo3, 300, 500);
break;
}
}
Analysis:
The command of these functions will definitely be useful in our final projects when we are displaying our “cards” on the screen.