Creating Code Art at Lightspeed with Generative AI

Dominoes from code

"Creativity is intelligence having fun."

Many of you have likely heard of generative AI and chatbots such as chatGPT, Claude, or others. In this post, I’ll explain how you can use generative AI and ChatGPT o3-mini as a creative collaborator to create images just like the one above.

As you may have noticed, one of my many hobbies is creating visual art using code. I have used python in the past, but most of the time, I default to p5.js as it is designed for this purpose and can easily be incorporate into webpages since it is javascript. With the continuing advances in generative AI, I came to the realization that it might be possible to partner with ChatGPT to accelerate these creations and allow me more time to focus on the ideas instead of looking up syntax. For those coders out there, you know what I”m talking about. A side benefit of this is demonstrating that anyone can do it, even if you don’t know any code which opens the doors to this style of art to anyone with access to a browser and ChatGPT.

The Concept

In my “Fractured” post, I touched on how I use ChatGPT to spark ideas and jump start the creation process. Although it did help get things going, I still had to do a good chunk of the work and “coerce” ChatGPT to give me what I wanted. With the recent release of OpenAI’s reasoning models, o3-mini and o3-mini-high (better at coding), it became apparent that I may be able to truly collaborate and focus all of my effort on idea creation and continuous innovation. 

These new models are very good at math, coding and reasoning and are the ones that peform as well as the top 75 coders in the world. I’m definitely not one of the top 75 coders in the world, and likely not one of the top 75000 coders in the world, but I do know enough to be dangerous. However, I do have lots of random ideas popping in and out of my head all the time, so, if I remove the burden of having to think about whether something is possible in code and how to develop it, I can simply have a conversation with ChatGPT. It’s like working with a coding genius who can also bounce ideas back and forth to get to something you didn’t originally envision.

Enough of the chatting, let’s jump into some examples. And, by the way, let me know in the comments if you’d like me to share the code or additional details.

Regenerating Ideas from the Past

One of the first things I wanted to try was to recreate some of the generative art pieces I created in the past so I could validate my thinking that this approach will dramatically speed up the process. What I learned was that I can get from idea to visualization in a few minutes versus several hours. What was even more suprising is that the results turned out to be very similar. 

Particle Art

I’ve always liked the old screen savers which drew what looked like an interlocking set of triangles that would contstantly change as floating particles interacted with each other on the screen. The idea is to generate a set of particles and have them float around the screen based on some type of rules usually involving a direction, velocity and acceleration. As that isn’t super interesting, you then connect each particle to all others within a given distance. The result is the expected  set of evolving triangles and what looks like a lattice of triangles. The algorithm can also be modified in different ways to create different effects. 

In the past, I did all of this step-by-step after lots of trial and error and reading the p5.js reference guides. What I confirmed is that when using the ChatGPT 03-mini-high model, I was able to jump straight from idea to working visualization in less than 1 minute! This is the first example below. Because this was generated so quickly, I was able to iterate on the idea over several minutes and several different variations of the original concept. The outputs varied from the triangle lattice, to abstract textures, to particles which orbit around a central point and interact with each other (second live example below). 

Particle Lattice
Orbiting Particles

In case you’re wondering, no, ChatGPT doesn’t create the visualization for you. It provides the explanation and the code. To see the full ChatGPT interaction, click here.

You can then copy the code from ChatGPT directly into an editor like Visual Studio Code, or just paste into the live p5.js editor on their website (feel free to try some of the code from the chat interaction yourself). I typically use the p5.js editor to quickly visualize what was suggested but then bring into visual studio code for additional enhancements and later use in blog posts such as this.

As I go through the process, I save the images I like and sometimes further enhance in Photoshop if I’m going for a more advanced look. 

Skyline Art

Another one of my artistic experiments with p5.js was to simulate city skylines. It initially started as a series of rectangles which were drawn with “sketchy” lines and were taller in the middle based on a bell curve. I also added a reflection. This version took quite some time and was built iteratively over several days. 

my first version of "skylines"

Later, I decided to take a different approach to generate a few layers of buildings with windows and a grainy texture as well as a variety of colors using color palettes I created. This also took several days and many, many iterations. It’s quite a bit different than the first version above, but both are interesting in their own respects. Learn more about this version in my earlier blog post.

my 2nd version of "skylines"

With that as the background, I wondered how well AI could replicate my creation if given enough prompting. After only a few iterations, I was able to get close in less than 30 minutes. While I believe my originals are still better and have more character, this version is pretty good after only 30 minutes and it would be interesting how much additional time would be needed to create an exact replica.

To see the full conversation with chatGPT, click here. Feel free to explore on your own.

chatGPT version of "skylines"

New Creations

The previous examples were all recreations of previously implemented ideas demonstrating how a similar output can be achieved in far less time. But how good is it at creating something new?

Well, quite good. What I’m finding is that now when I have an idea, I don’t need to write it down. I can simply immediately type it into ChatGPT, or speak it, and get an immediate result and either continue to iterate or save it for later.

This final example was triggered by a simple game of dominoes. We were talking about playing one evening and I had the thought to generate random abstract art from dominoes. This would be an idea I would typically forget about as it would take too long to figure out how to write the code and it doesn’t scream “this is something worth pursuing”. However, with my AI partner at my side, I decided to give it a try. 

It started from a simple suggestion – “i’d like to create a piece of art using p5.js that visualizes dominoes. I’d like to have them placed on the screen such that they are oriented either horizontally or vertically starting from the center. the edges should be more jagged and not go all the way to the edge.” The first version wasn’t so great, but, it was much better than I expected and was so quick that I decided to suggest a number of enhancements, starting from adding the “pips” and divider lines to rounded corners and gaps between the dominoes (see below).

first iteration
third iteration

Several iterations later and I had something I could work with and modify to deliver my original vision of dynamically generated domino layouts which could later form the basis for an abstract art piece. See the code in action below. 

Once again, if you’d like to see the entire chat and each variation of the suggested code so you can try it yourself, click here

Final Thoughts

Generative AI has opened up new possibilities for creativity, making it easier than ever to bring ideas to life without getting stuck in technical details. Whether you’re a seasoned coder or someone who has never written a line of code, tools like ChatGPT can act as a creative collaborator, helping you bridge the gap between imagination and execution.

For me, this approach has drastically reduced the time from concept to visualization, allowing for rapid iteration and new artistic explorations I might not have pursued otherwise. The ability to co-create with AI not only streamlines the process but also introduces an element of surprise, where unexpected variations emerge—often leading to results better than my original vision.

If you’re curious, I encourage you to experiment. Start with a simple prompt, see what unfolds, and refine your ideas along the way. You might be surprised at what you can create when working alongside AI.

Let me know in the comments—what kind of generative art would you like to explore? Have you tried using AI in your creative process? I’d love to hear your thoughts!

Share This Post

Leave a Comment

Your email address will not be published. Required fields are marked *

More To Explore