Neonflames generative art demo
I think this is my favorite canvas demo I have created so far. It is an interactive drawing tool based on particle effects. It is the result of me trying to create some generative art using canvas. The techniques used are actually pretty similar to the ones shown in my frontendconf talk on particle systems. In short:
p.vx = p.vx*0.8 + getNoise(p.x, p.y, 0)*4+fuzzy(0.1); p.vy = p.vy*0.8 + getNoise(p.x, p.y, 1)*4+fuzzy(0.1); p.x += p.vx; p.y += p.vy; data[index] = tonemap(hdrdata[index] += r); data[index+1] = tonemap(hdrdata[index+1] += g); data[index+2] = tonemap(hdrdata[index+2] += b);
I'm planning to play with a few improvements especially in tone mapping and controls in the future but feel free to take a look at the source on github. I hope you enjoy it.
Jonas Wagner
Very cool! Not many canvas experiments make me want to take screenshots as much as this one does. Truly beautiful images.
Comment by Jonas Wagner — 10/2/11 2:56 AM | # - re
WOW. As an old Perl programmer / web junkie, I gotta love the new HTML5. Your work is an inspiration. Many thanks.
Comment by Jonas Wagner — 10/2/11 9:06 PM | # - re
:) I just noticed your favicon. Right ON!
I'm an old lifer myself.
Comment by Jonas Wagner — 10/2/11 9:15 PM | # - re
Love it. Nice, readable code too.
Comment by Jonas Wagner — 10/11/11 10:48 PM | # - re
I'm really interested in how you used the imgur api - how'd you get the canvas image to be posted there?
Comment by Jonas Wagner — 10/16/11 5:38 AM | # - re
29a.ch/2011/9/11/uploading-from-html5-canvas-to-imgur-data-uri
Comment by Jonas Wagner — 10/18/11 9:45 PM | # - re