Hello all! Welcome to the Raymarching Workshop page!
Taught by: Char Stiles (contact@charstiles.com) @charstiles
In this class we will learn about ray marching! Ray marching uses a very contained and mathematical way to describe a 3D scene in one fragment shader.
You will create your own 3D scene or music visualizer with ray marching. I will go over some examples of raymarching, how to set up the scene, and provide more material/functions/techniques so you can customize your scene or visualizer to fit your style.
Ray marching is seriously my favorite technique for fun shader programming. One of the reasons I love it is that it is physically based, i.e. you follow a ray the same way photons bounce around in the real world. It has a lot of use in the future with all this drive towards physically based realtime rendering techniques.
Schedule
9:00 – 9:30 EDT (30 min) Hello!
9:30 – 10:00 EDT (30 min) Review of 2D shaders & introduction to raymarching
10:00 – 10:40 EDT (40 min) We will write a raymarcher together.
10:40 – 11:10 EDT (30 min) Go over sticker sheet & break off into groups for workshopping time in www.shader.place
11:10 – 11:40 EDT (30 min) Those who wish can show their music visualizer or scene. I will take questions and present steps going forward to learn more about shader coding.
Links
👋 The Force by Shawn Lawson the editor we are using: https://shawnlawson.github.io/The_Force/
👯♂️👯♀️ Shader place is a collaborative shader editing tool, good for sharing creations online. We will use it in our breakout rooms. The main difference is that time is passed in as u_time. https://www.shader.place/
🥚Here is the 3D sticker sheet aka a small selections of functions you can copy paste into your code: https://gist.github.com/CharStiles/e6fec016967c6c8fd648aa4b6c0055cc
🐛 Here are more 3D functions and some operations aka more stickers from IQ!: https://www.iquilezles.org/www/articles/distfunctions/distfunctions.htm
🦋 Here are more 3D functions & operations aka more more stickers by the demogroup Mercury these have good space modification functions: http://mercury.sexy/hg_sdf/
🧮 Here is an online graphing calculator, very helpful when writing shaders: https://www.desmos.com/calculator
Slides
🎞 Link to my presentation slides: https://docs.google.com/presentation/d/1uxLZVnGRJp1sajsfIXXTS-tLkxc-C_h2xVbC7hm4XOg/edit?usp=sharing
Code
I know many people learn different, the following 4 checkpoints are for folks who want to look on and I will explain every line of code. I will tell you when we are at what checkpoint. I will follow these as closely as I can!
Review of 2D shaders checkpoint!: https://gist.github.com/CharStiles/e2c31bf39f441cea7fe277aaa109d2e5
Checkpoint 1: https://gist.github.com/CharStiles/698d7eebd1c3739f9c566446dcd1c058
Checkpoint 2: https://gist.github.com/CharStiles/2e5889a660b8c7cbf8d1e0b5ff4bf1e4
Checkpoint 3: https://gist.github.com/CharStiles/e6d15533cfc955fa657cbe556d661c64
final extra bonus checkpoint: https://gist.github.com/CharStiles/c77d466cec2bc5185d9744a7cac508fc
Next Steps
These are some specific suggestions from me if you want to continue learning but don’t know how to start.
1. Learn the maths from Physically Based Rendering book
** If you haven’t looked at this already, look through it! Its wonderfully dense and has a lot of versatile useful information: http://www.pbr-book.org/
2. Get into more tutorials!
** This tutorial here: https://github.com/ajweeks/RaymarchingWorkshop is super thorough and really useful!
3. Get involved with the community online
*** you can see some amazing raymarched scenes online at shadertoy.com
Here I am copy pasting the suggestions from the last workshop that are not specific to 3D shaders, instead to get better at shader & math in general:
Learn from The Book of Shaders
** If you haven’t looked at this already, look through it! Its wonderfully paced and has a lot of versatile useful information: https://thebookofshaders.com/
More online math
*** http://immersivemath.com/ila/index.html
Learn more about GLSL shader functions:
***https://www.shaderific.com/features
Learn more math that is relevant from an awesome youtube channel 3 blue 1 brown.
*** https://www.youtube.com/channel/UCYO_jab_esuFRV4b17AJtAw
Some easing functions if sin & cos get boring 🙂
