Skip Navigation
InitialsDiceBearhttps://github.com/dicebear/dicebearhttps://creativecommons.org/publicdomain/zero/1.0/„Initials” (https://github.com/dicebear/dicebear) by „DiceBear”, licensed under „CC0 1.0” (https://creativecommons.org/publicdomain/zero/1.0/)FE
Posts
89
Comments
15
Joined
2 yr. ago
Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Simple spinner shader (tutorial)

Hey everybody! Recently, we created a shader that simulated an analog clock using polar coordinates, and we'll stick with this type of display a little longer. This time, I'll demonstrate how to program a fully customizable spinner based on similar principles. So, let's start coding!

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Raymarching, part 4 (tutorial)

Hi everybody! I hope the previous episodes have piqued your interest and that you're motivated to learn more tricks for rendering a 3D scene in 2D shaders. As you may have noticed, so far we've been able to change the camera's position, but not the direction it's facing, meaning it was fixed straight ahead, which has been somewhat limiting. In this video, we'll solve this problem, so that by the end, we'll be able to aim the camera anywhere or even set it up as an orbiting camera. So, let’s do it.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Raymarching, part 3 (tutorial)

Hi everybody! And welcome back to our miniseries dedicated to rendering 3D scenes in shaders using the ray marching method. In the third episode, we will bring the previously static scene to life – adding combinations of objects, rotations along different axes and pivots, multiple lighting sources, and morphing using the so-called smooth minimum.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Analog clock shader (tutorial)

Hi everyone! Do you remember the digital clock shader I created here some time ago? It was one of the first 2D shaders I used in a 3D project, and the result looked very usable. I think a shader simulating a classic analog clock could have a similar application, and that's exactly what we'll be creating today.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Julia set shader + mouse events (tutorial)

Hi everyone! In this video, I would like to demonstrate a shader that reacts to mouse clicks and movements. It is a variation of a shader displaying the Mandelbrot set, which I created here about a year ago. This time, however, we will enhance it by adding the Julia set at a point chosen by the user, and we will add more control elements, all of which will be controlled by the mouse.

Godot @programming.dev
FencerDevLog @programming.dev

One-click 3D model to 2D sprite in Godot 4.4 (tutorial)

Hi everyone! In this video, I won't be showcasing any shader. Instead, I'll show you a trick for easily generating 2D sprites from 3D models in Godot Engine 4.4 or higher.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Tilted square grid shader (tutorial)

Hello everybody! In this video, I would like to create an effect that transforms a scene into its pixelated version. We've seen that before, right? But this time, we won't settle for ordinary square objects—we'll tilt them a bit to create a diagonal grid with an adjustable size. Let's take a look at how such an algorithm works.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Color palette filter (tutorial)

Hi everyone! Let's create a simple algorithm that allows us to remap the colors of our scene to a predefined palette. This effect can be useful if, for example, we want to simulate the screen of an older device that only supported, say, 256 colors, and similar scenarios.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Raymarching, part 2 (tutorial)

Hi everybody. This is the second part of the tutorial, which explains the basics of a technology called ray marching for rendering a 3D scene using a shader. In the first part, we modeled a simple scene with a sphere, a cylinder, and a cube, and this time we will demonstrate how to properly light such a scene and calculate shadows.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Raymarching, part 1 (tutorial)

Hi everybody! Let's try something a little different today - an introduction to creating complete 3D scenes using shaders. Yes, I know - this technology, called ray marching, has been described many times in other tutorials, and it's hard to come up with something entirely new. Still, I think it wouldn't hurt to add such a video to our collection because I plan to expand on this topic in a new series, and it would be good to have a reference for the absolute basics.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Trail of ellipses (tutorial)

Hi everyone! Let's use the Godot shading language to recreate an effect that falls into the category of a large number of small objects following a trajectory. It consists of simple elements, in this case, ellipses, that orbit along certain curves and together create interesting-looking patterns. So, let's get started.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Dynamic fog shader (tutorial)

Hi everyone! In this video, we will take a look at a technique that allows us to create very interesting pseudo-random patterns using functions we know from previous tutorials, such as plasma, plexus, or lightning. This time, we will use a method called domain warping or domain distortion, and the result will be this infinitely changing fog that we can see in the background right now.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: LCD monitor shader (tutorial)

Hey everybody! Do you remember the simulation of an old CRT monitor I created about a year ago? We had programmed various issues and imperfections characteristic of these devices, such as white noise, rounded corners, ghosting, and so on. This time, we’ll simulate a more modern device: an LCD with its typical pixel grid and less vibrant colors. Unlike CRT, such a shader is elementary, as we’ll see right away.

Godot @programming.dev
FencerDevLog @programming.dev

Godot 4: Triangular tunnel shader (tutorial)

Hi everybody! Do you remember the 3D tunnel created using a texture mapped onto the inside of a cylinder? I think the result looked quite decent, especially when the camera was set in motion, giving us the impression of flying through an endless tube that disappears into distant darkness. This time, let's try something similar, but without textures and with a triangular shape.

  • Thanks! The offset of UV coordinates works like refraction, localized to the corresponding cell of the defined grid. Without using a noise texture, such light refraction would be circular, similar to the magnifying glass effect. However, this approach creates slightly irregular shapes, which better simulate droplets on a window pane. If you reduce the drop_layer function to its absolute minimum, you should see the mentioned grid before the shaping and movement of the droplets.

    Like this:

     undefined
        
    vec2 drop_layer(vec2 uv, float time) {
        vec2 grid = vec2(grid_x, grid_y);
        vec2 drop_uv = fract(uv * grid);
        drop_uv = 2.0 * drop_uv - 1.0;
        vec2 drop_size = drop_uv / grid;
        return drop_size;
    }
    
    
      
  • Godot @programming.dev
    FencerDevLog @programming.dev

    Godot 4: Rainy window shader (tutorial)

    Hi everyone! I think that a simulation of a raindrop trickling down a window is a very nice effect, and if there are more of them, they can be both highly useful and visually striking in games. So, let’s explore how this shader works from a programming perspective.

    Godot @programming.dev
    FencerDevLog @programming.dev

    Godot 4: Digital clock shader (tutorial)

    Hello everyone! This is the first video I'm recording in 2025, so I hope it turns out well. This time, I’d like to show how we can use a shader to create a digital clock, which we will then control using a script. So, let’s get started.

    Godot @programming.dev
    FencerDevLog @programming.dev

    Godot 4: Blob shader (metaballs tutorial)

    Hey everybody! And welcome to the last tutorial of this year. Of course, this is definitely not the absolutely final tutorial, as I will continue with a new batch of learning materials in January. So, how are we ending the year 2024? We will be implementing blobby objects, also known as metaballs. Yes, exactly what you see on the screen right now. So, let's get started.

    Godot @programming.dev
    FencerDevLog @programming.dev

    Godot 4: Another video glitch shader (tutorial)

    Hi everyone! Let's add a simple effect simulating a TV signal disturbance to our collection. It actually resembles typical artifacts when playing recordings from a low-quality VHS tape, but it's up to each programmer to find a suitable use for it. And because it's a very simple algorithm with just a few lines of code, this video will be relatively short as well. So let's create it.

    Godot @programming.dev
    FencerDevLog @programming.dev

    Godot 4: Wet painting shader (tutorial)

    Hey everyone! The end of 2024 is slowly approaching, so I thought it would be good to add at least one more post-processing effect before diving into something more complex next year. This time, it’s again about layering, with each layer shifted differently using a noise texture and rotation. With a bit of imagination, the result can resemble a painting where the colors have blurred and blended together slightly. Let’s take a look at how this algorithm works.

    Godot @programming.dev
    FencerDevLog @programming.dev

    Godot 4: Earthquake shader (tutorial)

    Hey everyone! Let’s create a simple shader that will shake our screen or an element on the screen as if an earthquake has occurred. This could be quite useful in various platformers, right? And, in fact, it’s very easy to implement. Let’s get coding.

  • Well, Godot is a lightweight engine, so it doesn't have almost anything extra built-in. Which is advantageous because the engine itself then takes up negligible space on disk and the editor starts up within seconds, which can't be said for Unreal. But everyone prefers something different, of course. I mainly wanted to show that implementing your own blur effect can be simpler than it might seem at first glance.