Avatar-AnimatedLoop

via GIPHY

 

I think I succeeded by using humor as the piece’s main component. I’ve been really into these strange altered collages lately. Everything I wanted to accomplish it does: spinning leg, peeing, wiggling clouds. I wish the pee angles were more directional based on the stream and the tongues of the clouds wiggled by themselves. I used the bounce easing function so the cloud would be silly.

 

 

 

// This is a template for creating a looping animation in Processing/Java. 
// When you press the 'F' key, this program will export a series of images
// into a "frames" directory located in its sketch folder. 
// These can then be combined into an animated gif. 
// Known to work with Processing 3.3.6
// Prof. Golan Levin, January 2018
 
//===================================================
// Global variables. 
String  myNickname = "nickname"; 
int     nFramesInLoop = 120;
int     nElapsedFrames;
boolean bRecording; 
PImage bg;
PImage cherub;
PImage sun;
PImage rCloud;
PImage lCloud;
PImage leg;
PImage pee;
int legAngle;
int state = 0; // 0 = standing 1 = spinning 2 = peeing 3 = rotating again
int stateCounter = 0;
 
int legX = 195;
int legY = 275;
int offsetX = -10;
int offsetY = -20;
 
 
//===================================================
void setup() {
  size (600, 600); 
  frameRate(15);
  bRecording = false;
  nElapsedFrames = 0;
  bg = loadImage("Background for out of stock.png");
  cherub = loadImage("CHERUB AND CAN.png");
  sun = loadImage("SUN.png");
  rCloud = loadImage("DALMATION CLOUD RIGHT.png");
  lCloud = loadImage("DALMATION CLOUD LEFT.png");
  leg = loadImage("LEG.png");
  pee = loadImage("ONE PEE.png");
}
//===================================================
void keyPressed() {
  if ((key == 'f') || (key == 'F')) {
    bRecording = true;
    nElapsedFrames = 0;
  }
}
 
//===================================================
 
float function_PennerEaseOutBounce (float t) {
 
  if ((t) < (1/2.75f)) {
    return (7.5625f* t*t);
  } 
  else if (t < (2/2.75f)) {
    float postFix = t-=(1.5f/2.75f);
    return (7.5625f*(postFix)*t + 0.75f);
  } 
  else if (t < (2.5/2.75)) {
    float postFix = t-=(2.25f/2.75f);
    return (7.5625f*(postFix)*t + 0.9375f);
  } 
  else {
    float postFix = t-=(2.625f/2.75f);
    return (7.5625f*(postFix)*t + 0.984375f);
  }
}
 
//------------------------------------------------------------------
float function_PennerEaseInBounce (float t) {
 
  return (1.0 - function_PennerEaseOutBounce (1.0-t));
}
 
//------------------------------------------------------------------
float function_PennerEaseInOutBounce(float t) {
 
  if (t < 0.5) {
    return function_PennerEaseInBounce (t*2) * .5f;
  } 
  else {
    return function_PennerEaseOutBounce (t*2-1) * .5f + .5f;
  }
}
//==================================
void draw() {
  // image (name, y, x, w, h)
 
  if(state != 2) {
  background(0);
  image(bg, 0, 0, 600, 600);
  image(sun, 20, 20, 100, 100);
  image(lCloud, function_PennerEaseInBounce(sin(stateCounter)/2 +0.5 )*7 + 250, -5, 200, 150);  // alter sin / time?
  image(rCloud, sin(stateCounter)*-3 + 420, 40, 200, 150);  // alter sin / time?
  }
  //draw leg
  pushMatrix();
  translate(legX, legY);  //draw leg at these coordinates
  rotate(radians(legAngle));
  translate(offsetX, offsetY);  //correct rotation point
  image(leg, 0, 0, 60, 220);
  popMatrix();
 
 
  //ellipse(280, 285, 10, 10);
  //ellipse(420, 280, 10, 10);
 
 
 
  if (state == 0) {
    if (stateCounter <= 30) { stateCounter++; } else { state = 1; stateCounter = 0; } } else if (state == 1) { if (legAngle > -120) {
      legAngle -= 5;
    } else {
      state=2;
      stateCounter = 0;
    }
  } else if (state == 2) {  //peeing
    if (stateCounter < 10) { //Pee pee(10); pee(-10); pee(0); stateCounter++; } else { state = 3; stateCounter = 0; } } else if (state == 3) { if (legAngle > -360) {
      legAngle -= 5;
    } else {
      state=0;
      legAngle = 0;
       stateCounter = 0;
    }
 
 
 
  }
 
 
  //print(state);
 
  image(cherub, 25, -20, 320, 570);
  saveFrame();
}
 
void pee(int offset) {
  //280, 285
  //420, 280
 
 
    int x = stateCounter*15 + 280;
    float y = 220 + pow(x - 350, 2) * 0.01;
    pushMatrix();
    translate(x, y);
    rotate( 2 * x * 3.14 -80);
    image(pee, 0, 0, 20, 20);
    //translate();
    popMatrix();
    delay(40);
    println(x, y);
    //println(frameCount);
 
}