Project Title: Tadpoles to Frogs

link: https://editor.p5js.org/jl14064/sketches/kjU3aX4h3

Description: 

In this project, I tried to explore the principles and dynamic applications of Object-Oriented Programming (OOP) by creating the tadpoles’ growth into frogs.

Initially, they are just tiny tadpoles while their sizes will grow bigger as they swim in the pool. They will try to avoid colliding with each other by shaking their bodies. And if the size exceeds 70, the tadpole will become a frog. Eventually, the grown frogs will inhabit the surface of the pool in a “V” sequence. 

You should hear the frogs’ sound in the program though the following video doesn’t include the sound.

Coding:

During the coding process, I encountered several problems. 

At first, I put Class Tadpoles in the draw() function, which made several variables not defined before being called.

In addition, to count how many tadpoles successfully grow up, I introduced variable fn as a counter. I put it in Class Tad at first and made it this.fn. However, fn would be a local variable instead of a global variable, which would not be called when I tried to push Frog into the frog array. Therefore, I created a global variable called fn in the first few lines.

By introducing Class Frog after Class Tad, I also finished the challenging option of making two classes. 

let fn = 0;

function draw() {
background(152, 218, 248);
......
//remove tads
for (let i = tads.length - 1; i >= 0; i--) {
if (tads[i].isGone == true) {
if (tads[i].frog == true) {
fn += 1;
}
tads.splice(i, 1); // (index, quantity)
console.log(tads.length);
console.log(fn);
}
}

//frogs
for (let i = 0; i < fn; i++) {
if (i < fn / 2) {
frogs[i] = new Frog(
i * (width / frogs.length) + 20,
i * (height / (frogs.length / 2)) + 20
);
} else if (i == fn / 2) {
frogs[i] = new Frog(width / 2 + 20, height - 20);
} else {
frogs[i] = new Frog(
i * (width / frogs.length) + 20,
height - (i - fn / 2) * (height / (frogs.length / 2)) + 20
);
}
}
for (let i = 0; i < fn; i++) {
let frog = frogs[i];
frog.display();
}
}

To meet the challenging options, I created interactions among the tadpoles by making them shake if they were too close to each other.

detectCollition(other) {
let d = dist(other.x, other.y, this.x, this.y);
if (d < (this.w + other.w) * 0.8) {
this.y += random(-5, 5);
}
}

Reflection:

• What is Object-Oriented Programming (OOP), a Class and an Instance of the Class?
  • Programming with objects is called Object-Oriented Programming (OOP). A class is a grouping of related data and subroutines. A Class is like a blueprint for an Object, describing what an Object like this should have. An Instance is a specific version of an object, with its own particular details.
    

• Discuss the effectiveness of OOP. When is OOP useful? In what way can it be utilized?
  • OOP is useful when the code is designed to create an object, and it can be easily utilized for different purposes and it can be reused easily.
• Describe the objects you have created. What properties and methods were implemented? What kind of behaviors did you create by manipulating them?
  • I created a tadpole-like and a frog-like class. I used methods: update(), display(), detectCollition(), checkOutOfCanvas(), growth(). The tadpoles will grow bigger as they move around and their tails will make waves. If they are big enough, they will become frogs.