This was a very straightforward project inspired by a type of blue firefly from New Zealand and Australia. In real life nature, this type of firefly live in damp and dark environments, and they are usually fond in wet caves or cracks beneath wet rocks. What I did in this project was drawing glowing, swimming fireflies that can be interacted with by using body tracking. The creatures will be follow one point of the body as the person moves, and circle around it when relatively still.

Drawing the fireflies

My first step was to draw the creatures the way I wanted them to look like. I had three parts of this in my mind: wings, tails, and glow. Wings are to indicate that they are flying creatures; the tails are inspired by the video of the firefly’s strings of web they produce that hang from the ceilings of the caves as shown in the video above; the glow is to make them look more like fireflies, and also more visually pleasing.

Though in real life this specific specie does not fly, I wanted to create moving creatures that has resemblance to it in appearance. So I started with the example code from the class of autonomous agents. Here’s how it looks like when running.

And I then referenced Daniel Shiffman’s Youtube tutorial on drawing object trails for the tails. And this is the tail I created.

So far the creatures look fine with the wing shaped body and tails. But when I tried to add a glowing effect to the creatures using colorshodaw and colorblur there seems to be too much computation and the frame rate was significantly dropped as showing the screen recording here.

After consulting my professor, I substituted the functions with Blendmode and adding transparency to the background. Here’s a video of the running code after the adjustment. 

Movement of the fireflies 

The initial variables set for the speed and steer force of the creatures are quite slow as shown in the video above, so the trajectory of their movements are relatively straight lines. In augmenting the creatures movement with my professor, we tried with with higher speed and bigger force, and this resulted faster spins when pivoting, and the trace drawn by the tails in this way contains more curves which gives a sense of gracefulness to it.

There was also a version of it that the creatures’ wings are flapping which looks more like actual fireflies, but I personally find the former motion that looks a bit like swimming more satisfying, so I eventually kept it that way.

Interaction with the fireflies 

Initially I wanted to use color tracking (referencing Daniel Shiffman’s Youtube tutoria) for implementing some interactive elements to the project when presenting, but my instructor suggested me to substitute the interaction with other methods, and I later opted body tracking. Essentially I replaced the target position of mouse to the position of one point of the body position being tracked. During the process of merging the code for body tracking with my existing code, I noticed the area of valid tracking could only be within 640×480 size frame despite enlarging the canvas in its original proportion. I later went to my professor and he told me that the target position needs to be mapped with the canvas size, and suggested including lerp to the target position.

When testing the tracking I used the position of the wrist, and my professor told me it would be very different between tracking the hand and other body parts, since hand tracking would appear as if we are controlling the creature. I found the conversation very enlightening and took some more consideration into my concept of the project and the idea of the course.  The inspiration was also originally derived out of the awe in the beauty of the nature, and I figured the course is also meant to capture the essence of nature’s wander in with a contemporary interpretation. Considering I’ll likely be standing closely in front of the table where I put my laptop to do the presentation, mainly my above-shoulder parts will be in the camera, so I made the tracking position left-ear during the in-class presentation. But during IMA show the laptop could be situated further away from the visitors, so used the position of the left shoulder on the show. 

Presentation 

Really appreciate the effort my professor took to help me set up and present for the IMA show! It was interesting to see people’s reaction when they had no idea what the class nor the projects are about. From my observation from the show, people would first notice their image is projected onto the screen when walked by, and when they start staring at it to figure out what was going on they would then notice the glowing creatures swimming towards them. Then they would move around in front the screen to see if the creatures would still follow their movements. 

I also saw some people trying to wave their arms or jump to trigger more movement  of the fireflies, but eventually did not see anything different happening on screen. Actually when I was using mouse position as target I added avoiding target when mouse is pressed, after incorporating body tracking I tried to make them avoid target when its position is shifting very fast, but I find it a bit too hard to achieve and gave up on this feature. During the in-class presentation and also after class with my classmate, I received suggestions that it would be fun make the creatures disappear when reaching one ear and reappear on the other side. I also think it’s a great idea but that would probably take more than just body points tracking. If given more time, I would definitely explore more motions and movements and pairing them with different  interaction triggers.

And I also expand the canvas last minute before the presentation and the show, but did not do the same with the size of the creature, which made the movements of the objects a lot less obvious and memorable. Something to keep in mind for future projects.