[HN Gopher] Fishdraw: Procedurally Generated Fish Drawings
___________________________________________________________________
Fishdraw: Procedurally Generated Fish Drawings
Author : sigil
Score : 325 points
Date : 2021-08-12 15:37 UTC (7 hours ago)
(HTM) web link (fishdraw.glitch.me)
(TXT) w3m dump (fishdraw.glitch.me)
| amirGi wrote:
| This is so dope - creating good generators is so hard, great
| work!
| bazzargh wrote:
| This is just lovely. But I am also tickled by the nominative
| determinism of the dots on the fish being generated using Poisson
| Disk sampling.
|
| https://github.com/LingDong-/fishdraw/blob/main/fishdraw.js#...
|
| https://en.wikipedia.org/wiki/Supersampling#Poisson_disk
| andrelaszlo wrote:
| Because poisson=fish in French? <o))))><
| jugg1es wrote:
| An absurd and wonderful project!
| [deleted]
| dbish wrote:
| Love the generated art projects. I just want an art 'frame'
| (display with small computer) that generates new art every so
| often. Put together a few of the various art ML projects into one
| product for this.
| pbhjpbhj wrote:
| New images, yes; but, new art? Isn't the art of an image imbued
| by the artist, DuChamp style.
|
| Or, I guess maybe it's like a quantum effect and the art
| appears when the viewer perceives it.
|
| Don't get me wrong, I too love generative art, conceptually and
| the outputs of generative algorithms too.
| [deleted]
| mikeInAlaska wrote:
| with a button where you can click it to save particularly
| genius results that appeal
| dh-g wrote:
| Hacked kindles work well for this.
| dheera wrote:
| Also, used Boox tablets of previous models. You can get ones
| upto 13 inches, which Kindle doesn't have. They run Android,
| so you can just write a standard Android app and run it, no
| hacking needed.
| dbish wrote:
| Kindles are too small and have no color. I want a large
| colorful framed picture. E-ink would be awesome but that's
| not cheap for color displays and def not for large ones.
| dheera wrote:
| I mean, if you have cash and time to spend on the
| engineering, you can do it
|
| https://shopkits.eink.com/product/31-2%cb%9d-color-epaper-
| di...
|
| If you don't have that much cash but don't mind it emitting
| light, just get a used 4K TV or monitor and get a custom
| frame built for it.
| xwdv wrote:
| The good thing is you only have to buy it once, and then
| you have unlimited amounts of art you can display.
| dheera wrote:
| Yep, I did this
|
| https://dheera.net/projects/einkframe/
|
| I'm working on a 3-panel version of it since I want a "wider"
| view of this scrolling landscape, and single e-Ink displays
| that big aren't cheap but 3 of these smaller displays are still
| within my budget.
|
| https://imgur.com/a/3IfKpb3
| dbish wrote:
| This is really cool! Thanks for sharing
| siavosh wrote:
| This is wonderful. There's just something evocative about fish--
| with their flat side portrait look, and wide open eyes that make
| them a perpetually interesting subject for art.
| tartoran wrote:
| I love the simple style, this is great. I've been toying with
| procedurually generated drawings in Racket and find it
| mesmerising to observe how much conplexity can be generated from
| the permutations of a few rules. There's still a lot of fish to
| catch in generative art
| gregsadetsky wrote:
| The same author's "Procedurally-generated vector-format
| infinitely-scrolling Chinese landscape" is also quite beautiful:
|
| http://shan-shui-inf.lingdong.works/
|
| (keep clicking the rightmost arrow)
| ZephyrP wrote:
| Inconvergent (https://inconvergent.net/) is another stunning
| generative artist as well; their generative trees (browser
| version: https://zv.github.io/static/algorithmic-tree.html) are
| especially evocative of Fishdraw.
| dheera wrote:
| Yes, Lingdong Huang is awesome! I have that exact one running
| on a framed eInk display on my wall. I had to make some minor
| modifications to make it run in NodeJS instead of in a browser,
| and then generate a raster image to send to the eInk display,
| but it wasn't hard.
|
| I got permission from the author to post my work to Hackaday
| (with credit to him) which I'll do at some point. I'm actually
| working on a 3-panel "wide" version of it that I want to get
| done first.
|
| https://dheera.net/projects/einkframe/
|
| 3-panel version in progress:
|
| https://imgur.com/a/3IfKpb3
| FpUser wrote:
| >"Lingdong Huang is awesome!"
|
| I looked at his github and yes is is awesome. Thanks for
| pointing this. Will read a bit more of his stuff.
| gregsadetsky wrote:
| Really great project! Thanks for sharing it
| foobarbecue wrote:
| Why does this use let and var together? Was I (not a modern js
| expert) wrong to think var is considered obsolete? Is it because
| OP wanted to use var's scoping rules?
| jugg1es wrote:
| var is not obsolete. You still need it sometimes for scoping
| reasons.
| int_19h wrote:
| Could you give an example? It seems like any "var" could be
| replaced with "let" at a different scope.
| dheera wrote:
| Won't work: if(checkForSomething()) {
| let foo = 2; } else { let foo = 3;
| } console.log(foo); // won't work
|
| But: if(checkForSomething()) {
| var foo = 2; } else { var foo = 3;
| } console.log(foo); // will work
|
| That said, I religiously avoid "var" and just declare the
| variable beforehand with "let" because there are too many
| other gotchas with var. Less debugging headaches. And use
| "const" religiously as well, like C++ people do.
| speedgoose wrote:
| const in C++ is very different than const in JavaScript
| though. I guess you are well aware of that but I feel
| like being pedantic.
|
| This is allowed in JavaScript: const
| foo = {bar: 1}; foo.bar = 2;
| int_19h wrote:
| It's not really any different if you keep in mind that
| foo is a _reference_ here, and so that 's what const
| applies to. The equivalent in C++ would be a const
| pointer to a non-const object.
| int_19h wrote:
| That's exactly what I meant by "any "var" could be
| replaced with "let" at a different scope":
| let foo; if (checkForSomething()) {
| foo = 2; } else { foo = 3; }
| zeven7 wrote:
| You don't need var, you don't need it's weird scoping
| behavior.
| yathern wrote:
| It's almost certainly from copy-pasted code from other sources.
| The Perlin Noise section at the top is not original code at
| least - though I can't find an original source.
|
| https://github.com/processing/p5.js/blob/8213eecccdff510015e...
| atum47 wrote:
| This is great. Where did the inspiration come from for this
| project?
| aendruk wrote:
| A gallery of example results:
|
| https://github.com/LingDong-/fishdraw#gallery
| tunnuz wrote:
| I love these kind of projects. Well done!
| AlanYx wrote:
| If you like this, check out Lingdong Huang's personal website.
| It's chock-full of really joyful little projects.
| darnfish wrote:
| Fish
| abdupattoh wrote:
| amazing.
| dcaranda wrote:
| why isn't this an NFT project?
| NelsonMinar wrote:
| ugh
| adam12 wrote:
| because NFTs are bad for the fish / environment
| zeptonix wrote:
| the name could even be catchy ... CryptoFish
| krylon wrote:
| 1. I like it!!!
|
| 2. Are these fish real or just real-istic? Not judging, just
| curious.
| Thoreandan wrote:
| Generated AFAICT :)
| RBerenguel wrote:
| Here is the repository (was shared yesterday in reddit's
| r/generative): https://github.com/LingDong-/fishdraw
| sdevonoes wrote:
| I took a look. I can't really understand it (unless I spend
| the whole next week on it... which I will probably do). Could
| someone with more expertise in the topic explain me how it is
| done (high level overview)?
| RBerenguel wrote:
| What coolspot says below. I want to have a look and maybe
| create my own version, I love generative art. My "best"
| (the one that made me happiest) creation followed the same
| approach. It's an iris [0] , and the process of drawing
| tries to mimic how you'd draw it... and I just broke the
| implementation in the pieces needed for it:
| - Create background gradient - Create muscular
| coloured stripes - Add a bit of noise to the
| stripes - Gradient for the pupil -
| Reflection in iris and reflection in pupil (the last one is
| "fake")
|
| [0] https://github.com/rberenguel/sketches#iris-p5js
| coolspot wrote:
| 0) sepect random parameters for body size/shape, fin
| size/shape, etc.
|
| 1) draw fish outline
|
| 2) complete rest of the fish
| MauranKilom wrote:
| Sounds a bit like /r/restofthefuckingowl.
| gadders wrote:
| I think this is the first time I have ever seen Glitch used for
| anything.
| micromacrofoot wrote:
| This seems like an unnecessarily harsh anecdote. I've seen
| Glitch used for a lot of things! There's a bunch of cool stuff
| on there.
| booyah5678 wrote:
| This was made on Glitch too
| https://news.ycombinator.com/item?id=27929278
| JoeAltmaier wrote:
| Fun! And since "there's no such thing as a fish", these drawings
| are as legitimate as anything else you call a fish.
| rektide wrote:
| Feature request: it'd be nice to have a way to generate a link to
| a particular fish, such that it can be generated again.
| brianherbert wrote:
| It looks like you can provide a seed based on the readme in the
| github repo. This would produce the same fish every time.
| jaredsohn wrote:
| I think GP is asking that every time you refresh the fish, it
| uses a different seed and it publishes it, perhaps via a
| share link. Otherwise, to find a fish you want you'll have to
| manipulate the url multiple times.
| mzs wrote:
| https://fishdraw.glitch.me/?Bob=1234
| dpeck wrote:
| Does anyone have a good list of resources for people who want to
| get a get baseline on understanding and implementing procedural
| generation?
| brianf0 wrote:
| I have some generative art tutorials using p5js on my blog @
| https://brianfernandez.dev/art
| dannygarcia wrote:
| The Nature of Code book is a great resource. Dan also deep
| dives on specific topics on his YouTube channel.
|
| - https://natureofcode.com/book/
|
| - https://www.youtube.com/c/TheCodingTrain
| noduerme wrote:
| In terms of the drawing aspects, working on SVG or raw canvas
| drawing each have some drawbacks. If you don't need to output
| vector files, I recommend PixiJS, which gives you a stage-based
| display chain on top of WebGL where you can mix free-form line
| drawing with pre-made sprites. I used to write a ton of
| procedural graphics with Actionscript, and this has been my
| clearest path to continue on those projects. Some AS3 drawing
| code is almost directly portable.
|
| https://www.pixijs.com/
| wrnr wrote:
| It's more art than code, maybe start drawing a city skyline.
| Have different basic types of roof (triangle, trapezoid, none),
| windows (round, square, subdivided) and a variable number of
| flours. Play around with it in html canvas.
| 123pie123 wrote:
| I don't have a list, but "processing" language is very good at
| art and math(s) stuff
|
| https://processing.org/
|
| it has some cool demos/ examples
|
| https://processing.org/examples/
|
| and it's opensource
___________________________________________________________________
(page generated 2021-08-12 23:00 UTC)