Skip to main content

Depth Blur

The Depth Blur template helps you produce a blur effect that adjusts based on the distance of objects to the camera, just like an optical camera!

demo

Open the Template

To use this template in your Effect House project:

  1. Go to Templates
  2. Click the Body tab
  3. Select the Depth Blur template
open template

Hierarchy

The Hierarchy panel consists of the following three render groups:

  • Tip holds the hints you can refer to to customize the effect
  • Post Effects renders the blur effect on a renderTex Blur_RenderTex
  • 2D Foreground Effects contains the final image that renders the blur effect based on depth. The depth blur image is generated by the material called DepthBlur_Mat.
hierarchy  preview panel

Assets

The Assets panel contains the DepthBlur_Mat [EDIT] material, which is made up of several blur properties. This material is assigned to the Depth Blur image mentioned above.

assets

Customize the Depth Blur

You can customize the depth blur by adjusting some of its properties:

  1. Go to the Assets panel
  2. Click DepthBlur_Mat [EDIT]
  3. Go to the Inspector panel
  4. Adjust the distance, range, and softness of your blur:
    • Focus Distance adjusts the focus distance based on the depth texture
    • Focus Range adjusts the focus range based on the distance from the center. Within this range, the input texture is displayed, while outside of it, the blur texture is applied.
    • Edge Softness adjusts the edge softness between clear and blurry
inspector panel

Understand the Depth Blur Material

The DepthBlur_Mat [EDIT] material is made up of three textures to render the depth blur effect that you see:

  • Input Tex is the texture of the focus area
  • Blur Tex is the texture outside the focus area
  • Depth Tex is the depth texture that shows the camera feeds depth
inspector panel

In the DepthBlur_Mat material, a setup called Lerp is used between two textures: Input Tex and Blur Tex. This setup depends on how close or far objects are from the camera, which is measured with the Depth Tex. This means that the part of the image that's in focus will show Input Tex, while the parts that are out of focus will show Blur Tex.

material overview

For depth texture, the darker area means closest to the camera, and brighter areas mean furthest. The smaller number presents the darker part and a bigger number presents the brighter part.

depth texture

If you set the focus distance to 0 and the focus range to 20, the closest part will be clear while everything beyond that will be blurred.

focus set to 0

If you set the focus distance to 50 (0.5), and the focus range to 20, the middle grey area of the depth texture will be clear, while everything outside that range will be blurred.

focus set to 50

Visual Scripting

To make the blur effect appear clearly, visual scripting is used to gradually change the focus distance by time. This means you will notice the blur and focus parts of the image changing together as the focus distance shifts.

visual scripting