Using noise in shaders (texture blending)

0:00 Intro
0:30 What is noise?
1:48 Setup
3:23 Vertex Shader
3:50 Reading textures
4:27 Blending with mix
5:01 Reading noise values
5:39 Controlling the noise
7:07 Scaling the noise
7:58 Conclusion

Code from this video:
https://editor.p5js.org/BarneyCodes/s...

Introduction to shaders:    • Introduction to shaders: Learn the ba...  

Examples used:
“Base warp fBM” by trinketMage: https://www.shadertoy.com/view/tdG3Rd
“contour noise” by DeltaT: https://www.shadertoy.com/view/dsGfRz
"Cloud perturbations" by felipetovarhenao: https://www.shadertoy.com/view/mdcBDl

More resources on noise:
Procedural shader noise: https://thebookofshaders.com/11/
Some different noise algos: https://lodev.org/cgtutor/randomnoise...
Perlin noise wiki article: https://en.wikipedia.org/wiki/Perlin_...

Textures used in this video:
Dirt texture: https://opengameart.org/content/simpl...
Grass texture: https://opengameart.org/content/10-se...

Noise textures give programmers a way to introduce random and organic elements into their effects. In this video I'll show you how you can use noise textures in a shader to create a simple texture blending effect.
There are so many ways that you can use noise to create awesome looking visuals, so hopefully you find this video useful and pick up a few tricks!

Follow me:
Twitter:   / barneycodes  
Reddit:   / barneycodes  
Support the channel: https://www.youtube.com/@BarneyCodes/...

#glsl #p5js #shaders