Timings
Timings is an abstract generative series that emphasizes the pervasive importance of minute temporal differences in shaping and creating outcomes. The algorithm is composed of two subsystems that interact via multiple controls that are triggered and/or modulated by the number of frames that passed since the animation started. The resulting animations range from smooth to chaotic and create a wide variety of unique abstract outputs ranging from minimalist to complex and aims to contemplate the butterfly effect that timing can have on outcomes. The experience will take you somewhere, but that can only be captured by the viewer's imagination.
512
Max supply
0.08 eth
Mint price
The story behind the art
Time, as a constant force that shapes our environment, is a recurring theme in my artistic explorations. The vision for this series was to create an algorithm that is parameterized as much as possible by the passage of time. In p5.js, the JavaScript library I used for this project, I implemented this by allowing a multitude of graphical parameters to vary over time via "frameCount", a function that tracks the number of frames that have elapsed since the animation began. Size, shape, stroke weight (the width of lines or dots), fill colour and transparency gradients could vary over time. I didn't have a very clear graphic concept in mind when I started, and I gave myself the freedom to experiment and test multiple ideas.
Weeks of experimentation led me to the idea of combining two systems, one based on points and the other on rectangles. The layered, wave-like and splash-like layouts
created with the dots were achieved by combining sin and cos functions with gradient noise and a degree of randomness. The tricky part was to parameterize the evolution of the size of the dots over time, so that the larger dots at the beginning of the animation participate in the creation of the background through larger brushes and splashes and the very small dots towards the end of the animation add a texture layer. The second system is based on rectangles of different sizes and shapes that traverse the canvas and, in some iterations, rotate around their point of origin. To increase the diversity of the results, the rectangles appear in two very distinct modes, one more controlled and the other allowing for greater stochasticity. With the two systems in place, the hardest part was tuning them so that when drawn together, they created the harmonious results that are difficult to define. In terms of colours, I gathered over 50 hand-picked palettes.
However, the final colours of the artwork are modified based on their red, green, blue and alpha (transparency) channels. To do this, I first converted the hexadecimal colour code to RGBA, which allowed me to introduce additional hue and transparency gradations, which were allowed to vary depending on the "frameCount" or vertical position on the canvas.
All of the above procedures were performed on a single main canvas, without buffers or overlays, and the resulting short animation viewed in live mode. The resulting animations range from smooth to chaotic and create a wide variety of unique abstract results ranging from minimalist to complex and aim to contemplate the butterfly effect that timing can have on the results. The experience will take you somewhere, but that can only be captured by the viewer's imagination.
Technical steps
The first step was the selection of the attributes (palette, background, stroke size, etc.) as well as the conversion of the hexadecimal colour code to RGBA.
➊
➋
➌
➍
The second step was the creation of the point-based system that can draw background layouts as well as texture. A recursive loop was used to draw the points at different x and y values determined by gradient noise and cos and sin functions to create wavy patterns. The size of the points is allowed to change with the time passed since the onset of the animation, so that they act as texture towards the end of the animation.
The third step was the introduction of the moving rectangles through another recursive loop where the y-axis position is mediated by gradient noise. The rectangles are either rotating or not, and their attributes (size, colour, line type, etc.) are changing with the time with the help of the “frameCount” function in p5.js which counts the number of frames passed since the beginning of the drawing.
The fourth and most difficult step was the parameterization of the graphical parameters/attributes of the point and rectangle systems so that their evolution with time and interaction on the canvas leads to esthetical outputs.
I am Alex, a researcher in ecology, and I am known as 1Abstract in the generative art space. I am of Eastern European origin, but of mixed culture (Romanian, French, English and German ) and I am currently settled in Montpellier, south of France. Creating generative art has been my main hobby for over a year and a half now. My first contact with generative art was through the R programming language I need to run statistical tests for my research data, but I quickly became interested in JavaScript once I discovered long-form generative art and the challenges and beauty that come with it.
“