Time for something a bit different. In this video we’ll delve into WebGL using a tool called ShaderToy, a great way to learn and experiment with shaders all from inside your web browser! As a way to get started and for both of us to get our footing we’ll start with something relatively simple: a basic spiral inspired by the classic hypnotic discs from those classic films and magicians.

The shader itself is relatively easy and uses some simple functions to calculate the position of points directly from the center of the screen. Then those points are used to calculate the angle from the center. Combined these two values provide enough information to make a complete spiral shape.

If you want to play with the shader we made in this video check out this link: https://www.shadertoy.com/view/ldsfDX

Some other epic examples (samples at the end of the video):
Ocean: https://www.shadertoy.com/view/Ms2SD1
Raymarching: https://www.shadertoy.com/view/Xds3zN
Alien Corridor: https://www.shadertoy.com/view/4slyRs
Traced Minkowski Tube: https://www.shadertoy.com/view/4lSXzh

For even more information about the raymarching example check out: http://www.iquilezles.org/www/articles/distfunctions/distfunctions.htm for an in depth explanation of how the formulas work.