designer. thinker. programmer.
fish-cover.jpg

Creative Coding: Kinetic Goldfish

Kinetic Goldfish

Simulating nature's mechanics through code.

 

I studied the motion characteristics of the swimming goldfish, and recreated their liveliness through computer algorithms.

 
 
 
fish-dia02.png
 
fish-dia01.png
 
fish-dia10.png
 
 

In order to animate the fish, I figured that simulating the mechanics of the fish bone is key. I applied the concept of "inverse kinematics" in object-oriented programming.

Each fish is composed of five "segments", and each segment is a javascript object. Each segment object contains pointers to its previous and subsequent segment, and updates its "angle" whenever the neighboring segments move.

 
 

For the next step, I will explore the inverse kinematics in a 3-dimensional environment, and program some new creatures with Three.js in the browser. Stay tuned!