What is Perlin Noise?

Рет қаралды 11,923

Күн бұрын

In this GLSL shader tutorial, we will go over Perlin noise. We start by setting up a GLSL shader in VS Code. Then we create a grid of cells and generate random gradients at the corner of each grid cell. Afterward, we generate a vector for each pixel coordinate and calculate the dot product to generate Perlin noise. Finally, we learn about Perlin noise variants like billow noise and ridged noise.
📖 Code - github.com/SuboptimalEng/shad...
🐦 Twitter - / suboptimaleng
💻 GitHub - github.com/SuboptimalEng
🌎 Website - suboptimaleng.com
== [ Resources ] ==
Inigo Quilez’s Articles - iquilezles.org/articles
The Book of Shaders - thebookofshaders.com
Simon Dev’s Shader Course - simondev.teachable.com
VS Code GLSL Shader Setup Guide - kzfaq.info/get/bejne/bbumo7eFqquVeKc.html
Sebastian Lagues’ Procedural Planets - kzfaq.info/get/bejne/fpqXYLd0xMXHpps.html
== [ Timestamps ] ==
00:00 Intro to Perlin Noise
00:41 Perlin Noise Algorithm
01:34 GLSL Shader Setup
02:42 Create Random Gradients
04:30 Find Distance to Pixel
05:15 Calculate Dot Product
06:50 Billow and Ridged Noise
== [ Tags ] ==
#suboptimal #glsl #shaders

Пікірлер: 15

@Ruan-yd6fs 3 ай бұрын

Thanks for making this video. I was struggling with understanding how Perlin noise works, but your video showed it with depth and simplicity.

@SuboptimalEng 3 ай бұрын

Thanks, I’m glad the video was helpful!

@OskarKassander Жыл бұрын

Great video and explanation once again!

@gehtsiegarnixan 5 ай бұрын

very well explained and visalized thank you!

@orbutbul908 Жыл бұрын

Amazing video! I was waiting for this one

@polandsilver3419 Ай бұрын

Thank you for this explanation! I'm new into programing (although I programmed in scratch when I was really young). That's realy good piece of knowledge :)

@SuboptimalEng 19 күн бұрын

Good luck on your programming journey!

@tortue5080 Жыл бұрын

nice thanks

@tanloclai5111 5 ай бұрын

thank you very very much...........

@metactal 3 ай бұрын

it bothers me that the font on the thumbnail and start of video are different

@tatrix 9 күн бұрын

Great video! Why smoothstep/quintic fixes grid like pattern?

@SuboptimalEng 9 күн бұрын

Hard to explain the math in a comment. I’d recommend trying out the shader and seeing why it works.

@iamtufa 8 ай бұрын

i didnt understand how u got the distance

@SuboptimalEng 7 ай бұрын

Code is open source on my GitHub so hopefully you can learn it from there!

@user-ww1ek6dk5p Ай бұрын

@@SuboptimalEng I think its actually wrong because the distance in your video is uv-direction, which its not the distance to the corer. However, It should be uv-cornor_pos instead