The Cube
This was the first animation I managed to create, since it involves the simplest polyhedron, but the lessons learned from it served as the foundation for the others.
WatchTime Tunnel
Time Tunnel
In 1996, I was in high school studying technical electronics at CEFET-RJ and was part of a group of students who wrote C++ programs on a "powerful" 386DX40 to create 3D animations using the most beautiful and pure mathematics.
In a moment of idleness and reflection, I started thinking about how the choices, friendships, and interests from that time influenced many of the steps I took later in life. I decided to pay tribute to all those experiences by rewriting some of those animations. Instead of Borland C++, I used p5js—without relying on any 3D modeling libraries. I hope you enjoy watching them as much as I enjoyed creating them.
The Sphere
The sphere brought the challenge of creating a solid whose points are obtained through the interpolation of trigonometric functions. Twenty-eight years ago, the solid sphere was static because my 386 couldn't handle the animation. So, by that time, I chose to animate only the wireframe view of the sphere.
Watch
The Icosahedron
Just a polyhedron slightly more complex than the cube. The challenge in this animation was mapping each face based on the points, with the edges ordered correctly so that the cross product of the edges of each face points the normal vector outward from the polyhedron. When I created this animation for the first time, I had the icosahedron "morph" into the cube and vice versa, but I didn't have time to include that feature in this remake.
Watch
The Grid
Another animation using interpolation through trigonometric functions. We affectionately called it the "drop". Back then, dual animation (the progression of the trigonometric function along with rotation on all three axes) wasn't possible due to limited processing power. It was a joy to finally see it working.
Watch
The Love
This animation holds special meaning. My dear friend and brother, Luciano Sother, originally came up with this animation, which he created back then as a tribute to his crush, displaying "Tatiana / I adore you". Sadly, in 2013, a heart attack took my beloved friend far too soon. Based on the memories of his animation, I recreated it for my beloved wife, but I give full credit and homage to my cherished friend.
Watch
The Texture
Using the well-known and efficient Bresenham's line algorithm, I developed a texture mapping algorithm. The computational cost of this process is high, which can lead to degraded UX on some mobile devices. Therefore, the experience is best suited for computers with a GPU. To mitigate this issue, I split the quadrilateral processing into two triangles and handled them in separate threads. I also created functions using WebGL commands to draw large batches of points, leveraging the GPU. Currently, these algorithms are executed directly on the graphics card hardware, resulting in a tremendous performance boost.
Watch
The Movie
This animation brings together the knowledge and techniques from the previous animations. It is a short film that narrates the creation of the cube — from individual points to its formation as a metallic solid through texture application.
For the best experience, please enable your device's audio.
Watch