{"id":291,"date":"2021-03-27T14:58:27","date_gmt":"2021-03-27T14:58:27","guid":{"rendered":"https:\/\/bronsonzgeb.com\/?p=291"},"modified":"2021-03-27T14:58:29","modified_gmt":"2021-03-27T14:58:29","slug":"optimized-metaballs-blur-pass-with-scriptable-renderer-features","status":"publish","type":"post","link":"https:\/\/bronsonzgeb.com\/index.php\/2021\/03\/27\/optimized-metaballs-blur-pass-with-scriptable-renderer-features\/","title":{"rendered":"Optimized Metaballs: Blur Pass with Scriptable Renderer Features"},"content":{"rendered":"\n

This article completes my approach to drawing pseudo-Metaballs in an optimized way using Unity, the Universal Render Pipeline (URP) and Scriptable Renderer Features. In the previous article, we covered the basics of Scriptable Renderer Features by drawing meshes to a custom render target. In this article, I cover the blur pass, our “step and clip” shader and finally drawing our RenderTexture<\/code> back to the screen.<\/p>\n\n\n\n

If you need a refresher, you can read the previous article\u00a0here<\/a>. The approach is to draw some objects to a custom render texture, blur them, apply a Smoothstep<\/code> function and draw them back to the screen. Then, we call the result a pseudo-Metaball and pat ourselves on the back for doing a great job. If you’re looking for “real” Metaballs, check out\u00a0this other series<\/a>\u00a0I wrote.<\/p>\n\n\n\n

Structure of a Blur Pass<\/h2>\n\n\n\n

Before we start, I’m going to explain the basic structure of a blur. Blurring is a topic in and of itself. However, it’s often performed by examining an image’s pixels and averaging the colour with those around it. The more repetitions you complete, the blurrier the image becomes. This operation sounds straightforward, but there are several ways you can do this, each with its name and resulting look. In our case, we use a Kawase Blur. Why this type of blur? First, it’s relatively cheap to perform. Second, there was an example of a Kawase Blur in the URP examples Github repository, so it’s less work. I’ve linked an article about the Kawase Blur later in this post if you’re interested in learning more.<\/p>\n\n\n\n

So let’s get started!<\/p>\n\n\n\n

Kawase Blur Renderer Feature<\/h2>\n\n\n\n

As I mentioned, there’s an example Kawase Blur available in the URP Rendering examples repository. We’ll use this as our starting point. The plan is to keep the blur as a separate ScriptableRenderPass<\/code> and enqueue it after our RenderObjectsPass<\/code>. Then we’ll modify the blur pass to read from the RenderTexture<\/code> created in the RenderObjectsPass<\/code> and finally output the result to the screen with a custom material.<\/p>\n\n\n\n

So our blur needs to know:<\/p>\n\n\n\n