![Day[9]TV](/images/header-logo.png){kind=logo}
Signed distance fields visualization
hakkthazard GameDev DK30 Spring 2019 1 2
Description
I’d like to learn about how signed distance functions can be used in shaders to make interesting visualizations like the ones on ShaderToy. I will experiment with spheres, transformations, animations, etc. in an OpenGL fragment shader that will render a 3D visualization behind a 2D game.
Recent Updates
Week 4
- The visualization proved too slow to run in the background on older computers, which I want my engine to support (at least for low-res pixel art games). So I will consider this project completed, as I did learn a little bit about SDF.
Week 3:
- Added phong lighting. (Had to reduce the resolution to get it running on my old laptop, should run faster on newer computers.)
Week 2:
-
Added fog, linearly fading to a background color
-
Added rounded cubes: regular cube sdf function, minus a radius to round off the edges.
-
Added a camera: chooses a camera target and position, uses them to transform the ray origin and direction. The camera target and position are animated over time
Week 1:
-
Set up render command from the game to the renderer to render the visualization. The game just specifies the screen width/height and the time t, for animation. All of the math/geometry/etc is handled in the fragment shader.
-
Wrote a ray marching shader, set up the typical ray-tracing method for choosing the ray direction for each pixel, and wrote the signed distance function for spheres. The spheres are repeated by using a “mod” operation, so you can render as many spheres as you want for the cost of 1.
Estimated Timeframe
Apr 5th - May 5th
Week 1 Goal
Write the code necessary to render a full screen visualization to the background of the game, and draw some simple shapes. No lighting or animation yet.
Week 2 Goal
Implement some other shapes, like cubes, and try to implement some of the sdf transformations/alterations, like twisting, union/intersections, etc., as well as camera transformations.
Week 3 Goal
Experiment with color and lighting: try simple phong lighting, glow, procedural textures, see if any of them look nice as a background visualization
Week 4 Goal
Put all of the previous steps together and see what kind of animated geometric visualization I can come up with.
