GM Shaders Mini Tuts

GM Shaders Mini Tuts Substack focuses on providing concise tutorials on shader programming for game developers. It covers diverse aspects like color spaces, dithering, blending algorithms, noise generation, lighting effects, material rendering, optimization techniques, and visual effects. The content ranges from basic principles to advanced concepts, including guest insights on practical applications in game development.

Shader Programming Color Theory Graphics Optimization Lighting and Materials Mathematics in Shaders Visual Effects Game Development Tools and Techniques Advanced Graphics Techniques

The hottest Substack posts of GM Shaders Mini Tuts

And their main takeaways
157 implied HN points 13 Jan 24
  1. Simplex noise is a noise algorithm that is cheaper in higher dimensions and produces fewer artifacts than Perlin noise.
  2. Consider baking noise onto textures for optimization, especially in 2D for better performance.
  3. To make noise tillable, stick with a square grid and use modulo tiling for seamless textures.
235 implied HN points 02 Dec 23
  1. Color blending in OkLab offers a more natural transition compared to regular RGB blending
  2. Understanding color spaces like sRGB and linear RGB is important for accurate color manipulation
  3. OkLab is a color space that approximates human perception of lightness and chroma, offering perceptually consistent color balancing
58 implied HN points 10 Feb 24
  1. WebGPU is the new standard for accelerated graphics and compute, set to replace WebGL. It offers more features, deeper low-level access, and enhanced security, making it exciting for developers.
  2. WebGPU provides cross-platform support, allowing for better control over GPU resources, and introduces compute shaders for handling diverse data types efficiently.
  3. WGSL, the shading language of WebGPU, is stricter than GLSL with similarities to Rust or Swift. It offers optimizations and consistent results across different hardware configurations.
98 implied HN points 06 Jan 24
  1. By using gl_FragData[0-3], you can output 4 separate fragment colors to up to 4 surfaces with one draw call
  2. Multiple Render Targets have various applications like deferred rendering, unique object IDs, and depth maps in 2D or 3D contexts
  3. Consider limitations with MRTs, like compatibility with platforms, VRAM usage, and controlling fragment outputs independently
Get a weekly roundup of the best Substack posts, by hacker news affinity:
137 implied HN points 08 Dec 23
  1. Global Illumination in 2D can be achieved using Radiosity based GI for real-time per-pixel lighting in video games.
  2. Raymarching is a technique that accelerates scene rendering by approximating the distance to the nearest surface, often using Image-Based Distance Fields.
  3. Using Blue Noise and implementing implicit ray bouncing can enhance the quality of Global Illumination in games by providing uniform noise and consistent lighting across frames.
117 implied HN points 25 Nov 23
  1. Phi is a mathematical constant used for distributions and design.
  2. Phi is considered the "most irrational number" and has various practical uses.
  3. Understanding Phi can optimize shader computations and distribution techniques.
117 implied HN points 18 Nov 23
  1. Matrices can rotate, scale, and skew both vectors and vector spaces.
  2. Matrices are multiplied with vectors or other matrices to transform them.
  3. Matrices are powerful tools in shaders for operations like color remapping and noise functions.
157 implied HN points 11 Sep 23
  1. Alpha blending in shader programming requires blending colors and alpha channels separately.
  2. Weighted averages provide greater control for combining multiple elements together in shaders.
  3. Creating a simple 3D perspective effect in shaders involves scaling with a linear gradient.
157 implied HN points 02 Sep 23
  1. When working with shaders, think in terms of vector fields to direct the flow and create gradients.
  2. Consider the acceptable input domains and the output ranges of your functions to prevent errors and unexpected results.
  3. Utilize periodic functions for repetition, sine and cosine for waves and rotations, dot product as a ruler, and exponentiation for adjusting brightness levels.
98 implied HN points 29 Oct 23
  1. Understanding color values in shaders is crucial for avoiding washed out lights and ugly color banding.
  2. Tonemapping can help smooth out brightness levels and maintain color accuracy in shaders.
  3. HDR rendering can provide more accurate color representation beyond the standard 0 to 1 range.
196 implied HN points 25 Jul 23
  1. Dithering can help blend colors smoothly without mixing them
  2. There are three common types of dithering algorithms: Ordered (Bayer), White Noise, and Blue Noise
  3. Blue noise can provide a more even distribution of values compared to White noise
137 implied HN points 18 Aug 23
  1. Noah Pauw discusses creating advanced 3D graphics in GameMaker using shaders for real-time lighting and PBR materials.
  2. Game Maker is favored by Noah despite advice to switch to Unity or Unreal for photorealistic 3D games.
  3. Noah shares insights on using Blender for 3D modeling, creating lighting shaders, implementing PBR materials, and drawing 3D environments in Game Maker.
117 implied HN points 15 Jul 23
  1. Using raymarching for rendering buildings can simplify complex fractal generation
  2. Deferred rendering can be utilized to optimize lighting workload by rendering lights onto surfaces
  3. Implementing HDR tone mapping can enhance color accuracy and brightness transitions in the game graphics
98 implied HN points 07 Aug 23
  1. Emulating the retro CRT monitor look involves RGB color masking, pixelation, chromatic aberration, screen curvature, vignette, pulsing, scanlines, and bloom.
  2. Creativity allows for creating variations using different effects like scanlines, chromatic aberration, vignette, or just the RGB mask and pixelation.
  3. The tutorial provides insights on how to recreate the CRT effect for a game's visuals, providing a cozy and nostalgic feel.
117 implied HN points 02 Jun 23
  1. Learn how to handle scaling, aspect ratios, and centering in shaders.
  2. Understand the importance of converting between texture and pixel coordinates.
  3. Center pixel coordinates to properly scale and center elements on the screen.
137 implied HN points 14 Jan 23
  1. Consider using a lighting surface with additive blendmode for a simple shaderless lighting solution.
  2. For realistic light attenuation, use falloff equations based on distance from the light source.
  3. When dealing with multiple lights, choose between forward rendering for precision or deferred rendering for scalability.
117 implied HN points 11 Feb 23
  1. Blend modes in GameMaker can enhance graphics for lighting, shading, and more.
  2. To recreate Photoshop blend modes, shaders are needed for blending two colors.
  3. Formulas for common Photoshop blend modes have been recreated for easy replication.
39 implied HN points 07 Oct 23
  1. Different vector spaces like texture space, screen space, object space, world space, view space, and projection space serve specific purposes in graphics programming.
  2. Understanding these spaces helps in manipulating orientation, scales, positioning, and skewing of vectors for advanced effects like fog, SSAO, and shadow mapping.
  3. Each space has unique characteristics, such as how texture space is measured in texel units and world space represents position in the room.
98 implied HN points 22 Apr 23
  1. Fast Approximate Anti-Aliasing (FXAA) is a cheap and effective algorithm for producing smoother images.
  2. Understanding the uses and limitations of FXAA is important for practical implementation.
  3. The FXAA algorithm involves sampling, computing luma, gradient directions, and blurring for smoother results.
98 implied HN points 04 Feb 23
  1. Normals in computer graphics are vectors perpendicular to the geometric surface
  2. Normals in normal maps are 'normalized' with a vector length of 1.0
  3. Normal map shaders involve orientation with textures and Lambert's cosine law
58 implied HN points 11 Jun 23
  1. Chromatic aberration can enhance visual style in games when used tastefully
  2. Color shift effects can be achieved by sampling textures and applying weights for blending
  3. Exploring different blending techniques like linear, radial, and twist can create unique visual effects
78 implied HN points 16 Dec 22
  1. Use shaders to improve the look of particle systems like fluids in GameMaker
  2. Applying smooth alpha gradient and alpha contrast helps create a translucent water effect
  3. Consider adding a refraction effect to enhance the visual appeal of the water
58 implied HN points 26 Jan 23
  1. Diffuse reflections are important for creating shading effects on objects.
  2. Understanding Lambert's cosine law helps in computing lighting based on the angle between light direction and surface normal.
  3. Bump mapping can be a simple way to implement shading in games by adding depth and detail.
58 implied HN points 07 Jan 23
  1. Twigl is an open-source mini shader editor for tweet-sized shaders.
  2. Twigl has different regulation options affecting the shader formats.
  3. When porting shaders to GameMaker, ensure proper variable initialization and handle differences in coordinates and alpha channels.
19 implied HN points 29 Sep 23
  1. Shaders have limitations: vertex shaders can move vertices, fragment shaders can set colors or discard themselves.
  2. Consider resolution and texture samples for efficient shader performance.
  3. GLSL 1.00 has limitations compared to newer versions, affecting features like operators, data types, and texture functions.
58 implied HN points 10 Dec 22
  1. Don't avoid using if statements, as modern hardware and compilers handle them efficiently.
  2. Consider pre-computing data using Look Up Textures (LUTs) to optimize shader operations.
  3. Use multipasses to divide the shader computations and optimize the rendering process.
19 implied HN points 27 Aug 23
  1. Using 'shader_enable_corner_id()' in vertex shaders for 3D particles allows identification and manipulation of vertices in GameMaker.
  2. Understanding vertex buffers and formats in GameMaker is essential for drawing and manipulating shapes.
  3. By manipulating corner IDs in shaders, it is possible to transform particles and sprites in GameMaker into 3D billboards.
58 implied HN points 15 Oct 22
  1. Textures can appear repetitive and blurry when zoomed in.
  2. Scaling textures based on depth can maintain detail across distances.
  3. Fractal texturing involves blending different texture scales for consistent detail.
39 implied HN points 02 Dec 22
  1. HLSL can help maximize code performance in GameMaker by providing extra control.
  2. HLSL offers additional features like multiple render targets and native support for derivatives.
  3. When using HLSL shaders, struct usage replaces attributes and varying vectors from GLSL.
39 implied HN points 24 Nov 22
  1. Environment maps are panorama textures that capture the 360-degree surrounding environment.
  2. To use HDRI textures in shaders, convert direction vectors to texture coordinates.
  3. You can create skyboxes, reflections, and lighting effects using environment textures in shaders.
39 implied HN points 11 Nov 22
  1. Worley noise involves randomly scattering points and determining brightness based on distance to the closest point
  2. Voronoi noise is a variation of Worley noise where the output is based on the value of the closest points
  3. Fractal noise involves layering noise at different scales to create natural looks, useful for things like clouds or terrain generation
39 implied HN points 04 Nov 22
  1. Understanding hash functions for generating random numbers is essential for creating various effects in shaders.
  2. Value noise involves dividing coordinates into cells, sampling corners, and smoothly interpolating between them for natural-looking results.
  3. Perlin noise improves on value noise by interpolating between gradients in random directions for smoother and more realistic outcomes.
39 implied HN points 10 Sep 22
  1. Creative coding is writing code as an artistic expression.
  2. Start with achievable inspiration when creating shaders.
  3. Iterate and fine-tune your shader design to achieve your desired look.
39 implied HN points 26 Aug 22
  1. Code golfing is about shrinking code to the smallest size possible.
  2. Reasons to try code golfing: understand language better, optimize code for speed, discover new logical relationships.
  3. Tips for code golfing: reduce names and numbers, minimize initializations, avoid ifs, use for(;;) over while(), learn mathematical equalities for substitutions.
39 implied HN points 19 Aug 22
  1. Recursive shaders can be powerful for effects like blurs by applying shaders multiple times.
  2. Consider breaking down effects into multiple passes for better performance and quality.
  3. Use ping-pong buffers to efficiently handle multiple shader passes with minimal VRAM usage.
19 implied HN points 28 Oct 22
  1. Texture filtering can affect how textures look when scaled, with common methods being nearest and linear filtering.
  2. Linear filtering can help smooth textures but may cause strange outlines around sprites, while nearest filtering gives a more pixelated look.
  3. Other filtering methods like cubic filtering can provide smoother transitions between pixels, and mipmapping can be useful for blur effects or maintaining texture quality.
19 implied HN points 03 Sep 22
  1. The dot product in shaders is a function that takes in two vectors and returns a scalar value.
  2. Dot products can be used for various applications like computing angles, creating patterns, and simulating light attenuation.
  3. Understanding and utilizing dot products is essential in shader programming for tasks like color manipulation, pattern generation, and lighting effects.
19 implied HN points 12 Aug 22
  1. Texels are texture-space units, while pixels are screen-space units
  2. Texel uniforms are needed to convert texture coordinates to pixels for effects like distortion
  3. Converting between texel and pixel coordinates is essential in shader programming