I would start off by learning the Canvas API for HTML/JavaScript [1][2]. All you need is a web browser, no extra software or dependencies (well, maybe just a text editor to edit an index.html file on your Desktop). You can test out snippets from MDN and StackOverflow in your browser’s JavaScript console. Once you have a minimal, working example (e.g., a 512x512 square canvas with a color gradient), start messing around with the code and see how it affects the canvas image. For example, modify the parameters of your loops or flip the loop order of nested loops. Focus on the principles rather than on learning any particular technology. Simpler is better when learning; the “best” production software is not necessarily the best to learn with; don’t forget the Telescope Rule [3]. Once you have a foundation for basic graphics, it will be much easier to learn shaders.
Daniel Shiffman has amazing resources for Processing that apply to any language/environment. He practically invented half of the stuff out there. Jared Tarbell (who was involved with the founding of Etsy) is also a great generative artist who's made code available.
And if you were an old man like me, you would have had a forum called Dreamless to refer to, but alas, that dream is twenty years gone now.
As much as I like Shiffman’s YouTube channel, I don’t think he “invented” that many of the algorithms shown in his video. Cleverly adapted or explained? Sure.
Second for Inigo Quilez. Wonderful presentation for procedurally generated at. He’s also ex-Pixar and creator of https://shadertoy.com (which is also a great resource) and https://graphtoy.com
Inigo is amazing. He explains difficult things really well. I really appreciate his live coding videos where he recreates some of his famous shadertoys.
Inigo and Martijn (the art of code) are really good teachers. I've learned a lot about shader programming by watching their videos
But you can "see and watch" things in a text-based tutorial. Short video clips and images are a key part of it. Like I've said elsewhere - it's the "person talking" bit and the linear format that I struggle with. I can skim text+images whereas video+speech forces me to consume it in large chunks at a predetermined speed (1.5x not withstanding. That's only a minor improvement)
I used to not like videos, but then I started leaving them on in the background. I don't think it's too different from having a teacher draw on a board in front of a class.
For me, these videos are about problem solving. It's nice to watch other people solve problems, and explain difficult topics as they solve the problems in that domain...
The low bandwidth of audio means that you can jump around with more aplomb and still get a smart foot where you are and if you missed anything, than if it were more information dense. You can also listen to it at 1.2 or 1.5 speed to up the density.
See - that doesn't make sense to me. It's also the difficulty with random access that really annoys me about video tutorials. I can jump down a page of text+images and quickly figure out where to start. If I lose my place in a video I inevitably have to roughly find the spot and listen to some stuff I've already heard.
Yeah - I've got no problem with video as medium - it's the "listen to someone talking instead of reading words" thing that I've never understood. But as others have said - it's the effort needed to produce that might be the key factor here.
Draw a line. Then draw another. Write a for loop to draw the lines. Make them different widths. Now try different colors. Rotate the lines. Try making it recursive.
There's no tutorial, because it's a creative medium. Try shit out and see what you enjoy. If you're out of ideas, try recreating something else you've seen as closely as you can, to practice your craft. The mistakes you make along the journey will generate ideas for you.
There's not going to be a tutorial for the exact result someone has in their head, yes. That doesn't mean there aren't resources to learn the tools and techniques, so that a person can understand how to achieve their desired result.
We don't tell people to just throw some vegetables in a pan and expect ratatouille; or to pick up a trumpet and presto, they play jazz.
No, but you can't expect to read a recipe and suddenly make five-star dishes either. Familiarity, practice and technique are all part of the learning process, and they're things that tutorials can't help you with. You can hire as many music teachers as you want, but unless you sit there practicing your scales and arpeggios for days at a time to build familiarity with your instrument, you're not going to sound like Miles Davis.
Plenty of other people gave links to tutorials, and those are all fine. I wanted to emphasize that this is a skill that takes time, effort, a good amount of practice, and play to get comfortable with.
I think too many people are scared of learning a skill, and want tutorials to guide them through the process. There was a post a week ago about an app trying to teach people how to cook by asking them to find a picture of a "scrambled egg" in a line-up. Obviously useless, and that doesn't get people any closer to what actually needs to happen -- just pick up a pan and try. No, you won't get it right the first time. Nobody does. That's what the practice is for.
While there is no tutorial for the creativity itself, there are definitely tools and math for creative generative art that can be learned. No one is born being able to do linear algebra or write a shader.
I used those examples because they're things I've used to make art. It wasn't meant as an exhaustive list of things every artist should know; they're just two useful things that a budding code artist can learn if they want to, and reasonable things for someone to need help with.
I made generative art in the 80s on a ZX Spectrum just using for loops. Chuck in some high school trig if you like.
I guess the comment you're replying to is making the point that the tools can be very, very simple and OP probably already knows enough. The bit they are missing is "just start trying stuff"
Follow interesting people like https://twitter.com/beesandbombs and try to replicate the stuff you like. Avoid Reddit as most of the work isn't worth the time scrolling through due to bad moderation of all the groups, and avoid any artist that talks about NFTs; their work is usually low quality repetitive garbage and they spend most of the time going off about who just bought their latest random assortment of rectangles.
I dislike twitter, and the only reason I have an account is so feedbin can pull in the latest work of a lot of all the creative coders; seems like that's pretty much where they all post (if not on their personal websites)
Look for the people that do it just because they like doing it, and then copy what they do until you start having your own ideas. Even if your copy is crap, you still learned a lot doing it, and the next time you do something it'll be a little better and you'll know a little more.
This presentation is what got me started. Tim Holman - Generative Art Speedrun [0].
It gives a nice introduction and you end up with a nice tool belt of simple techniques to later experiment with. Like drawing simple shapes. Then repeating them. Then adding noise etc. A very simple and gradual approach. Highly recommend watching.
I was going to mention this one. It’s a great primer on how you actually just work with really basic concepts but tie a few of them together for interesting results.
A couple of books I enjoyed for inspiration many years ago were Generative Design: Visualize, Program, and Create with Processing by Benedikt Gross et al, and Form+Code by Casey Reas. Not sure how they’ve aged but the former was a nice tutorial type book and the latter a great overview of the scene.
But really you can’t beat downloading Processing or p5.js and whatever and just start playing around, I always found it quite fun as you didn’t really need to worry too much about code structure etc, instead just bang out a few hundred lines in a single file which create a cool end result!
I started with Max for live, and it has one of the most gentle introductions to programming in general that I have ever seen. More than any one tutorial, will be the communities that help you.
Find the programming environment you want, feel them out. Do you want to focus on the simplicity and abstract a lot of the animation details away? Open frameworks and libcinder are my recommendations there, though I imagine JavaScript libraries have come to the forefront. Visual languages like VVVV are a bit better at making you reckon with how the hardware sees the code, but have smaller communities. Vsxu is for example, amazes me but is seemingly entirely undocumented. Go for the big communities before you pivot, maybe.
Google things that you'd guess are introductions. Typing creative coding JavaScript into duckduckgo yielded a bunch of university courses, whose coursework might be free. That is often the case with pure data, which I like.
Paid languages, usually based around the entertainment industry tend to have very involved and helpful communities, as they can be focused on the concepts rather than the language.
This thread is already filled with incredible tools and inspiration. To balance that: learn the art side, not just the programming.
If you're interested in the visual domain learn about image composition, colour and perspective. There is milenea of knowledge on these topics. For audio work, learn about music theory, or for atonal areas sound design and exploration of noise. For motion, explore material on animation and film. This extends to poetry, fashion, architecture and the multitude of other domains that let computation and creativty combine.
These will all give you a tour of aesthics and techniques that you can then use to help shape yours. You can then learn (or build) the generative tools that help you realise this. This doesn't need to be a sequential process, but don't just focus on this last step as you'll miss so much of what may be influential to your work.
The Processing community has been around for a long time and I bet there are some good video tutorials to check out. Just watch other folks making things or talking about their art and start experimenting. This is a really good list of interesting tools and things to check out too: https://github.com/everestpipkin/tools-list
Learn a polygon-modeling tool. The obvious choice is Blender, but Houdini and Cinema4d are also good alternatives if you're willing to pay up.
Learn the basics, a little bit of sub-division modeling (it'll take a month of youtube tutorials to get that down), a little bit of particles work, a little bit of lighting setups, a little bit of generator/matrix/cloner functions, flow fields and forces, etc. in your chosen modeling tool.
When you have this down, dive into programming -- Blender and Cinema4d can let you do a lot with python coding and geometry/scene nodes; likewise for Houdini but with a custom DSL called 'Vex'. And that's where a lot of magic is done.
With making something and if it sucks making something else and it it doesn’t suck making something else.
I mean painting is the only way to be a painter, playing music is the only way to be a musician, and programming computers is the only way to be a computer programmer.
Downloading Processing is a simple thing that might work and can be done in half an hour.
processing.org/ or p5.js are both excellent tools with lots of documented examples to help get going.
I'd also recommend the pen plotter community, which is heavily involved in generative art but also enjoys physically plotting the art with robotic tools. See https://inconvergent.net/ for examples, there are many others.
I've learned a lot from trying to imitate nature. So making generative trees, animals, landscapes, whatever you like (I try to mathematically derive properties whenever I can too -- like, if a tree branches into 2, how does the thickness of the branches related to the original?). That's my small suggestion.
Depending on how committed you are, I think it's well worth it to participate (ie read lessons and material) in the wider art world (traditional drawing, painting, whatever you like). Although I also believe generative art is not very well explored or understood yet. Remember that you don't have to take any advice as a recipe, just as a springboard for ideas -- you can express yourself however you like.
One of the better ones I've found is Tyler Hobbes [0].
I recently found the "Bridges Archive" online [1]. It's a goldmine of ideas (I won't link to them but they have tilings, space filling algorithms, multi-scale Truchet patterns and many more).
I favor the ideas rather than the implementation as I already know how to program so you may do better with learning something like processing/p5.js [2].
In terms of raw ideas, I've found Jared Tarbell to be a huge inspiration [3] [4].
I'm sure I'll get lashed on here for the mere mention of NFTs but I've found there are consistently awesome generative art being displayed on Twitter for artists showing their work and advertising their NFTs for sale. One resource that I've found to be pretty consistently good is fxhash.xyz [5] [6]. Looking for #fxhash tags on Twitter will probably give you rich results.
I also have my own NFTs whose source code I've released as CC0 if you want to take a look [7] (none are for sale right now) along with a half assed attempt at making a list of resources for generative art [8].
There's plenty of "awesome" generative art lists [9] as well as many examples and other projects on p5.js [2]. And of course there's always Reddit [10] [11].
Oh and "Coding Train" is deceptively deep, packing complex ideas in a kind of "cutesy" veneer but still managing to tackle topics that run the gamut of easy to incredibly difficult [12].
There's really too many resources to list. It depends on what level you're at. I tend to focus on Javascript and the 'ideas' rather than the implementation so much. If you're starting from a point of learning programming, you're probably better off going through a tutorial or two on how to actually program and then try and tackle some "classic" generative art examples (grids, recursive grides, flow fields, etc.).
I occasionally run into people who have all their experiments on GitHub which might be enlightening [13].
Start to think of the world as a sequence of choosing things based on probabilities. That's basically modern modern AI text, sound, and image generation. You somehow calculate logits, then sample them. Bonus points for interpreting cloud patterns, meaning to infer a similar known shape from noise, i.e. the denoising decoder like Google's imagen.
In effect, geberative art is about gently nudging noise distributions and about finding the valuable needle in a haystack of noise.
Playing with p5 is great fun and easy to get started with, so that might be a good starting point.
If you're interested in using deep learning and pushing more towards the generative AI side, I made a free course for that: https://github.com/johnowhitaker/aiaiart, and I'd be happy to chat through the landscape and help you get started :)
I'm going to suggest Paul Bourke's "Fractals, Chaos, Self-Similarity" website, because I often go there to get inspiration and code snippets - http://www.paulbourke.net/fractals/
Somebody else has already mentioned the excellent @beesandbombs on Twitter. I sometimes spend too much time trying to work out how Dave achieves a particular effect - https://twitter.com/beesandbombs
If you're going to be drawing into the browser using the canvas element, I suggest you check out the Slaylines canvas comparison test page. There's a link to the GitHub repo which includes links to all the canvas libraries demoed there. Try out several libraries, settle for the ones which fit easiest into your preferred working style - https://benchmarks.slaylines.io/
I suggest you start with l-system¹, it's easy to implement and understand. Have a look at my own artisanal library-less implementation, but be warned that I don't do fronted code professionally: https://m__nick.gitlab.io/l-systems/
It's easy to put out something algorithmic generated. It's more difficult to make them approaching art. It's even more difficult to make it seemingly creative.
On a smaller scale, I sometimes like making (and looking for) tweetcarts. Search for the #tweetcart hashtag on Twitter; those are procedural animations made with PICO-8 in less than 280 chars. There is a code golf aspect to it, but it's a bunch of math first. If you're interested, some basics are explained here: https://demobasics.pixienop.net/tweetcarts/
In addition to traditional algorithmic art, you may also want to consider machine learning methods.
One way to dip your toe in is to run the Disco Diffusion colab notebook. I haven't yet found a good resource about training your own model, or about fine tuning an existing model.
Producing something non-trivial that's worth looking at and isn't disposable is a much tougher challenge.
IMO avoid the obvious entry points like Processing and JS and the gen art culture around them. If you have to go through them, don't stop there.
Learn something harder like Photoshop or Illustrator scripting - more challenging, but many more features and options and more likely to produce unusual results with high production values.
Look at art. Lots and lots and lots of art. Investigate form, composition, perspective, light and tone, and colour theory.
Look at generative art - lots and lots of it. Learn to recognise the cliches (Perlin noise, flow fields, simple geometric manipulations) and also look at how the best gen artists either avoid them or transcend them.
Make a list of the best gen artists and deconstruct their styles and techniques.
Set yourself projects. Experiment a lot. Don't be afraid of failures. Get into a flow state and improvise with code.
Finally - get the fastest hardware you can afford.
If you want click-bang gen art something like Midjourney is hard to beat - good results, but it's a bit ready meal, when you could be learning how to cook from scratch.
To the author, what is your end goals and interest in this?
For everyone else: Any job roles tailored to those liking creating these? I can see some scientific applications in visualizing the data, maybe a cross with data analytics, but maybe someone here can spot some other applications.
Download and learn the free edition of Houdini. It is probably the most advanced generative art programming software out there. You can start our using the built—in nodes and then start programming your own nodes to make even more advanced things.
Start by copying some existing example code and running it locally, then edit it and see what changes. Comment pieces out, look at the results. Change magic numbers to understand the effect. It probably has some calls to a random number generator in it; add more calls to the random number generator.
(I'm mostly linking things I've done myself here, not because they're better than the alternatives, but because they're very short, and most of them run in the browser, which makes them easier to copy and edit.)
There's probably some kind of awesome example repo out there for deepdream ANN stuff but I don't know what to recommend.
But that's just where to start. Once you're doing stuff you'll want to understand what you're doing and learn about more techniques (algorithmic, software design, and interfaces to libraries and devices) so you can expand your range. There's lots of resources out there (Tarbell in particular has given an hour lecture you can find on YouTube about what techniques he finds useful) but I can suggest, as techniques that give a large bang for the buck:
∙ Multiplicity with variation: many instances of the same thing that differ, for example by incrementing a variable from one instance to the next. For example, you can create 64 particles that move from point A to point B at successive points in time 30 milliseconds apart, or at the same point in time at 64 different velocities, or 64 Bezier curves from point A to point B that start at 64 angles evenly spaced across some range. http://canonical.org/~kragen/sw/dev3/curves is an example of spreading the start angles of Bezier curves over a range.
∙ Adding randomness to things. Adding randomness to pixel colors gives you "graininess"; adding randomness to object positions gives you spatial dispersion or, if the randomness varies over time, jittering; adding randomness to the angles of different objects gives you visual variety. Perlin noise and simplex noise are especially nice kinds of randomness for some purposes because they have a kind of local coherence. http://canonical.org/~kragen/sw/dev3/rectlines is an example of just drawing random rectangles and lines in random colors with alpha-blending; it's nothing special but it's a lot more interesting to look at than it would be without the randomness.
∙ Differential equations, especially over time. Real-world objects don't suddenly teleport from one position to another; if objects in your generative art do that, people will have a hard time seeing them as the same object in a new position, which may or may not be what you want. If instead you have a relatively small velocity that is added to the position each timestep, it's much easier to achieve the illusion of motion. (This is "Euler's method", and although it's suboptimal for accurate numerical integration of differential equations, generative art often doesn't care.) If the velocity itself analogously changes by adding an acceleration to it each timestep, the movement can look a lot more natural. These differences or derivatives can often be computed as linear functions of other objects. That's almost the whole deal in, for example, http://canonical.org/~kragen/sw/dev3/metacirclesky or http://canonical.org/~kragen/sw/dev3/offscreen ; in the latter, the things slow down as they move because of the line things.each(thing => {thing.Δx *= 0.998; thing.Δy *= 0.998}), which subtracts a small fraction of their velocity every time it runs. The qabbits in http://canonical.org/~kragen/sw/dev3/qabbits roam around by changing their velocity by a small random amount each timestep.
∙ Particle systems are a combination of the three previous items: a multiplicity of mostly-identical objects, with random variation from object to object, whose states evolve over time according to differential equations. http://canonical.org/~kragen/sw/dev3/spirals draws random monochrome spirals in a way inspired by Tarbell's piece "Substrate", which is basically a particle system, and the explosions in http://canonical.org/~kragen/sw/dev3/qvaders are very simple particle systems.
∙ Tiles: tesselating some space with a shape (often just a square or rectangle) and putting different images in the different tiles. That, plus randomness, is how http://canonical.org/~kragen/sw/dev3/10print.py can generate a maze with a single line of code. (It's a Python Unicode translation of a well-known one-line BASIC program for the Commodore PET from the 01970s.) This is of course how typewriters give the illusion of neat printing with a very simple mechanical system that generates pages from human keypresses.
∙ Alpha blending can go a long way to getting interesting visual effects: antialiasing, layering, translucency, glow. Also, gradients. The cheapest technique in the world is to generate a series of frames, but instead of directly displaying them, alpha-composite each new frame on top of the currently-displayed image, as in http://canonical.org/~kragen/sw/torus if you click the "Trails" checkbox, or as in http://canonical.org/~kragen/sw/dev3/loop (a poor derivative of one of Tarbell's pieces). The "curves" example I linked above uses alpha blending for antialiasing; differential equations to make the curves move smoothly; randomness to pick the control points and accelerations; and multiplicity with variation to separate the curves.
∙ Bitwise operators. These are ready to hand in most programming languages and can generate a lot of interesting variation that's right on the border between "too ordered to be interesting" and "too chaotic to be interesting". Often they are an alternative to recursion. I've written a little more about this in http://canonical.org/~kragen/bytebeat.
∙ Fractals in general, which aren't always implemented by recursive subroutines or bitwise operators, are a rich source of visually interesting material.
∙ Linear algebra is interesting in a few different ways. Scaling, rotating, and squishing a 2-D image is just matrix multiplication; moving it is just vector addition. Alpha blending is linear interpolation between colors, and Bezier curves are recursively applied linear interpolation between points. A minimal amount of linear algebra in three dimensions gives you a raytracer http://canonical.org/~kragen/sw/aspmisc/my-very-first-raytra... (using bitwise operators for quick and dirty textures) or a rasterizer (see torus example above). Convolution is linear, though a linear algebra course often doesn't teach it, and convolution gives you FIR filtering of sound including both frequency response changes and reverb, as well as image filtering (sharpen, blur, emboss, bokeh). Iterated function systems generate fractals nonrecursively as the fixpoint of the union of a small collection of affine transformations. If I'd known more about linear algebra when I wrote the "metacirclesky" guilloche generator I linked above, I could have easily fixed the cases where the point spirals off to infinity: those are just the cases where the transformation matrix has an eigenvalue greater than 1.
∙ 3-D printing and laser cutting make it easy to make generative art that isn't confined to a computer screen, though generally it's a bit more static once it's out of the machine. For example, the Sierpinski triangle cutout in http://canonical.org/~kragen/sw/laserboot/cut-6/sier.pdf (described in http://canonical.org/~kragen/sw/laserboot/cut-6/README.md.ht...) is generated from 19 lines of code (in PostScript, in sier.ps) implementing an L-system. I took the PDF to a sign shop, paid them US$17, and in ten minutes of laser cutting I got a meter-sized fractal to hang on the wall at home.
∙ Combinatorial enumeration, where you show literally every possible variation on a theme. http://canonical.org/~kragen/sw/dev3/semicirclecollages combinatorially enumerates a design space of "semicircle collages" identified by Christopher Carlson.
You don't have to learn all of these! Think of them as magical items you receive one at a time on a quest, each one augmenting your powers and granting you new opportunities as you learn how to use it; don't think of them as questions that might be on the exam.
I ran out of editing time and lost my last edit, but I want to add a few more candidates: production systems, which go beyond just L-systems, for example linguistic (http://canonical.org/~kragen/sw/dev3/dramaticphrase.py) or architectural (CityEngine computer-generated architecture); topological optimization; collision detection (in use in the spirals, offscreen, qabbits, and qvaders examples above); camera input (live or prestored); fields other than noise functions (continuous functions of position, for example temperature or flow velocity); colormaps (mappings from spaces defined by one or more continuous variables, such as temperature, to color); force-directed layout; Delaunay triangulation; mathematical morphology; median filtering; rejection sampling (generate and test).
Why? Shouldn't you think about whether this style is over in terms of its contribution to art? Sure all the cool AI companies drop "generative" in their press stuff but is it interesting anymore? The main advances were made in the 50s and 60s (e.g. the very idea of generative and systems art was invented). Now we can see generative systems taken to their literal extreme in DALL-E.
But if generative art is just an idea about art then what else is there?
Anyway some early generative art pioneers (I take a European mid 20th century angle because mid 2000s MIT grads did not invent this field):
It's simply not true that the main advances in generative art were made in the 50s and 60s and nothing new is being done now. Generative art is a huge, thriving field right now with thousands of communities and subcultures around it, using traditional coding techniques or visual programming systems like TouchDesigner. Honestly, just reading through this thread for yourself should be some perspective on this.
That's not even counting new tools like DALL-E or Midjourney, though personally I don't think we can write them off as uninteresting or low-effort. They're an exciting and powerful new tool, and like any tool they can be used to make art. Maybe as an artist making art that others could not also easily make is important to you, but that is not what makes art.
As an activity art implements ideas that have been formulated conceptually previously ("conceptual" here could be a drunk artist taking a pic of their butt and isn't philosophical + more related to surprisal). The immediately exciting thing about art is the experience of the product but that experience gives way to a more conceptual excitement (its interesting because they are exploring this idea!). When an idea is repeated x amount of times as an artistic expression it gets boring. Generative art is boring on these terms, to me, right now, even if many technical advancements relating to the speed or complexity of the generative system are made.
H/w this is just a fun argument about art which is basically impossible to concretely describe anyway and i'm prob wrong (e.g. some kid is going to make something incredible with a new idea about generative art x AI).
I see what you're saying, and defining what makes art is nebulous to the point of being impossible. Rather than a positive proof, I would just counter by asking whether you think art can be defined purely by its aesthetics, or by virtue of the methods used to make it - that is, without considering at all any concepts or ideas put forward by it.
It's got to be a combination of both (e.g. made from wood and shaped like a ball but feels like this in this room etc) but maybe that is too neurotic and not conducive to new aesthetic experience. I think my pattern recognition for generative art would be quite high based on how many times I've seen it as a style of art previously. For most images i've seen DALL-E has all of the fingerprints of generative art and on some level I notice that even if the fidelity is approaching something that takes over aesthetically (e.g. where those kinds of perceptual fingerprints fade away a little bit).
I don‘t think any particular style of art is ever finished. That just assumes is all about differentiation from what was there before. OP is obviously showing interest in generative art and is probably doing it for fun and that’s required for doing anything great in my opinion, that you’re in for yourself. Everything else would just be manufacturing.
Other than that great recommendations! I had the pleasure to attend a course of Frieder and must say that he is one of the kindest, inspiring people I’ve met!
Oh you have me there! Things that are boring (to me) are not fun (to me). If you find it fun then great :) This area of art has stagnated horrifically and because it is art as well as programming it should be critiqued via that other angle as well.
[1] https://codepo8.github.io/canvas-images-and-pixels/
[2] https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API
[3] https://wiki.c2.com/?TelescopeRule