]

Thorne Brandt

Mobile Menu

Book of Shaders : Pollock

GLSL Study 4

May 22nd, 2022

In the Noise chapter of the The Book of Shaders, there is an interesting challenge to recreate a Pollock, using shader code. The following image is presented as an example.

Jackson Pollock - Number 14 gray
Read More

Book of Shaders: Noisy Distance

GLSL Study 3

May 16th, 2022

I've been studying writing glsl shaders from scratch and one of the best resources available for developing intuitive understanding is The Book of Shaders, but I've noticed that the author has left it unfinished. for the better part of a decade and there doesn't seem to be much available online with actual answers to the end-of-chapter challenges, so I felt like a lot of people were permanently left in the dark wondering whether or not they actually learned anything and eventually gave up on studying shaders. I decided I would try to blog as many as I could in case people were stuck.

Shaders really start getting interesting when you start implementing randomness. The Noise section of The Book of Shaders includes some vague challenges about "using noise with distance." I assumed that this meant using some overlapping to create the illusion of a rough edges.

Here's a simple demonstration of a reusable function. You multiply the larger circle and make the solid circle slight smaller than the radius input.


float rough_circle(in vec2 _st, float radius){
    float noiseScale= 90;
    vec2 noise_st = _st * noiseScale;
    float _noise = noise(noise_st);
    float circle1 = circle(_st, radius);
    float circle2 = circle(_st, radius - (0.01));
    float color = (circle1 * _noise) + circle2;
    return color;
}

Read More

Book of Shaders: Indexed Pattern

GLSL Study 2

May 9th, 2022

There was an interesting part in the Patterns chapter of The Book of Shaders, which seemed to divide up the shader matrix into blocks with an index number and distort the effects in that block of space based on this index variable. There was this provided code that was parsed within the function with if/else blocks.


//  Give each cell an index number
//  according to its position
float index = 0.0;
index += step(1., mod(_st.x,2.0));
index += step(1., mod(_st.y,2.0))*2.0;

//      |
//  2   |   3
//      |
//--------------
//      |
//  0   |   1
//      |

I'll demonstrate how to write a reusable function that returns a normalized index based on a variable amount of cells to produce effects like the following:

Read More

Book of Shaders : Scrolling Bricks

GLSL Study

May 2nd, 2022

I've been studying writing glsl shaders from scratch and one of the best resources available for developing intuitive understanding is The Book of Shaders, but I've noticed that the author has left it unfinisehd for the better part of a decade and there doesn't seem to be much available online about the answers to the challenges that are at the end of each chapter. I decided I would try to blog as many as I could in case people were stuck.

In the Patterns chapter, there is a challenge to make alternating rows of a matrix scroll at different speeds, and then repeat this effect vertically. In this post, I will explain how to code the following effect from scratch.

Read More