Week 4: Animate + Rollover + 1st Winter Translator Design
Updated: Dec 10, 2020
Task 1: Making Two Ellipses Move At Different xSpeeds and repeating the animation.
//Week 4: task 1
float circleX=10;
float xSpeed=10;
float slow_circleX=10;
float slow_xSpeed=5;
void setup() {
size(400, 400);
}
void draw() {
background(#091D55);
//first circle
noStroke();
fill(#FAF200);
ellipse(circleX, 200, 25, 25);
if (circleX>width) {
circleX=10;
}
circleX=circleX+xSpeed;
//Second Circle
noStroke();
fill(#05FF67);
ellipse(slow_circleX,200,50,50);
if(slow_circleX>width) {
slow_circleX=5;
}
slow_circleX=slow_circleX+slow_xSpeed;
}
Task 2: Making Repeating Ellipses Move Across The Screen In A Diagonal.
//Week 4: task 2
float circleX=10;
float xSpeed=10;
float circleY=0;
float ySpeed=5;
void setup() {
size(400,400);
}
void draw() {
background(#050505);
//circle
noStroke();
fill(255);
ellipse(circleX,circleY,25,25);
if (circleX>width) {
circleX=10;
}
if (circleY>height) {
circleY=5;
}
circleX=circleX+xSpeed;
circleY=circleY+ySpeed;
}
Assignment 1: Rollover
Using if statements to create a rollover. This was the revised version of week 3's rollover.
//Rollover
void setup() {
size(600, 400);
}
void draw() {
background(0);
//top left corner
if (mouseX>0 && mouseX<300 && mouseY>0 && mouseY<200) {
noStroke();
fill(252, 75, 3);
rect(0, 0, 300, 200);
}
//top right corner
if (mouseX>300 && mouseY>0 && mouseY<200) {
noStroke();
fill(252, 75, 3);
rect(300, 0, 600, 200);
}
//bottom right corner
if (mouseX>300 && mouseY>200) {
noStroke();
fill(252, 75, 3);
rect(300, 200, 600, 400);
}
//bottom left corner
if (mouseX>0 && mouseX<300 && mouseY>200) {
noStroke();
fill(252, 75, 3);
rect(0, 200, 300, 400);
}
stroke(255);
strokeWeight(2);
line(300, 0, 300, height);
line(0, 200, width, 200);
}
Assignment 2: Translator
Started creating last week's translator design in Processing. Only two buttons are shown here and the final version can be seen in week 6's post.
//Week 4: Translator 2 Buttons
boolean snow=true;
void setup() {
size(1500, 1000);
background(7, 18, 44);
}
void draw() {
//Big Circle
noStroke();
fill(255);
ellipse(750, 0, 1100, 1100);
//WORD: SNOW
if(snow){
fill(73,20,159);
textSize(80);
text("I love snow!",525,300);
}else{
fill(0,175,76);
textSize(80);
text("Me encanta la nieve!",360,300);
}
//English Button
noStroke();
fill(73, 20, 159);
ellipse(150, 800, 255, 255);
fill(255);
textSize(40);
text("English", 75, 810);
//Spanish Button
noStroke();
fill(0,175,76);
ellipse(450,800,255,255);
fill(255);
textSize(40);
text("Spanish", 380, 810);
}
void mousePressed() {
//English Button
if(mouseX > 90 && mouseX < 210 && mouseY > 740 && mouseY < 810) {
snow=true;
}
//Spanish Button
if(mouseX > 390 && mouseX < 510 && mouseY > 740 && mouseY < 810){
snow=false;
}
}