Support for Bloom in AR Canvas?

[naseemshah]

Hello Everyone!

I am trying out XR for first time, with little experience in react-three-fiber ecosystem. I have made a simple scene with a glowing orange sphere. The scene renders fine in normal Canvas, as expected. (as show below)

Live Demo | CodeSandbox

When entering the AR Session, no bloom effect is rendered.

I suspect this is issue with Alpha blending or something? Thanks in Advance.

[mwmwmw]

I don't think it's as simple as adding an alpha channel. Bloom is a post-rendering effect layer that takes the entire frame as input.

To add bloom to the AR composited image I can think of a few different ways.

1. Add bloom to the AR composited image. This would have the negative side effect of adding bloom to everything. Including the video. You would need to process the incoming video stream and lower the brightness to counteract the bloom.

2. Create a bloom pass and mask, then multiply those two back onto the video. This would be done the same way you would create a selective bloom in Three.js.

The problem with both of these is that mobile GPUs might not be up to the task.

3. Fake it somehow. If you know what you're going to be rendering, create 'pre bloomed' versions that you use instead.

[naseemshah]

@mwmwmw That makes sense :) thanks for the response.