Do you have any idea how to create a similar shape ?
By similar I mean a closed space-filling curve with pleats of similar size happening at regular intervals
According to the hashtags it is a bezier curve, evolving in real-time and coded using p5js. While I believe it is indeed a bezier curve, I tend to think it is neither made with p5js (feels like a hashtag chosen to increase visibility) nor “growing” in real-time (seems like a pre-computed curve that is unveiled bit by bit).
The whole thing feels organic as it was “grown” or using some springs with repulsion forces.
Glad to hear I’m not the only one thinking it’s not made in real-time.
I still have a doubt about the making of the curve, do you really think it is hand-drawn ? The filling of the space is very homogeneous (uniformly distributed) and the overall shape seems to perfectly fit a circle, as if the whole procedure was automated.
I have looked for expressions like “space filling bezier” or “pleats generation” on OpenProcessing and Google but didn’t find anything so far.
I think it’s quite easy to do with something like inkscape or illustrator.
You can use a real circle to guide you when drawing your curves and then delete it.
At least, I can’t think of any simple way to achieve this result with code only.
But now I’m intrigue =) If I think of something I’ll let you know.
Didn’t know about such function in illustrator or inscape, thank you for the hint.
Still, I would love to come up with a strategy to achieve a similar result with code only. (I’m intrigued as well! )
A few assumptions for brainstorming:
sophisticated random walk: sin/cos-based turning system + collision detection + tracking of already visited places
rounded path: generation of a maze on a circular mesh that outputs a single path that is then rounded (vertices become control points of a bezier curve)
physics simulation: long closed curve made of springs with repulsive vertices (repulsion forces) “compressed” within a circle
Turns out the author sold this animation as an NFT. The description says:
Built with code in rhino, gh3d and p5js.
I’m convinced now that most (it not all) of the creation process happened in Rhino and gh3d. Unfortunately I don’t know anything about these environments.
I thought about this as well but didn’t mention it because it doesn’t seem to be a plausible option to me. The pattern is too different, with nested pleats (pleats within pleats) and multi-layered curves (curves following the same path but with a slight offset). Those patterns usually don’t appear in a traditional “differential growth” algorithm.
Unless it is “grown” in a special manner. But then what would be “tweaks” ?
On his Twitter, he implies that he uses what sounds like a particle simulation to grow the loops with collision avoidance and forces to keep the path straight.
From he description it does sound like he’s using a “differential growth” algorithm as @jb4x suggested !
The output is still different from everything I’ve seen before though. Maybe he’s selecting the parts of the closed curve he wants to grow, instead of applying a growth behavior to the whole loop. That way it might allow for the formation of long non-folding curves.
Hi, liukov!
I am still learning, Processing with emphasis Python, but I know JavaScript. The reason I say that at first is because I am reading a book, ‘Learn Python Visually, Creative Coding with Processing.py’ In this book the author, Tristan Bunn, Lissajous Curves and teaches how to create them using Processing. With some effort you would be able to convert the Python code to JavaScript (things like add ‘;’ at the end of a line of code, for instance). I hope this might take you in the right direction.
)
