For anyone that wants to try this type of coding, I would recommend just to start. Pick your favorite language and just start drawing things. You will often need some thing that you don't know, but you will learn as you go. It often feels like 'hacking' to get result. Coding train, reddit, and personal blogs are perfect starting points. Remember, like in any art, it is about process, not result.
BTW: Every January is month of creative coding (https://genuary.art/), so you can join hundreds of other artists in 'solving' daily prompts. I did last Genuary (well not all prompts), and I got some some results that I am proud of (https://github.com/ubavic/genuary2022). That was the first time I coded in Processing.
The YouTube channel is created by Daniel Shiffman, the author of _Nature of Code: Simulating Natural Systems with Processing_. It's one of my all-time favorite books.
I love Processing. I actually used it to make a GUI and some data visualisation tools for my Comp Sci MSc. The bulk of the project was a Java program to do with time series analysis, but I'm not a graphics person and didn't want to learn Swing, JavaFX, HTML/JS or anything "serious". It was a joy to use.
In case someone doesn't know, since Processing is written in Java it can be used as a library in any Java project instead of from inside the Processing IDE.
What makes Processing useful for such visualizations? Haven't really looked at it, but the tutorial here [1] begins with rendering images and then combining them into a gif, which seems a bit awkward?
Making gifs with processing is (weirdly) one of the more painful exercises in the framework. Kind of baffling, given the goals of the project.
Regardless, the best thing about processing is that it makes getting the first pixels on the screen extremely easy. Like two lines of code. In normal Java that’s a highly nontrivial exercise with lots of incidental complexity and boilerplate.
For creative visual work, just getting something on the screen and then iterating quickly is the key. It keeps the ideas flowing.
Processing has a lot of useful primitives for drawing and animation as well, combining them into interesting patterns is very straightforward. On top of that the documentation is really well done, it’s written in a very accessible tone and it has tons of useful examples.
py5 is a version of Processing for Python 3.8+ that is well integrated into the Python ecosystem. It connects the Processing Jars to Python using JPype. If you like Processing, please give it a try!
Oh nice! I enjoyed reading Nature of Code when it launched on Kickstarter over a decade ago, but the barebones IDE and the Java heritage always turned me off. And p5.js was, well, Javascript. I spent some time porting some of the functions to Python, but realized to make it useful it'd be a bigger effort than I had time and skill.
Py5 looks awesome! Will give it a try soon. Thanks for your work!
ps: I noticed you're using JPype to connect to the Java Processing libraries. Very smart.
> I spent some time porting some of the functions to Python, but realized to make it useful it'd be a bigger effort than I had time and skill.
Getting py5 off the ground started during pandemic lockdown and took many months. Managing the source code is best done computationally, with py5generator creating the actual py5 source code.
Nice! Thanks for creating that, I just finished a small processing project that involved a lot of array and data structure manipulation and that kind of work odd really unpleasant in Java, especially when compared to python. Better gif creation is excellent too.
If I was writing production grade software, I wouldn't have used Processing for the client. But for the purposes of an academic project, where a backend-type like me wanted to draw some pixels without too much fuss, it was perfect.
He's just saving the output as an extra, but when you run the sketch you can see it displayed as well.
> What makes Processing useful for such visualizations?
You have a bunch of useful primitives to draw stuff on screen immediately, without having to go through all the troubles that this entails with a normal programming language. It's really fun!
"Processing is a flexible software sketchbook and a language for learning how to code."
"The Processing software has always been free and open source and has always run on Mac OS, Windows, and Linux."
"The Processing community has written more than a hundred libraries for computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics."
A little while ago, for a university introductory course to programming we had to use Processing for generative art. I created a little 3D island generator using P3D:
This works quite well with ChatGPT. I asked it for various animations, asked it to be more organic, breathing, flying, various other neat effects, then pasted it back to Processing. It super neat creating these animations with NLP.
Mountains of work is what learning looks like as an adult.
The bigger the mountains look, the more you will learn.
If you know Python, learning another library looks like a bump in the road because you already have an adult level of proficiency that was built over a lifetime.
Learning to dance ballet looks like an impassible wall to most adults, because we know that competent ballet dancing requires years of training. And forget about virtuosity.
Adults tend to limit their learning to "new Python libraries."
Because one thing is for sure, most of learning to dance ballet will involve sucking at dancing ballet. And probably all of it unless you are lucky.
---
But, for me, there's a difference between wishing I was better at things like mathematics and wanting proficiency in things like mathematics.
The difference comes from my actual interest in mathematics. My equilibrium state is quenched curiosity regarding mathematics. I learn about mathematics in proportion to my current curiosity.
If I wanted to get good at making loops with Processing, I would just start trying to make loops and letting myself be bad at it. I wouldn't study mathematics. I would play.
Unfortunately there's also bodies. I have proficiency in several martial arts, but I haven't really trained for over a decade. So I figured I'd go to a training. Now I'm able to hold myself together, it just takes a long time to recover.
2 weeks, to be precise, until my back stops hurting. My hand (yes I made a mistake) took over a year.
Start simple and just play around. Fractals and L-systems are really satisfying and very simple, well documented places to start (but they are capable of incredible complexity and beauty). Check out implementing something like the koch snowflake or dragon curve: https://fedimser.github.io/l-systems.html
the math and coding involved is not that difficult. there are no arcane concepts to master and the process is generally quite procedural (attempted pun): computer do this, do that, etc, typically in some loop that creates most of the magic feeling.
there is a level of abstraction that one needs to master: sets of variables, simple algebraic equations, functions etc. but climbing that mountain is harder that it needs be because in general education these core concepts are generally burried among many other (and less relevant for this type of task concepts).
ideally somebody would write a small textbook with the basic mathematical concepts involved in generative computer graphics. alternatively, work backwards from some examples. if you persist the path you need to travel, while longish, is doable.
I know there are plenty of similar pages, but check out these smooth looping animations created with Processing (https://processing.org/) as well as the tutorials/FAQ from this site.
For anyone that wants to try this type of coding, I would recommend just to start. Pick your favorite language and just start drawing things. You will often need some thing that you don't know, but you will learn as you go. It often feels like 'hacking' to get result. Coding train, reddit, and personal blogs are perfect starting points. Remember, like in any art, it is about process, not result.
BTW: Every January is month of creative coding (https://genuary.art/), so you can join hundreds of other artists in 'solving' daily prompts. I did last Genuary (well not all prompts), and I got some some results that I am proud of (https://github.com/ubavic/genuary2022). That was the first time I coded in Processing.
> I would recommend just to start
That's good advice for most things, except perhaps free climbing or fire eating.
Give a man a fire and he will be warm for the day, set a man on fire and he will be warm for the rest of his life
GNU Terry Pratchett
(c.f. http://www.gnuterrypratchett.com/ )
From the FAQ:
> To learn to draw stuff with code, I suggest watching The Coding Train. https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1_aw
The YouTube channel is created by Daniel Shiffman, the author of _Nature of Code: Simulating Natural Systems with Processing_. It's one of my all-time favorite books.
https://natureofcode.com/
Wow. These animations are incredible. Inspiring!
I love Processing. I actually used it to make a GUI and some data visualisation tools for my Comp Sci MSc. The bulk of the project was a Java program to do with time series analysis, but I'm not a graphics person and didn't want to learn Swing, JavaFX, HTML/JS or anything "serious". It was a joy to use.
I agree!
In case someone doesn't know, since Processing is written in Java it can be used as a library in any Java project instead of from inside the Processing IDE.
What makes Processing useful for such visualizations? Haven't really looked at it, but the tutorial here [1] begins with rendering images and then combining them into a gif, which seems a bit awkward?
[1] https://bleuje.com/tutorial1/
Making gifs with processing is (weirdly) one of the more painful exercises in the framework. Kind of baffling, given the goals of the project.
Regardless, the best thing about processing is that it makes getting the first pixels on the screen extremely easy. Like two lines of code. In normal Java that’s a highly nontrivial exercise with lots of incidental complexity and boilerplate.
For creative visual work, just getting something on the screen and then iterating quickly is the key. It keeps the ideas flowing.
Processing has a lot of useful primitives for drawing and animation as well, combining them into interesting patterns is very straightforward. On top of that the documentation is really well done, it’s written in a very accessible tone and it has tons of useful examples.
> Making gifs with processing is (weirdly) one of the more painful exercises in the framework. Kind of baffling, given the goals of the project.
FWIW, py5 makes it very easy to create animated GIFs. You can create a GIF from a running sketch with one line of code:
https://py5coding.org/reference/py5tools_animated_gif.html
py5 is a version of Processing for Python 3.8+ that is well integrated into the Python ecosystem. It connects the Processing Jars to Python using JPype. If you like Processing, please give it a try!
(I am the author of py5)
Oh nice! I enjoyed reading Nature of Code when it launched on Kickstarter over a decade ago, but the barebones IDE and the Java heritage always turned me off. And p5.js was, well, Javascript. I spent some time porting some of the functions to Python, but realized to make it useful it'd be a bigger effort than I had time and skill.
Py5 looks awesome! Will give it a try soon. Thanks for your work!
ps: I noticed you're using JPype to connect to the Java Processing libraries. Very smart.
> I spent some time porting some of the functions to Python, but realized to make it useful it'd be a bigger effort than I had time and skill.
Getting py5 off the ground started during pandemic lockdown and took many months. Managing the source code is best done computationally, with py5generator creating the actual py5 source code.
https://github.com/py5coding/py5generator https://github.com/py5coding/py5
> ps: I noticed you're using JPype to connect to the Java Processing libraries. Very smart.
JPype is a solid and well maintained library. With JPype, py5 is well positioned to work with numpy and the rest of python's scientific tools.
> Py5 looks awesome! Will give it a try soon. Thanks for your work!
You are welcome! I hope you enjoy it!
Nice! Thanks for creating that, I just finished a small processing project that involved a lot of array and data structure manipulation and that kind of work odd really unpleasant in Java, especially when compared to python. Better gif creation is excellent too.
Definitely going to give py5 a try.
Yeah this is the point.
If I was writing production grade software, I wouldn't have used Processing for the client. But for the purposes of an academic project, where a backend-type like me wanted to draw some pixels without too much fuss, it was perfect.
He's just saving the output as an extra, but when you run the sketch you can see it displayed as well.
> What makes Processing useful for such visualizations?
You have a bunch of useful primitives to draw stuff on screen immediately, without having to go through all the troubles that this entails with a normal programming language. It's really fun!
Are these all done with Processing? Love the first one on this page: https://bleuje.com/animationsite/2021_2/
They’re pretty amazing.
Looks like it it’s processing (not processings JavaScript cousin p5js).
There is a tutorials section where the workflow is discussed. And how to create the infinite style loops.
https://bleuje.com/tutorial1/
It’s processing then exported as gif to animated gif.
This is something that is pretty much whats closest to my heart. The creative coding / visual scene.
Here is a good list.
https://github.com/kosmos/awesome-generative-art
Also… Shaders ! Is a great way to start.
https://www.vimeo.com/nrlnd
Thats my work. All realtime.
I clicked on the 'Latest Animations' link on the site and lost half an hour of my Saturday morning. Some excellent animations there. Thank you!
Yeah the same thing happened to me as well, sorry :-)
If anyone (like me) is wondering what/where "Processing" is: https://processing.org
"Processing is a flexible software sketchbook and a language for learning how to code."
"The Processing software has always been free and open source and has always run on Mac OS, Windows, and Linux."
"The Processing community has written more than a hundred libraries for computer vision, data visualization, music composition, networking, 3D file exporting, and programming electronics."
This is absolutely stunning!
A little while ago, for a university introductory course to programming we had to use Processing for generative art. I created a little 3D island generator using P3D:
https://github.com/ArjoNagelhout/3D_Island_Generator_In_Proc...
This works quite well with ChatGPT. I asked it for various animations, asked it to be more organic, breathing, flying, various other neat effects, then pasted it back to Processing. It super neat creating these animations with NLP.
i really want to learn to make these but the math always feels like a mountain of work to learn and i end up discouraged.
i find these works so interesting and mesmerizing. really jealous of the talented artists/programmers making these.
Not being snarky.
Mountains of work is what learning looks like as an adult.
The bigger the mountains look, the more you will learn.
If you know Python, learning another library looks like a bump in the road because you already have an adult level of proficiency that was built over a lifetime.
Learning to dance ballet looks like an impassible wall to most adults, because we know that competent ballet dancing requires years of training. And forget about virtuosity.
Adults tend to limit their learning to "new Python libraries."
Because one thing is for sure, most of learning to dance ballet will involve sucking at dancing ballet. And probably all of it unless you are lucky.
---
But, for me, there's a difference between wishing I was better at things like mathematics and wanting proficiency in things like mathematics.
The difference comes from my actual interest in mathematics. My equilibrium state is quenched curiosity regarding mathematics. I learn about mathematics in proportion to my current curiosity.
If I wanted to get good at making loops with Processing, I would just start trying to make loops and letting myself be bad at it. I wouldn't study mathematics. I would play.
Unfortunately there's also bodies. I have proficiency in several martial arts, but I haven't really trained for over a decade. So I figured I'd go to a training. Now I'm able to hold myself together, it just takes a long time to recover.
2 weeks, to be precise, until my back stops hurting. My hand (yes I made a mistake) took over a year.
I'm biking now. No more falling. Thanks.
Go through this and you will learn all the math needed: https://natureofcode.com/
Don't start with the entire mountain, start with a tiny hill that produces (visual) results!
Start simple and just play around. Fractals and L-systems are really satisfying and very simple, well documented places to start (but they are capable of incredible complexity and beauty). Check out implementing something like the koch snowflake or dragon curve: https://fedimser.github.io/l-systems.html
the math and coding involved is not that difficult. there are no arcane concepts to master and the process is generally quite procedural (attempted pun): computer do this, do that, etc, typically in some loop that creates most of the magic feeling.
there is a level of abstraction that one needs to master: sets of variables, simple algebraic equations, functions etc. but climbing that mountain is harder that it needs be because in general education these core concepts are generally burried among many other (and less relevant for this type of task concepts).
ideally somebody would write a small textbook with the basic mathematical concepts involved in generative computer graphics. alternatively, work backwards from some examples. if you persist the path you need to travel, while longish, is doable.
surprised to not see anyone mention https://shadertoy.com
also check out bonzomatic:
https://github.com/Gargaj/Bonzomatic
You can find some live bonzomatic shader coding vids on youtube too, it's even done competitively at demo parties these days:
https://www.youtube.com/results?search_query=bonzomatic
I know there are plenty of similar pages, but check out these smooth looping animations created with Processing (https://processing.org/) as well as the tutorials/FAQ from this site.
Is there a Python library to generate such animations?
Yes! There is py5.
https://py5coding.org/
This version of Processing uses the amazing JPype library to connect the Processing Jars (Java) to Python 3.8+.
(I am the creator of py5)
Processing is working on a python port, though it seems to lack some of the features of the other versions it seems functional.
https://py.processing.org/tutorials/
https://processingfoundation.org/projects
Some of these actually gave me shivers. Nice work!