notes/bolts - 03/25/23
<- Newer   Older ->

TouchDesigner First Step Pt. 2 - Lighting Bolts

I am not a blank slate person. Much like an object at rest stays a rest, with me a blank page stays blank. However, as soon as a line, mark, or fuzz lands on that page I'm good to go. Using this as an excuse, continuing to want to learn TouchDesigner, and having just seen a neat game dev tutorial on making lighting, I thought that would be a fun thing to try.

Completed Network: Completed Network

The first problem to solve was how to manage CHOPs to create noise curves with pinned edges, and good feeling movement.

Bolt Component: Bolt Components

Pinning the edges of the noise chop: Pinning the edge of the noise chop

Once I had a noise curve with pinned edges, I drew a series of SOP curves with those lines, and rendered them into TOPs. By rendering them at a few thicknesses, I added blur and overlay effects to make the lines seem to glow.

Sops to make the bolt: Sops to make the bolt

This effect worked pretty well, and by layering multiple copies of these lines over each other got a pretty great effect. The missing effect was, color.

Shader Top: Shader top

I'm a sucker for Chromatic Aberration. It's a neat effect, and I had not used it in a piece of software before! One small problem, I know next to nothing about shaders.

Thanks YouTube. Basic Shader Example

This quick little walkthrough was perfect for a simple shader to push around the different color channels in an image in TD.

uniform vec2 uInputRes, uRedPos, uGreenPos, uBluePos;
uniform float uRedScale, uGreenScale, uBlueScale;

out vec4 fragColor;
void main()
{
    vec2 redPos = uRedPos / uInputRes;
    vec2 greenPos = uGreenPos / uInputRes;
    vec2 bluePos = uBluePos / uInputRes;

    vec4 color = vec4(1.0);
    color.r = texture(sTD2DInputs[0], vUV.st / uRedScale - redPos).r;
    color.g = texture(sTD2DInputs[0], vUV.st / uGreenScale- greenPos).g;
    color.b = texture(sTD2DInputs[0], vUV.st / uBlueScale - bluePos).b;
    fragColor = TDOutputSwizzle(color);
}

I'm pretty happy with the final result here, it was a great learning experience for TD touching on so many of its components with a dash of shaders on top.

Bolts: Bolts

Code can be found here: gitlab.com/JordanParsons/gfx.



Top
<- Newer   Older ->