I am seeking better motion strategies to represent the characters of this animation scene. In the case of the dog, I need to find a way to fix the speed so that its attempt to break away from its leash is more realistic and in the case of the cat, I would like to find a way to have it jump around near the mouse and stay there for a few seconds.

Any ideas?



/* This animation is an interactive game that consists in trying to keep the mouse hidden underneath the moving turtle so that it can try to hide from the cat.
 
// declare global variables used in this program for the creatures taken from online available clip art

PImage mouseClipArt; // declare a variable to store the mouse image
PImage gingerCatClipArt;  // declare a variable to store the cat image
PImage dogOnLeashClipArt;  // declare a variable to store the dog image


// declare global variables used in this program for the cat positions and movements

float catRandomX; // declare a variable that will impart some randomness to the cat's horizontal position and thus movements
float catRandomY; // declare a variable that will impart some randomness to the cat's vertical position and thus movements


// declare global variables used in this program for the dog positions and movements

float dogLocX; // declare the variable that determines the X location of the dog in the animation
float dogLocY; // declare the variable that determines the Y location of the dog in the animation
float dogRelativeYPos; // declare a variable that will ensure that the dog's bobbing is related to the Y movement of the mouse
float dogYRangeOfMotion; // declare the variable that will determine the radius of the sin motion to limit the range of the dog's bobbing
float angleDog;  // declare the variable that will control the position of the sin wave in the dog's movement
float speedOfDogUpAndDown; // declare a variable that will determine the speed of the dog's bobbing


// declare global variables used in this program for the turtle

float turtleLocX; // declare the variable that determines the X location of the turtle in the animation
float turtleLocY; // declare the variable that determines the Y location of the turtle in the animation
float angleX; // declare the variable that will control the position of the cos wave
float angleY; // declare the variable that will control the position of the sin wave
float turtleMiddleXPos; // declare the variable that will determine the X position from which the cos motion occurs
float turtleXRangeOfMotion; // declare the variable that will determine the radius of the cos motion
float turtleMiddleYPos; // declare the variable that will determine the Y position from which the sin motion occurs
float turtleYRangeOfMotion; // declare the variable that will determine the radius of the sin motion
float speedOfCosWaveMovement; // declare the variable that will impart a change in the angle that controls the cos wave
float speedOfSinWaveMovement; // declare the variable that will impart a change in the angle that controls the sin wave


void setup() {

  size(1200, 800);  // set the canvas size at 1200 pixels by 800 pixels
  background(0, 170, 250); // set background color to the watery shade of blue of A2_01

  // initialization of mouse (clip art) variable(s)

  mouseClipArt =loadImage ("cf_mouse_clipart.png"); // load the mouse image into its variable
  gingerCatClipArt =loadImage ("cf_gingercat_clipart.png");  // load the cat image into its variable
  dogOnLeashClipArt =loadImage ("cf_dogonleash_clipart.png");  // load the dog image into its variable


    // initialization of dog variables

  angleDog=0.0; // initialize the value of the angle for the dog's sin wave movement that has a zero value
  dogLocX=1.0; // initialize the value of the angle for the dog X position sot that it starts at zero
  dogYRangeOfMotion=height/15-250; // initialize a value for the range of the Y movement of the dog on the sin wave that makes it bob up and down taking its own height into account (=250 pixels)
  speedOfDogUpAndDown=0.18; // assign a speed of motion to the dog's up and down movement so that it is bobbing furiously yet also able to follow the Y position of the mouse


  // initialization of turtle variables

  angleX=0.0; // initialize the value of the angle of the cos wave that has a zero value
  angleY=0.0; // initialize the value of the angle of the sin wave that has a zero value
  turtleMiddleXPos=width/2-83; // initialize that determines the X position from which the cos motion occurs so that it is roughly near the center calculating the width of the turtle divided by 2 (166%2=83)
  turtleXRangeOfMotion=width/4; // initialize a value for the range of X movement of the turtle on the cos wave that makes it cover most of the height but stays inside the window
  turtleMiddleYPos=height/2-58; // initialize that determines the Y position from which the sin motion occurs so that it is in the center taking into account the height of the turtle divided by 2 (116%2=58)
  turtleYRangeOfMotion=height/3; // initialize a value for the range of Y movement of the turtle on the sin wave that makes it cover most of the height but stays inside the window
  speedOfCosWaveMovement=0.011; // initialize a value for the speed of the change of angle of the cos wave that is relatively slow
  speedOfSinWaveMovement=0.008; // initialize a value for the speed of the change of angle of the sin wave that is slightly slower than the change of angle for the cos wave movement
}


// animation method block of code

void draw() {
  background(0, 170, 250); // recall the background color in setup during draw

  // mouse (from clip art) movements in the draw function

  image(mouseClipArt, mouseX-30, mouseY-22, 50, 50); // draw the mouse and position it so that cursor is smack in the middle of it and so that it is small enough to hide underneath the turtle

  catRandomX=mouseX*random (-0.0058, 0.0058); // impart a jittery random speed to the cat's X movement that is multiplied by the the movement of mouseX as a decimal value
  catRandomY=random (-3, 3); // impart a small random speed to the cat's Y movement to add to the movement of mouseY
  image (gingerCatClipArt, (mouseX+135)+catRandomX, (mouseY-150)+catRandomY, 75, 150); // draw the cat and position it so that it is always away from the mouse


  // dog movements in the draw method

  dogLocX= random(-50, 4); // imparts a random horizontal range of movement to the dog to show it is trying to break off from its leash
  dogRelativeYPos=mouseY; // ensures that the dog's up and down movement is relative to the movement of the mouse and the cat
  dogLocY=dogRelativeYPos+sin(angleDog)*dogYRangeOfMotion; // calculates the Y location of the dog on the sin wave movement
  image (dogOnLeashClipArt, dogLocX, dogLocY, 200, 200); // draw the dog and position it so that it is trying to break its leash while it is stuck in the corner and male it a size that is both proportionate and threatening
  angleDog+=speedOfDogUpAndDown; // increment the angle of the sin wave by the speed factor every time the draw () method is called


  // turtle movements in the draw method

  turtleLocX=turtleMiddleXPos+cos(angleX)*turtleXRangeOfMotion; // calculates the X location of the turtle during its animated movement on the cos wave
  turtleLocY=turtleMiddleYPos+sin(angleY)*turtleYRangeOfMotion; // calculates the Y location of the turtle during its animated movement on the sin wave
  turtle (turtleLocX, turtleLocY); // draw the turtle from A2_01
  angleX+=speedOfCosWaveMovement; // increment the angle of the cos wave by the cos speed factor every time the draw () method is called
  angleY+=speedOfSinWaveMovement; // increment the angle of the sin wave by the sin speed factor every time the draw () method is called
}



// Turtle method block of code

void turtle (float turtleX, float turtleY) {  // create the turtle method


  // assign parameters for the color and stroke of the solid turtle figure

  fill (114, 188, 19); // set color of solid figure to a turtle-like green
  stroke(0); // set color of stroke to black for the solid figure outlines
  smooth(); // set anti-aliased edges for the solid turtle figure
  strokeWeight (3); // set the thickness of the stroke that delineated the solid turtle figure


  //draw the rear legs of the turtle with triangle

  triangle (turtleX+28, turtleY+18, turtleX+40, turtleY+10, turtleX, turtleY+4);
  triangle (turtleX+28, turtleY+18, turtleX+22, turtleY+52, turtleX+52, turtleY+62);


  // draw the top flapper underneath the body and head

  beginShape();
  curveVertex (turtleX+122, turtleY+25);
  curveVertex (turtleX+122, turtleY+25);
  curveVertex (turtleX+128, turtleY+21);
  curveVertex (turtleX+138, turtleY-8);
  curveVertex (turtleX+115, turtleY-30);
  curveVertex (turtleX+125, turtleY-15);
  curveVertex (turtleX+113, turtleY+7);
  curveVertex (turtleX+113, turtleY+7);
  endShape(CLOSE);


  // draw the bottom flapper underneath the body and head

  beginShape();
  curveVertex (turtleX+131, turtleY+23);
  curveVertex (turtleX+131, turtleY+23);
  curveVertex (turtleX+136, turtleY+27);
  curveVertex (turtleX+138, turtleY+42);
  curveVertex (turtleX+130, turtleY+60);
  curveVertex (turtleX+118, turtleY+85);
  curveVertex (turtleX+119, turtleY+86);
  curveVertex (turtleX+115, turtleY+78);
  curveVertex (turtleX+124, turtleY+25);
  curveVertex (turtleX+124, turtleY+25);
  endShape(CLOSE);


  // draw the body of the turtle with 11 curveVertices points

  beginShape ();

  //end of the turtle's tail

  curveVertex (turtleX, turtleY+30);
  curveVertex (turtleX, turtleY+30);

  //top of turtle

  curveVertex (turtleX+12, turtleY+20);
  curveVertex (turtleX+50, turtleY+8);
  curveVertex (turtleX+118, turtleY);

  // head of turtle and twist in the turtle's neck

  curveVertex (turtleX+152, turtleY+30);
  curveVertex (turtleX+166, turtleY+8);
  curveVertex (turtleX+146, turtleY+10);

  //bottom of turtle

  curveVertex (turtleX+126, turtleY+40);
  curveVertex (turtleX+80, turtleY+52);
  curveVertex (turtleX+20, turtleY+35);

  // part of turtle's tail that connects to its end

  curveVertex (turtleX+12, turtleY+25);
  curveVertex (turtleX+12, turtleY+25);
  endShape(CLOSE);


  // draw the eye and the smile of the turtle

  fill(232, 221, 7);
  ellipse (turtleX+158, turtleY+14, 2, 2);
  noStroke();
  fill(93, 9, 0);
  arc(turtleX+156, turtleY+24, 6, 6, QUARTER_PI, PI+QUARTER_PI);
}