In this GLSL shader tutorial, we will go over the basics of Signed Distance Fields (SDFs). We will start by setting up a GLSL shader in VS Code with proper UV coordinates. Then we will draw a circle using the SDF function available on Inigo Quilez’s website. Finally, we will add some visuals to help us understand how the SDF works.

Code https://github.com/SuboptimalEng/shad...
Twitter   / suboptimaleng  
GitHub https://github.com/SuboptimalEng
Website https://suboptimaleng.com

== [ Resources ] ==
Inigo Quilez’s Articles https://iquilezles.org/articles
The Book of Shaders https://thebookofshaders.com
Simon Dev’s Shader Course https://simondev.teachable.com
VS Code GLSL Shader Setup Guide    • How to Write GLSL Shaders in VS Code  

== [ Timestamps ] ==
00:00 Intro to SDFs
01:08 GLSL Shader Setup
02:03 UV Coordinates
03:23 Signed Distance Field
04:47 Exponential Shadow
06:04 Sin Waves
07:00 Smoothstep Border

== [ Tags ] ==
#suboptimal #glsl #shaders