Generative Art
- Started
- Last post
- 133 Responses
- autoflavour1
misusing generative fill in Photoshop Beta for good of man kind.
- and before you ask, yes, everything is ok at homeautoflavour
- although my homie who I share this account with still hasn't told his wife about it.. and my wife just says "I just cant dangermeat"autoflavour
- +1 followedPhanLo
- yeah it's just not any fun for merobthelad
- skinny_puppy2
- https://p5js.org/skinny_puppy
- The Coding Train FTW!palimpsest
- First video I watched but I enjoy his approach. I learned about the channel from someone here, possibly you?skinny_puppy
- I probably mentioned it on Discord. I like how he takes time to explain the concepts on the whiteboard first.palimpsest
- I mentioned p5js on discord when mg33 said he was messing with generative, then u recommended coding train.Thought maybe mg33 might show up n give us an update?cherub
- As for skinny puppy, are you getting the hang of it now? I love that video, it's def my favorite one I've seen of his. He's much more calm in this one.cherub
- I haven't had a chance to play with it sadly.skinny_puppy
- Then play with it happily?Nairn
- PhanLo1
Generative Lichen
https://x.com/OrrKislev
-
- ChrisKeegan5
- Oh, wow! You made this.
I fucking love it, man.Nairn - I mean, I see now that it says right <there, lol
Unlike dear Turing, I'm not the brightest.Nairn - Haha Thanks!ChrisKeegan
- ++++PhanLo
- Oh, wow! You made this.
- i_monk1
Most of this was Generative Fill on the first try, with only minor corrections needed again with GF.
- i_monk3
It's been 12 years (minus a week) since Scriptographer was last updated.
- still surprised with all the Adobe AI they haven't added LLM support to Ae and Ai scriptingkingsteven
- From what I remember the scripts were javascript so they can be ported to some other platform/framework etc?********
- Yeah you can use Paper.js
https://scriptograph…******** - http://paperjs.org/a…********
- mg3312
Where do you guys stand on using AI to write code to create generative art? That's what I spent a lot of time last year doing while I was out of work, and it kept me focused, engaged and happy to do that and offset the stress of looking for a new job.
I've built two tools / applications / whatever you want to call them that are web based built with HTML, CSS, and JS. They're running on a local server on my NAS now and basically do this:
Collage tool:
- HTML canvas can be 1:1, A1-A4 sizes, and 11x17. Background images are selected from a huge list of paper textures.
- I've got local folders mapped to multi-selects in the UI where I can select from different categories like nature, paper textures, mountains, custom SVG shapes, etc.
- I can choose a min and max width and a random width is chosen from those parameters. I can choose number of images, so if multiple are selected, that's randomized as well. Can also chose whether it uses original image, or crops to circle or square, or randomizes that.
- Ability to set number of square, circle, and line shapes to render on the canvas. Can set min/max size and randomize widths based on that, can rotate squares and lines 45 degrees.
- Can override specific randomization of shapes and input a number from which the tool randomly chooses shapes based on that number.
- Color palettes - huge set of palettes saved in JS that can be selected form a picker and applied to shapes in real-time. Colors are shown in small circles that can be unselected to remove from the canvas. Also has an "update" button that will randomize the colors amongst shapes with each click.
- Mixed blend modes - exclusion, difference, multiply, and normal applied to shapes and images, with ability to still display images as normal, but shapes in other modes.
- Generate button that renders images and shapes on the canvas based on all the parameters.
- HTML canvas is interactive to allow shapes and images to be moved.
- Export canvas as image to local folder.UI controls.
Shapes Pattern Tool:
- Same canvas approach as Collage tool, and ability to select backgrounds from a drop down.
- Canvas is set up as an adjustable grid from an input field that specifies number of columns.
- Shapes picker offering: squares, circles, randomized rotated eq. triangles, another combo of square, circle, triangle, and a custom shapes selector that pulls from a set of SVG shapes, patterns, etc. that can be selected in a multi-select field.
- Padding control - can be both positive value and negative (the negative padding was a "happy accident" and allows for all sorts of color interaction based on palette and mixed-blend mode.
- Color palettes (same functionality as collage tool)
- Randomize rotation - button to randomly rotate shapes within their grid cell.
- Ability to save as PNG, export composite / layered SVG file. The SVG export is great for taking these images and bringing them into InkScape and drawing with my pen plotter. More on that another time.UI controls and some output:
Some thoughts:
- Learning how to do this last year kept me focused on, well, being focused in a year I spent 8 months out of work.
- Admittedly, I could have written maybe one line of JS to do this. Both of these tools are pushing 1,000 lines of JS now.
- I hit roadblocks with Chat GPT, which I started with. Someone suggested Claude back in January and that changed everything. Better accuracy, and it was impressive to upload my original code from ChatGPT (and custom code) and ask it to tell me what it thought the tool did. It surmised that it was a collage tool, explained the JS, etc.
- I mentioned having a pen plotter. That's what somewhat kicked off all of this exploration, because I wanted to try and do something a bit more minimalistic and basic than going down the road of complex generative art, truchet tiles, and that sort of thing. I'm a big fan of bauhaus and brutalist art, and collage art, so that's where a lot of inspiration came from.
- I used to make art like this in PS all the time years and years ago. Loved layer interactions with color and transparency and blend modes. These tools either help me generate images quickly, which would take so much more time in PS (that's why I'm happy with all the parameters that are real-time updates, the color palettes, ability to swap backgrounds, etc.
- I've been using some images as idea-starters that I will edit further in PS or Illustrator. Trying to use these approaches for the artwork related to my music project, The Ageless Sea.
- I had both tools running on my live website for a few months, but moved them to my NAS and a local server, which runs so much better since I can map asset multi-selects to folders in my Design Assets folder. I've been using Bridge to manage most of that, and can easily drop image assets into a Temp folder to work through specific ideas.Anyhow, I know this was a lot, but it's been a blast and continues to be really satisfying to evolve it further and make imagery this way. Maybe I'll post some pen plotter art soon. It takes a while to create that stuff.
Lastly, someone in this thread or another one mentioned someone who is using AI to create stuff they're selling online. That's one of my goals, but I feel better about this stuff not being created with AI. The code was, of course, but not the images. It's all built on choices, randomization, and assets I actually have.
Someone also had a comment in another thread a while back where I shared some of these images, along the lines of "I could do this in PS in 5 minutes..." Yeah, most of us could, but I find the benefits and fun of this to be the quick nature of the randomization, the ease of bringing in multiple image assets, and ability to swap things out so quickly. I don't have any idea in PS or Illustrator how to swap palettes applied to shapes, or randomize colors applied to shapes instantly. I imagine it's a pain. All in all, I just find this method to be faster and more enjoyable, and though the intention in what's created is different than starting from a blank canvas in PS or Illustrator and deciding on every aspect of art on a canvas, the randomized nature of this is what I prefer, whether an image is good immediately, or whether I want to refine it further.
I continue to be unsure what to call all of this... is it generative? Is there a nuance because AI wrote the code? I think about all the crazy generative art being made, Josh Davis' years of processing.org work, and stuff made by others, and is there a big difference when it comes to some people editing their parameters in code, and my having a GUI to control the parameters?
Thanks for reading.
- Cool journey********
- Yes, developing your own tools to make creative stuff is way better than just asking chatgpt********
- Myself, built two tools so far for my uses in projects: halftone+pixelate script with controls for the effects and font pairing app********
- Both in Claude, but it's basically React code********
- Took like an hour total for BOTH, Claude is that good********
- Very cool. I don't think you need to be too concerned that you are using AI to realize your vision, it's a tool. Just call it 'art'.monNom
- I think it's precisely this kind of exploration and building of new capabilities that leads to creative breakthroughs. You aren't doing what everyone else is...monNom
- therefore you are going to get different results, have different inspiration, and you'll have different capabilities to execute your ideas. Keep going!monNom
- I appreciate your thoughts! I've got a ton of stuff I need to get uploaded to my IG page, but it's here if you'd like to follow: https://www.instagra…mg33
- If you want to check out one of the early versions I still have on my site:
https://mg33.com/gen…mg33 - I need to pull this down to free up some storage space, but I'll keep it up for a couple of days. Reminder that the canvas shapes can be dragged.mg33
- Congratulations on finding a job withing the last year. I can't even imagine that happening for me. Luckily, I still have a job.CyBrainX
- ^ Thank you. :) Was out of work from March - November after the agency I worked at was sold. Such a slog but doing so much better now than I was at my previousmg33
- job. It's just so much work finding a job, but I got my portfolio site updated and I won't need to do that again for quite a while, which feels good.mg33
- Very interesting what you have done. Respect.renderedred
- you could/should be posting on github :). you can also go openGL or p5.js (processing to js port) or any language! I think web is awesome! cool projects!uan
- call it open source and cc :)uan
- Cool!skinny_puppy
- Superb. Love the idea of building interfaces to create the art. The generative art I make is based on my 20+ yr old actionscript knowledge...microkorg
- ..its been accelerated massively since I've been using ChatGPT to help me code.microkorg
- Where do I stand? I stand on the side of this. This is exactly the sort of use of AI that we should be aspiring to. Microkorg did something similar, didn't you?Nairn
- Thank you for your amazing post. Great stuff.SimonFFM
- Simon, Nairn, microkorg, uan, skinnypuppy, renderedred, thanks so much. :)mg33
- Dude you need to move to Cursor, it'll be your Claude moment all over again. It admittedly uses Claude to write code but they fashioned it in such a way thatkalkal
- it can write code to full repos, multiple files, substantially longer files because etc, you could have thousands of lines of code.kalkal
- vscode style interface that supports all the vscode extensions too.kalkal
- Love it, congrats mgutopian
- Yeah, really nice shapes these.robthelad
- Cool journey
- ********-1
^
not really generative code, but you can get the script for the bitmap image effects here
you get something like this (pixelate and halftone effects)
- This is from Claude 3.7 sonnet********
- That's cool! I wonder if you could figure out a glitch effect to the halftone output that would move and stretch pixels?mg33
- good idea! Will ask my friend Claude about it over the weekend ;)********
- < I needed this to make some profile pics for website project in halftone and pixelated style - without going through apps like Ps********
- < works best with monotone or duotone images; also check "invert" box to have more contrast********
- This is from Claude 3.7 sonnet
- mg335
Had some ideas after posting about my tools earlier. Updated the gird-based tool to incorporate images into a specified number of shapes, which is something I was doing in PS when I'd import the composite SVGs. Really happy with how this turned out!
I'm using Bridge to manage all the assets, so it's easy to connect to my server folders and just copy / dump assets into those folders right in Bridge.
- these look very nice!
But they kinda make me want to take out some old magazines and cut and paste irl hehehe******** - Thank you! Interestingly enough, this is actually gotten me into the beginnings of making physical collages with cut up images.mg33
- I bought a scanner as well so that I can import stuff easily to use in the digital versions.mg33
- Somewhere ahead is a convergence of all of this with my own plotter, combining cut out stuff with plots.mg33
- You are on to something here********
- Nice <3
I've been having similar fun recently albeit a bit more chaotic. I like your controlled compositions.microkorg - +utopian
- these look very nice!
- mg338
I keep lucking into little accidents in one of my tools and managed to take it somewhere I wasn't expecting. I'm at 3,000 lines of JS now and it cracks me up when VS Code tells me "Complexity is 14 (or higher) you must be out of your mind."
I keep looking at the output and thinking "how would I even do this in PS or Illustrator?" Particularly where simply clicking the generate button executes the randomization, along with other aspects like the ability to randomize cell rotation. As I describe in my longer post, a lot of this has real-time updates, like colors, blend modes, and padding. Ability to use negative padding is what creates the overlaps when blend modes are used.
After incorporating the image inclusion feature, I realized I could use dozens or hundreds of images (single or multii-selected that are randomized), and find a nice balance between cells showing colors, and cells showing images.
All the shapes are either standard CSS shapes, or more complex SVGs from a multi-select list. I'm kind of limited by the shapes that work well, so I'm now realizing that the opportunities are endless when it comes to using images, textures, patterns, etc.
Thanks again for everyone's comments and enthusiasm in my previous posts, it's definitely motivated me to keep exploring new ideas. Claude is nearly flawless for writing this code. I don't know what I'm going to think of next.
- Love the first two.
Wish there was a way to get drawings into code like that, like we were able to do 20 years ago in Flash.PhanLo - Have a trawl of sites like fxhash, over the years Ive seen some great pencil and paint-like pieces. It is possible with code.microkorg
- +1 on the first 2, especially #1. These are a step up from your previous pieces IMO. Some of the others are a bit busy/contrasty for my taste.monNom
- Great job, are you going make the code/app available for purchase?utopian
- Thanks everyone. monNom - thank you, and agreed. The busy ones were just seeing what's possible. Reminds me a bit too much of early 2000's Vir2l type of art.mg33
- utopian - I'm not sure, but might think about that. Right now it's so specifically set up to server, and i need to see how the code would be modified to allowmg33
- it to be installed easily.mg33
- This guy created and set-up his visual experiments like you did, and then built an online brand/app. www.moshpro.apputopian
- Love the first one!renderedred
- utopian - interesting... that gets my gears going! I'd have to put a ton of thought into how that would work, especially since I've got so much local stuff thatmg33
- is used from my server folders. I could see a lite version that uses a small number of color palettes and images, and a pro version that lets you upload yourmg33
- own images.mg33
- I've got another project ahead of that that I'm hoping to work on soon that will be a native or web app. Still doing some learning to get there.mg33
- It's a songwriting idea tool that offers a variety of randomized starting points for new compositions. Nothing generative or AI-based, more of a randomized flowmg33
- that offers suggestions on different songwriting aspects, lets you store notes, song progress, etc.mg33
- Love the first two.
- autoflavour2
ive been using chatgpt to write swift code to build something akin to the whole joshua davis praystation flash random placement of asset thing.. much more basic approach.. but yep, been having some fun
- Nice. Any examples yet?mg33
- this is a super test version.. i build this app mainly just to place things around to do layup for murals.. this was just using a bunch of test assetsautoflavour
- https://i.imgur.com/…autoflavour
- basically can draw a line in the frame and it will select images randomly from a folder and seed along the line. multiple layers, and can layer backgroundsautoflavour
- also mirroring, few basic tools. im sure i could do it all in illustrator, but i wanted something i can do on site live at the wall..autoflavour
- yet to actually use it for painting yet, thats the plan this weekend..autoflavour
- praystation was great. I think it pulled random assets from the chaos server, then combined it locally according to a rule set.cherub
- I remember at the time him saying it was a synthesis of random and non-random data.cherub
- He released a processing library to achieve similar results a while back - doesn't look to have been updated in some time: github.com/hype/HYPE...duckseason
- https://github.com/h…duckseason
- I used it for a couple projects way back when with pretty good resultsduckseason
- I reached out to praystation and he shared the link to all the old pages with Flash download links.microkorg
- Sadly they wont run on Animate, you'd have to have an old version fo Flash to run some of them.microkorg
