Announcement

Collapse
No announcement yet.

Radial Blur PostProcess Material

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Radial Blur PostProcess Material

    I thought I'd share my Radial Blur Post Process Material.

    This simplest Version of it:
    Radial Blur with fixed number of equally weighted samples

    This is the setup of the Material in der Material Editor. The Node named "Radial Blur" is actually just a Custom Node with HLSL code.
    Click image for larger version

Name:	RadialBlur01.jpg
Views:	1
Size:	141.6 KB
ID:	1143512

    The HLSL Code for this Node is:
    Code:
    float2 ScreenMult = View.ViewSizeAndSceneTexelSize.xy / View.RenderTargetSize;
    int TexIndex = 14;
    float samples[10] = {-0.08,-0.05,-0.03,-0.02,-0.01,0.01,0.02,0.03,0.05,0.08};
    float2 dir = ScreenMult * float2(0.5,0.5) - UV; 
    float4 sum = SceneTextureLookup(UV, TexIndex, false);
    float2 pos = float2(0.0,0.0);
    for(int i = 0; i<10; i++)
    {
        pos = UV + dir * samples[i] * sampleDist;
        max(min(pos, ScreenMult * float2(1.0, 1.0)), float2(0.0,0.0));
        sum += SceneTextureLookup(pos, TexIndex, false);
    }
    sum *= 1.0/11.0;
    return sum;
    A couple of explanations:
    ScreenMult is a factor that is needed to convert the 0-1 range UVs that go into the UV Input to the range that is needed to Align the effect properly on the screen.
    TexIndex is the index that corresponds PostProcessInput0 in SceneTextureLookup().
    After that the lookup-distances are defined in the samples array and the direction of the lookup (line from the current UV coordinate and the center). The loop then iterates though all of the samples. Basically it just calculates the average of the looked up values and the original value.

    The Scene Texture Node in the Material is needed to have access to the SceneTextureLookup function. The "Tex" Input of my CustomNode is actually not needed, but I kept it to remind myself that I need to create a SceneTexture Node in order to make it work.

    This is the result of this effect:
    Click image for larger version

Name:	RadialBlurScreen.jpg
Views:	1
Size:	547.3 KB
ID:	1143513

    I also have a version of this effect where I have weighted the samples and added the functionality to have a dynamic amount of them and a dynamic center coodinate. But since it's just a matter of adding more parameters to this code and some simple changes, I don't think it's necessary to post it here. It's also very unoptimzed because of the limitations I experienced with the current Custom Node's functionality.
    I'm also not very proficient in HLSL coding, so there might be a lot of points to improve on this effect.
    Last edited by Tomura; 01-29-2015, 02:40 PM.

  • #2
    Thats pretty cool, thanks for sharing .

    Comment


    • #3
      Thanks. Still wrapping my head around post process stuff so seeing examples is always useful.
      Twitter: @zerofiftyone_
      Website: zerofiftyone.net - My game development blog
      Button Frenzy store page: http://store.steampowered.com/app/454630

      Comment


      • #4
        Click image for larger version

Name:	56.PNG
Views:	1
Size:	221.8 KB
ID:	1065845

        Thanks for the tutorial.
        I have one question.
        In the screenshot, an error occurred.
        What's the problem?

        Comment


        • #5
          Originally posted by simpple View Post

          Thanks for the tutorial.
          I have one question.
          In the screenshot, an error occurred.
          What's the problem?
          The Color output of the Scene Texture node has 4 components (RGBA) your Custom Node is setup to return float3 (RGB). Change the return type of your Custom Node to float4 and everything should be fixed.

          Comment


          • #6
            Click image for larger version

Name:	58.PNG
Views:	1
Size:	184.5 KB
ID:	1065866

            Thanks for your answer.
            I tried to change the value to float4 are still errors.
              Can l apply to post-process does not work.

            Comment


            • #7
              Originally posted by simpple View Post
              Thanks for your answer.
              I tried to change the value to float4 are still errors.
                Can l apply to post-process does not work.
              Hmmm which engine version are you using. It could be that the definition of SceneTextureLookup changed.

              If you go to Window -> HLSL Code in the menu. You can see the Materials HLSL code. In there you can find the definition of the SceneTextureLookup function. (Copy the contents of that window to a text editor to make searching easier.)
              This should give in my Engine Version (4.6.1) it's defined as
              Code:
              float4 SceneTextureLookup(float2 UV, int SceneTextureIndex, bool bFiltered)
              { ....  }
              That may have changed. I suspect that the last bool Parameter is not there in your Version.
              Change the SceneTextureLookup-function calls accordingly and it should work.

              If you need a reference. There is a GetMaterialEmissiveRaw(FMaterialPixelPArameters Parameters) function in you Materials HLSL code that should also call the SceneTextureLookup function.

              I kind of feared that there would be differences in previous and futures engine versions that would break this (just like most C++ code needs changes with every update). But it seems like something you can fix.
              Last edited by Tomura; 02-01-2015, 11:11 AM.

              Comment


              • #8
                This is really nice. I've been looking at making this effect for a speed boost in my game - Very nice

                Comment


                • #9
                  Good stuff! Thanks for sharing
                  Game Developer @ LODZERO - My Twitter | tomlooman.com UE4 samples & tutorials | C++ Survival Game (Open-source template)

                  Comment


                  • #10
                    Thank you for answers.
                    Unfortunately, my version is 4.5.

                    The 4.6 version is probably going to be normal.

                    Comment


                    • #11
                      Nice tip !!!

                      is there a way to "adapt" this hlsl shader to a transparant material in order to make a frosted glass -ish ?

                      Comment


                      • #12
                        Originally posted by Meian View Post
                        Nice tip !!!

                        is there a way to "adapt" this hlsl shader to a transparant material in order to make a frosted glass -ish ?
                        Should be possible to some extend. What exactly do you have in mind?

                        Comment


                        • #13
                          Recreate a blurred transparent surface like this


                          This kind of material/shader is really needed/used in archviz projects
                          Do you think this is doable ?

                          Comment


                          • #14
                            Click image for larger version

Name:	frostedglass.png
Views:	1
Size:	674.7 KB
ID:	1065942

                            This is what I have come up with (didn't take a lot of time). Very inefficient and also not lit, since I have to use the emissive color of the Material.
                            I'll probably post it later or a better version if I find a solution to make it properly react to lighting.

                            Comment


                            • #15
                              Wow, that's almost what it should be !
                              it's great and very promising !
                              nice work

                              Comment

                              Working...
                              X