Concept:
For this week’s assignment, I wanted to focus on developing a concept and creating a fun adaptation for the new simulations of movements that we learned in class. As I was revising the different behaviors of agents that we simulated in code, the pursue and evade example caught my eye the most, mostly because of the endless opportunities it opens to tell simple stories. The three agents are like characters in a tale: the main character pursues something while trying to evade the bad guy. Many many possibilities to give this plot a more detailed and interesting scenario.
The scenario that I decided to with is the one of a Fisherman. The movement of the initial agent reminded me of that of a canoe in the sea. Here was my first experiment (I see a boat lost in the sea at night, but that might as well just be me haha!):
Nevertheless, I wanted to come back to the pursue and evade story plot. I created three characters: a fisherman in a canoe, a fish, and a shark. The story: the fisherman pursues the fish while avoiding the shark. Here is my final sketch:
Implementation:
For the sketch to come together, I decided to roughly sketch my own PNGs. Here they are:
Regarding the code, the difficult part was to correctly display the images, mostly the rotation so that the canoe moves with its tip facing the fish, and so does the fish and the shark. Here is how I modified the show() function for the Vehicle class:
show() { let angle = this.velocity.heading(); fill(127); stroke(0); push(); translate(this.position.x, this.position.y); rotate(angle + HALF_PI); image(boat, -50, -50, 100, 100); pop(); }
For further improvements, it would be interesting to make the shark to also pursue the fish. Additionally, for more details, I would add an event that occurs when either the fisherman or the shark gets to the fish first and a collision occurs. Now, when the images intersect, one just flows on top of the other, which is not the most smooth visual result.