
Shadertoy adds procedural GPU-generated music in the browser - ykl
https://www.shadertoy.com/view/ldXXDj
======
verroq
This one is also pretty impressive
[https://www.shadertoy.com/view/ldfSW2](https://www.shadertoy.com/view/ldfSW2)

~~~
giancarlostoro
This one worked for me, the previous one didn't. Weird.

~~~
moron4hire
It worked for me once I reloaded the page.

------
GuiA
I 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.

~~~
Impossible
Most 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...](http://9bitscience.blogspot.com/2013/07/raymarching-distance-
fields_14.html)

[http://www.iquilezles.org/www/articles/raymarchingdf/raymarc...](http://www.iquilezles.org/www/articles/raymarchingdf/raymarchingdf.htm)
(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
This is awesome. Thanks for taking the time to reply.

------
sehugg
Procedural, 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
This one has actual procedural audio:

[https://www.shadertoy.com/view/ldfSW2](https://www.shadertoy.com/view/ldfSW2)

------
ASneakyFox
I 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.

------
lohankin
Sorry 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
Yes:

[http://www.w3.org/TR/webmidi/](http://www.w3.org/TR/webmidi/)

[http://badassjs.com/post/40190128792/midi-js-a-soundfont-
bas...](http://badassjs.com/post/40190128792/midi-js-a-soundfont-based-midi-
sequencer-in-javascript)

------
MichaelApproved
Worked 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?

------
davidgerard
shadertoy.js locked up my Firefox (31 in Xubuntu 14.04).

