5 ms·
Shadertoy adds procedural GPU-generated music in the browser
- verroq 12y agoThis one is also pretty impressive https://www.shadertoy.com/view/ldfSW2 https://www.shadertoy.com/view/ldfSW2
- adamnemecek 12y agoI'm pretty surprised that that was made with like 200 LOC.
- giancarlostoro 12y agoThis one worked for me, the previous one didn't. Weird.
- moron4hire 12y agoIt worked for me once I reloaded the page.
- sehugg 12y agoProcedural, if you like -- the linked example uses a hard-coded sequencer to play the notes. But this ought to be fun to mess with.
- ykl 12y agoThis one has actual procedural audio: https://www.shadertoy.com/view/ldfSW2 https://www.shadertoy.com/view/ldfSW2
- GuiA 12y agoI took some openGL in college, and can understand the most very basic shaders on Shadertoy, but the more advanced stuff that gets posted to Shadertoy is way over my head. Is there a good set of resources (book, videos, website?) to learn the more advanced stuff? Sitting there and trying to understand the super complex (and even mediumly complex) shaders from scratch is just not doing it for me.
- OlivierLi 12y agoI have heard good things about this book : http://www.amazon.com/Graphics-Shaders-Theory-Practice-Edition-ebook/dp/B0083DJT8U http://www.amazon.com/Graphics-Shaders-Theory-Practice-Editi...
- Impossible 12y agoMost of the more complex shaders on shadertoy are raymarching signed distance fields. There are a good amount of resources covering this technique. A couple of recommendations: http://9bitscience.blogspot.com/2013/07/raymarching-distance-fields_14.html http://9bitscience.blogspot.com/2013/07/raymarching-distance... http://www.iquilezles.org/www/articles/raymarchingdf/raymarchingdf.htm http://www.iquilezles.org/www/articles/raymarchingdf/raymarc... (from Inigo Quilez, founder of shadertoy) http://www.pouet.net/topic.php?which=8177&page=1 http://www.pouet.net/topic.php?which=8177&page=1 I gave a talk at NYU a few years ago about raymarching signed distance fields which is available here (https://www.youtube.com/watch?v=DXFEOI2SsNY https://www.youtube.com/watch?v=DXFEOI2SsNY) One of the best ways to start understanding shader toy shaders is to modify or remove code and run it. This way you can visualize what functions in the shader contribute to the image, and in what ways. In some of the more complex shaders there can be almost random looking strings of math to generate a procedural texture or a specific post process effect, and breaking these down can help you gain an intuitive understanding of how to "paint with math".
- GuiA 12y agoThis is awesome. Thanks for taking the time to reply.
- lohankin 12y agoSorry for the question that might be a bit off-topic. Will we ever have support for sound fonts in a browser? E.g. piano sound fonts? With at least rudimentary support for MIDI (e.g. noteOn, noteOff)?
- dspig 12y agoYes: http://www.w3.org/TR/webmidi/ http://www.w3.org/TR/webmidi/ http://badassjs.com/post/40190128792/midi-js-a-soundfont-based-midi-sequencer-in-javascript http://badassjs.com/post/40190128792/midi-js-a-soundfont-bas...
- frozenport 12y agoIsn't a sound font a MIDI renderer?
- MichaelApproved 12y agoWorked for me in Chrome but not in the latest version of Firefox. Is there something that I need to turn on for Firefox to work?
- ASneakyFox 12y agoI really like the idea of shadertoy. Learning to write shaders is some thing I really want to learn to do.. I just wish shadertoy was a desktop application because it doesn't run so well in my web browser.
- davidgerard 12y agoshadertoy.js locked up my Firefox (31 in Xubuntu 14.04).