Hacker Newsnew | past | comments | ask | show | jobs | submit | tehrash's commentslogin

Thanks for noticing the mobile support! I put a lot of effort in making it work well both on smaller screens as well as with touch/mouse support and light/dark mode while trying to ship minimal amount of js to the browser.. even the canvas elements re-render responsively in regards to size+theme.

I feel justified now and can finally sleep well knowing the time I spent manually formatting the code blocks so they wouldn't have horizontal scroll wasn't wasted!


Yes, I reference that as being pretty much the seminal work on the topic within generative art in the beginning of the article (and link to the same article even!)

What I hoped to add to the topic was making it even more accessible for people who maybe haven't even heard of generative art yet, as well as provide some interactive illustrations to help showcase their behaviors. Hopefully that doesn't come across as me trying to take credit for his work, because I find the stuff he makes (his articles even more than his artworks sometimes) super influential.


Ah i'm very sorry. I ctrl+f'd his name, but should obviously have just read a bit more carefully.


No worries! It's important that proper credit is given especially when he's done so much to push things forward in the generative art space.


I still feel like a lot of variation that can be achieved if you dig pretty deep, but I do agree that it's difficult to do something meaningful that other people aren't also doing since everything can easily become "same-y looking". What's great about flow fields is that they're easy to understand and you can get pretty interesting results for not that much effort, making them a great and accessible introduction to generative art for people who haven't tried it before.


This is how I think about the ant like paths: Since we're warping the angles lines that turn a little will turn more, and lines that turn almost nothing will continue turning very little. Lines will start to converge against points that turn very little, after which all lines are grouped up and all go through the same points. I.e. turn until the turn-vector is small. That only happens when the smoothing is low, since the difference in noise values will still be high enough to cause this effect.

I don't know it that mess of a paragraph was understandable, but hopefully it answers your question!


Great point! Unfortunately I do most of these generative art experiments as SVGs to feed to an axidraw machine (https://shop.evilmadscientist.com/productsmenu/846), but gut feeling says that in these canvas examples where sampling screen colors is possible your suggested method would be faster, and much more so for smaller lines and if the canvas is big.

I'll try to make an edit to the article where I try it out when I'm off work.

Thanks for the tip!


SVG also has functions for hit testing [1][2] but I have no experience or at least memories of using them. So no idea if they could be useful and performant enough. But given that interactive SVGs might require finding the object under the mouse cursor as it moves, I would expect this to be reasonable performant, but it might of course still be too slow when used while drawing hundreds or thousands of objects.

[1] https://developer.mozilla.org/en-US/docs/Web/API/SVGGeometry...

[2] https://developer.mozilla.org/en-US/docs/Web/API/SVGGeometry...


I haven't seen that talk yet but will for sure watch it tonight!


I wrote an article on the basics of Flow Fields in the context of Generative Art (no AI stuff, just for loops and if cases). It has some fun interactive illustrations and code samples for anyone looking to get into the field.


Very nice blog post, thank you for sharing!

I spotted a small error in the Finally, Colors. section:

  const color = floor(random() * palette.length);
...should probably be

  const paletteIdx = floor(random() * palette.length);
  const color = palette[paletteIdx];


ah, of course! thanks for reading and noticing. It's been updated.


Really nice, I love the interactive explanations. We covered flow fields in a chapter for the second edition of our book 'Coding Art' [0]. We use p5.js to match the earlier Processing parts in the book. Btw, Tyler's page is referenced, but yours will be in a future edition. Thanks for writing this up!

[0] https://codingart-book.com


Ah, super cool! Looking forward to reading the future edition!


Very nice article, thanks for posting!

If you don't know about it already, Gorilla Sun has a newsletter that this would be perfect for [0].

[0] https://www.gorillasun.de/tag/newsletter/


My all-seeing eye sees your comment XD definitely including this post in the newsletter!


Cool! Thank you very much!


ha! Of course you're here.

Love your newsletter!


This is very nice! I remember drawing direction fields and integral lines through them in my numerical PDE class but I guess I lacked artistic mindset to push it further :)

I see that some of your generative art i this styles has multicoloured flow lines, is that just random or are the splits computed somehow?


Thanks! Some splits are randomly generated by traversing the line and each point has a small chance (5% or so) to create a split and change color. I've tried other techniques as well where lines change color by which region of the the canvas they are in etc.

I even wrote a small UI using Rust and egui to render the drawings in real-time just to play around with that specific part. It looks like this https://imgur.com/a/Zfp1ls3 and is open source https://github.com/damoonrashidi/generative-art/tree/develop...


Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: