I'm also a big a fan of Iñigo Quilez (also known as rgba in demoscene or iq on shadertoy and at Pixar). He's an amazing real-time artist and mind blowing Technical Director who I had the pleasure of working with. Not only is he incredibly talented, but he's a super humble, nice guy and a great teacher. You should check out his website if you ever want to learn how to make amazing real-time visuals: http://www.iquilezles.org/.
I recently visited my high school alma mater back home in St. Louis, Missouri. The school was celebrating the opening of a beautiful new campus extension dedicated towards STEM education (science, technology, engineering, and math). They wanted me to talk about how a strong foundation in STEM can lead to working at a place like Pixar. I was inspired to use shadertoy to make my point. I urged the students to make something visually appealing with code. This type of making flexes so much of the brain that continued practice in this space will make them desirable and influential makers of their generation. You can see the recording of my panel shared with the charismatic and talented Anthony Chivetta of Apple here:
Both my visit to MICDS and Iñigo's website has inspired me to start putting up my own tutorials. I thought I'd start with walking through how to make a ray tracer in shadertoy. Over 10 progressive sketches, I'll build up the math and structure that should give you an idea of how a basic ray tracer works (independent of it being in shadertoy).
The first sketch (linked below) is a lot to take in since it lays out the bones of my code structure, describes how a pin-hole camera works in the context of shadertoy, and describes the ray intersection math of a ball and plane. Stay tuned for an accompanying blog article that explains the code.
