Transparency with a capture component

The actor portrait plugin uses a USceneCaptureComponent2D in the backend to capture the portrait scene. Anyone who has attempted to capture an image with transparency using this component will know that it has some issues, mainly that it is not possible to easily use post processing in conjunction with transparency.

When developing this plugin I wanted to supply an example where a transparent background was used. Due to lack of time the example provided used a novice approach of simply not using post processing, however I wasn’t happy with this solution and decided to do some research as how to draw the portrait actor using both transparent backgrounds and post processing.

The method discussed on this page allows you to display an actor using the Actor Portrait with a transparent background, however with the limitation that the actor has to be opaque. Any translucent materials would be masked out with the background.

Modifying the Default Render Material (Version 1.0.1)

IMPORTANT: If you have a version newer than 1.0.1 you can skip this step and instead move on to Alpha Masking Post Pocesses Material

In order to use this improved approach for drawing the portrait with a transparent background you will first need to replace, or modify, the default portrait Render Material. To modify the default material:

1. On your Actor Portrait (in the UMG Designer) go to Appearace/Advanced/Render Material.

2. Open the M_PortraitRenderMat material and perform the following modifications:

a. In the details panel, change blend mode from Opaque to Translucent.

b. Connect the Alpha output of the RenderTexture node to the Opacity input of the material output node.

You can now apply and save the material and then exit out of the material editor.

Alpha Masking Post Pocesses Material

First, create a post processing material anywhere in your project (I named mine PP_PortraitAlphaMask but you can call it whatever you like) by creating a new Material Asset and setting its Material Domain to Post Process.

Then enable Alpha Output under the Post Process Material category.

Once you have a post process material, you should be able to create the following node setup:

That should be it for your Post Process Material, apply and save your material and exit out of the material editor.

Setting up the Actor Portrait

Now we just need to apply our custom Post Process Material on our Actor Portrait scene. This can be done by navigating to Portrait/Rendering/Post Processing Settings/Rendering Features/Post Process Materials on our Actor Portrait UI element and adding our newly created material.

You should now see something in the line of this:

If you, like me, observe an ugly grey-ish border around your character then you can use the following trick to get rid of it.

First, update your sky-light to use a specified cube-map instead of having it be captured from the sky-light.

Then apply the cube-map of your choice as such:

(If you are unable to see any cubemaps in the drop-down, don’t forget to check “Show Engine Content” in the View Options)

You should now be able to control the color of the background independently from the lighting by changing Portrait/Environment/Environment Color

I have found that a color of about (R: 0.073, G: 0.073, B: 0.073) seems to work pretty well. The final result then looks as follows:

Final Thoughts

It is a shame that there is no good way of rendering an actor with translucent materials and have them blend well with the background. It seems that for the time being you will either have to choose between no post processing, or no translucent materials.

I have begun experimenting with directly accessing the Unreal Engine renderer instead of using a USceneCaptureComponent2D as a way of maybe getting the best of both worlds, however thus far it has proved to be very difficult to get something with both adequate performance and visual fidelity.

If you have any ideas on how to draw translucent materials on a transparent background using a Scene Capture Component and a render target feel free to contact me at mans.martin.isaksson@gmail.com