Custom Post-Processing Shaders: Full Cycle from Development to Optimization

Custom Post-Processing Shaders: Full Cycle

One common challenge in game development is creating a visual style that standard Volume Framework effects cannot cover. For example, a custom bloom with controllable threshold or stylized vignetting. On one mobile project, we reduced rendering costs by 25% by optimizing a shader from 4ms to 1.1ms — saving about 30% of the budget compared to an off-the-shelf solution. We guarantee every shader is profiled on target devices and does not break existing effects like TAA. Contact us for a consultation — we will find the optimal approach.

When Standard Effects Are Not Enough?

Unity URP/HDRP and Unreal Engine provide Volume Framework for post-processing, but each has areas where standard effects do not cover the needs of a specific visual style. In URP the most common pain point is the lack of native support for custom passes in Renderer Feature without deep understanding of ScriptableRenderPass and execution order in RenderPassEvent. Developers often insert a custom Blit in AfterRenderingPostProcessing and get an effect that is layered on top of the URP stack instead of being integrated inside it — resulting in TAA and FXAA either not working with the custom material or doubling artifacts. In HDRP the situation is different: Custom Pass works through CustomPassVolume, and if the shader uses _CameraDepthTexture without explicit declaration in TEXTURE2D + SAMPLER under HDRP macros, it simply renders a black screen on some platforms — no console warnings. Unreal-specific: post-processing via Material with Post Process domain works fast until you encounter r.PostProcessAAQuality and how TAA interacts with custom SceneTexture nodes. If the shader reads PostProcessInput0 without accounting for jitter offset, moving camera produces ghosting that looks like a renderer bug, but the cause is in the shader.

How to Avoid Ghosting with Custom Effects?

Ghosting arises from not accounting for jitter offset in TAA-compatible shaders. When inserting a custom pass into the pipeline, you must explicitly pass the difference between the previous and current frame. In Unity this uses _ScreenParams and _Jitter for URP; in Unreal, parameters from PostProcessSceneView. During integration we always check whether the shader correctly handles subpixel movement, and add compensation if needed. Profiling with RenderDoc and comparison with a reference frame identifies such artifacts before production delivery.

How to Properly Develop a Post-Processing Shader?

Step-by-step guide:

1. Analyze reference and define requirements — determine the effect and target platforms.
2. Prototype in ShaderGraph or Material Editor — quick hypothesis validation in 1–2 days.
3. Write HLSL/GLSL with platform constraints: for mobile use mediump float, minimal samples; for PC/console use multi-pass Blit and compute shaders.
4. Integrate into pipeline: ScriptableRenderPass for URP, CustomPassVolume for HDRP, Post Process Material for Unreal. Always set the correct RenderPassEvent and verify TAA compatibility.
5. Profile: RenderDoc, GPU Profiler, mobile profilers. Optimize until target FPS is achieved.

On one project — a mobile RPG in URP — the client wanted a custom "ink outline" effect over geometry. The first prototype using ScriptableRenderPass with Roberts Cross on depth took 4ms on Adreno 650 at 1080p. After rewriting to a single-pass with a simplified kernel and using _CameraDepthNormalsTexture instead of two separate textures — 1.1ms. The difference is not in the algorithm but in the number of texture fetches. Get a consultation from our engineer — we will analyze your project and propose the optimal solution.

What Is Included in the Work

Each shader comes with a complete package:

• Shader source code (HLSL/GLSL) with comments
• Integration script (ScriptableRenderPass / CustomPassVolume / Post Process Material)
• Setup instructions for Volume Framework parameters
• Performance recommendations for target platforms
• Support during implementation (up to 2 consultations)

Work Stages for Shader Development

Complex effects with multiple passes (e.g., volumetric fog via ray marching in post-process or screen-space subsurface scattering) can take 3–4 weeks including iterations.

Typical Mistakes in DIY Development

Most problems are not in the algorithm but in integration.

• Incorrect RenderPassEvent. Inserting a custom pass in BeforeRenderingPostProcessing without understanding that URP hasn't applied Color Grading yet — the LUT ends up on top of the custom effect instead of underneath.
• Ignoring camera stacking. In URP, with Overlay Camera a custom ScriptableRenderPass attached to Base Camera does not execute for Overlay — you must register the pass in both Renderer Assets or use Universal Renderer with correct renderingLayerMask.
• Hardcoded resolution. float2(1.0/1920.0, 1.0/1080.0) in shader instead of _ScreenParams.zw - 1 — on devices with non-standard resolution or dynamic resolution the effect breaks.
• HDR loss. If the effect is applied after tonemap but designed for linear HDR buffer — colors will be wrong. Important to explicitly define the point of application in the pipeline.

Consult with our engineer — we will analyze your project and propose the optimal solution. Order a preliminary assessment — we will calculate timelines and cost based on your requirements.

How to distinguish a working shader from a failed one?

A programmer adds water to a scene and gets a blue rectangle. The Asset Store delivers an outdated asset with artifacts on mobile. Shader development is not just applying a texture—it’s a complex engineering task: you need to understand the depth buffer, sample normals in multiple layers, and organize foam at intersections with geometry. Without this, the shader either doesn’t work or kills FPS.

Our team has been engineering shaders and VFX for over five years—during this time, we’ve worked on dozens of projects from indie to AAA. Once, a client brought a water scene from the Asset Store: on a mobile device, it ran at 12 FPS due to missing LOD and incorrect batching. We rewrote the shader for URP and achieved 60 FPS while preserving the visuals.

URP vs HDRP: What should you choose for your project?

The choice of Render Pipeline is fixed at the start—shaders for HDRP do not work in URP and vice versa. Evaluate the trade-offs based on the table:

Conclusion: URP provides up to +40% FPS on mobile devices compared to HDRP. For a mobile RPG, we chose URP—on an iPhone 8, we got stable 60 FPS without quality loss. HDRP is justified on PC/consoles where photorealism and the built-in Water System are needed.

How to develop shaders in ShaderGraph: from water to vegetation

ShaderGraph is a node-based editor without HLSL, but understanding "under the hood" is essential. Let’s break down a water shader—it includes several techniques.

Normal motion. Two layers of normal maps sampled at different speeds and directions:

Time → Multiply (speed1) → Add → Sample Texture 2D (normalMap)
Time → Multiply (speed2) → Add → Sample Texture 2D (normalMap)
→ Normal Blend → Normal (fragment shader)

Two opposing directional layers create the effect of running waves without tiling periodicity. Consumption: 2 texture samples, which fits within the budget of 40 draw calls for a water surface.

Depth and foam. Using the Scene Depth node (opaque texture must be enabled in URP/HDRP), we get the difference between the scene depth and the water fragment’s position. Shallow depth (intersection with the shore) → foam via Step/Smoothstep. Deep depth → more saturated blue, higher opacity. Foam adds 1-2 ms on GPU but provides a realistic shoreline.

Refraction. Scene Color + UV offset by normal map—the bottom "swims". Water is rendered in the Transparent queue, after all opaque geometry. Be sure to enable Opaque Texture in URP settings, otherwise refraction won’t work.

Fresnel and reflections. Fresnel Effect node—near the camera normal, the surface is more transparent; at sharp angles, it reflects. Physically correct for dielectrics. A cubemap or Reflection Probe is added on top of the Fresnel mask. On mobile platforms, replace Reflection Probe with a low-resolution cubemap (128x128)—saving 1-2 ms.

Vegetation shader. Animating bushes and grass without physics simulation—via vertex shader. In ShaderGraph: take vertex XZ coordinates as phase shift, Time → Sine with different phases, multiply by Vertex Color channel R (white = swaying, black = fixed to ground). Result: grass sways in waves, base remains fixed. For "wind when the player runs," add a CPU parameter _PlayerPosition. Such a shader handles 100,000 vertices in 0.3 ms on an iPhone 11.

The original asset used 4 normal map layers and dynamic cubemap reflections—on mobile, it delivered 12 FPS. After rewriting for URP with two layers, simplified foam, and baked reflections, we achieved 60 FPS. Development time saved: 1 day instead of 3 days for asset adaptation.

VFX Graph: How to manage millions of particles on GPU

VFX Graph runs entirely on GPU via Compute Shaders. Unlike Particle System (Shuriken), which works on CPU, here you can manage millions of particles without CPU load. Example: an explosion with shrapnel (200 particles) on GPU takes 0.05 ms, while a CPU Particle System of the same complexity takes 0.8 ms.

The graph is divided into contexts: Spawn (burst, constant rate, event trigger), Initialize (initial attributes), Update (gravity, turbulence, collisions), Output (Quad, Mesh, Lit/Unlit, Distortion).

Example: explosion with shrapnel

Spawn: Single Burst (count: 200)
  ↓
Initialize:
  Position: Sphere Volume (radius: 0.1)
  Velocity: Spherical * Random(5, 15)
  Size: Random(0.05, 0.3)
  Lifetime: Random(0.5, 2.0)
  Color: Gradient by lifetime (white → orange → gray)
  ↓
Update:
  Gravity (force: -9.8)
  Drag (coefficient: 0.2)
  Turbulence (intensity: 2.0)
  Collision (Scene SDF or Depth Buffer)
  ↓
Output Quad (Unlit):
  Texture: spark
  Blend Mode: Additive

Turbulence uses Noise Field—3D noise, particles deviate organically. Flipbook animations in the Output context—sprite animation for each particle.

How to optimize VFX for mobile platforms?

For mobile devices, reduce particle count to 50 and disable Collision—saving 3 ms. Use GPU instancing with VFX Graph’s automatic instancing: the same explosion effect on iPhone 11 runs at 0.02 ms per burst, which is 2.5x faster than a CPU-bound setup. Also enable particle LOD via Quality Levels in VFX Graph: lower particle counts on medium-spec devices while keeping visual fidelity on high-end.

Why does post-processing require platform-specific tuning?

Post-processing—effects applied to the final image after main rendering. In Unity via the Volume system (Local/Global Volume). Typical stack for an action project:

For mobile platforms, we disable Motion Blur and SSAO, reduce Bloom to 2-3 passes—final post-processing budget of 3-4 ms. On PC/HDRP, the stack can take 8-10 ms, but this is compensated by GPU power.

What deliverables do you get?

• Custom shader development in ShaderGraph (URP/HDRP): water, vegetation, character effects, holograms, dissolve.
• VFX Graph effects: explosions, fire, smoke, magic, environment. Maximum performance—up to 2 million particles on GPU at 60 FPS.
• Setting up and optimizing Particle System (Shuriken) for mobile platforms: replacing with GPU instancing reduces draw calls by 70%.
• Building a Post-Processing stack aligned with the project’s visual style, with render time measurement.
• Porting shaders between URP and HDRP when changing pipeline: average time 0.5-1 day per shader.
• Optimizing VFX for the target platform: GPU instancing, particle LOD, culling.

Deliverables include shader and VFX graph source files, setup documentation, team training (1 hour consultation), and support for one month after delivery. We’ll evaluate your project in one business day—contact us. Get a consultation for your project—we’ll find the optimal solution and provide timelines.

What is our experience and guarantees?

Over 5 years in game development, 50+ projects (mobile, PC, consoles). We guarantee that the shader will work on the target platform at the stated FPS—if not, we rework it for free. Example: for one indie studio, we rewrote all shaders for URP—FPS on iPhone 8 increased from 25 to 60, and the render time budget decreased by 40%. We use the latest stable versions of Unity (LTS) and Unreal Engine 5, working with Vulkan, Metal, DirectX 12.

Comparison: a ready-made asset from the Asset Store often requires rework (compatibility, performance)—custom shader development is 2-3 times faster in terms of time than adapting someone else’s code. And a shader written from scratch for your tasks gives you 100% control over performance and visuals. Budget savings on one project can reach 30% due to the absence of unnecessary code.

What are the work stages?

1. Analysis: examine the scene, target platforms, FPS requirements. Capture visual references.
2. Prototyping: create shader/VFX graph, test on reference device.
3. Integration: embed into the project, adjust parameters, optimize draw calls and batching.
4. QA: test on all target platforms (Android, iOS, PC, consoles), fix artifacts.
5. Deployment and handover: deliver source files, documentation, conduct training. Support for 1 month.

Timeline: 2 to 10 business days depending on complexity. Cost is calculated individually—write to us, we’ll evaluate your project. Order shader development—get a ready result with performance guarantee.