“My-own-nebula” project: generative art with processing.py and p5.js

Jelena Ristic
3 min readApr 3, 2022
Example of output of my-own-nebula generative art project (Jelena Ristic, 2022)

Nebulas are beautiful space objects — gas and dust clouds with distinctive colours, acting as star nurseries. Watching a PyCon 2018 conference by Emily Xie gave me a great basis to build upon and use processing.py and then p5.js to build an interactive interface that draws a human-machine generated output that resembles nebulas. It was important to me that the interface allows user input to alter the generated output and make their own version, and also that it can be outputted in a browser, therefore I translated the python code to p5.js and ran it in the processing app to check for bugs, typos, etc.

If you wish to try it yourself, go to processing.org to download the app. It is a great sketchbook with an impressive array of functions allowing you to play and code form, data, images, colour, typography, and more. To start with the basics, it requires 2 functions: setup() to setup your playground boundaries (such as canvas size, etc.) and draw() that will execute your creative lines of code. In the “Tools” menu, you can access libraries, modes, etc. Make sure you have python and p5.js modes on. The documentation is great and clear, so it was easy to dive into it.

my-own-nebula web interface (Jelena Ristic, 2022)

My-own-nebula is basically a live update on screen of endlessly repeated circles (or sections of) that are drawn and overlaid. The mouse cursor operates as a centre and guide to the automatically generated circle arc, the amplitude slider determines the max deployment angle for the circle arc (min 10 degrees and max 360 for the full circle). Press any key and the output is saved as a tif file. The shape randomness is achieved thanks to the Perlin noise function. At each iteration the drawn arc either diminishes or grows depending whether its radius has a positive or negative value.

Here is my final p5.js code:

For the whole project, please visit : jelrist/my-own-nebula: Generative art project originally written in processing.py and converted to p5.js for web display (github.com)

If you create your own, I’d be happy to see your versions, so don’t hesitate to let me know!

Many thanks for reading!

Would you like to support me and other writers on Medium?

To get access to unlimited stories, you can also consider signing up to become a Medium member for just 5$. If you sign up using my link, I’ll receive a small commission at no extra cost to you. Thank you!

--

--

Jelena Ristic

Creative t(h)inker, former museum curator, and python enthusiast delving into the wondrous realm of digital humanities. Reach me at hello@jelenaristic.info