An introduction to Shader Art Coding
kishimisu kishimisu
46.2K subscribers
982,823 views
61K

 Published On May 20, 2023

In this tutorial, I explore the fascinating realm of shader art coding and aim to offer helpful insights and guidance to assist you in beginning your own creative journey. I hope to share my passion with you along the way!

Final shader: https://www.shadertoy.com/view/mtyGWy

Resources presented in the video:
• Shadertoy: https://www.shadertoy.com/
• Inigo Quilez website: https://iquilezles.org/articles/
• 2D signed distance functions: https://iquilezles.org/articles/distf...
• Color palette article: https://iquilezles.org/articles/palet...
• Color palette webapp: http://dev.thi.ng/gradients/
• Graphtoy: https://graphtoy.com/

Other useful resources:
• GLSL Reference & Swizzling: https://www.khronos.org/opengl/wiki/D...
• The Book of Shaders: https://thebookofshaders.com/
• Shadertoy Unofficial: https://shadertoyunofficial.wordpress...
• Inigo Quilez's channel: ‪@InigoQuilez‬
• The Art of Code's channel: ‪@TheArtofCodeIsCool‬

Shaders showcased in the intro:
"Cloud Ten" by nimitz: https://www.shadertoy.com/view/XtS3DD
"Abstract Glassy Field" by Shane: https://www.shadertoy.com/view/4ttGDH
"For the neon style enjoyers" by mrange: https://www.shadertoy.com/view/ddcGW8
"Fractal Land" by Kali: https://www.shadertoy.com/view/XsBXWt

Video editing: Premiere & After Effects
Animations: Manim Community and GLSL Shaders

Note that the voice-over has been generated using AI !
I wasn't really satisfied about my french accent and poor mic quality that made the video even harder to follow. I'm not sure if I'll continue using it in the future. What did you think about it ?

Follow me if you want to see more content like this!
• Instagram:   / kishimisu   (Digital Art)
• Twitter:   / kishimisu   (Computer Graphics, ML, Shaders..)

Timestamps:
0:00 Introduction
0:52 What are shaders ?
2:55 Shadertoy
3:19 In/out parameters
4:04 Display colors
4:40 fragCoord
5:26 iResolution & swizzling
6:45 uv coordinates
7:45 Center uvs
8:49 length()
9:42 Fix aspect ratio
10:36 Signed Distance Functions
11:43 step()
12:13 smoothstep()
12:50 sin() and iTime
13:58 1/x
15:07 Add colors
17:22 fract()
19:05 Iterations
20:13 exp()
21:31 pow()
21:55 Conclusion

Music by | e s c p | escp-music.bandcamp.com

show more

Share/Embed