WebXR Postprocessing

[Beilinson]

          Thanks @elalish

I did checks on https://modelviewer.dev/examples/postprocessing/ Is it possible to have the bloom effect working on AR viewer as well like it’s the case now for 3D viewer please?

Thank you

Best

Originally posted by @zelghrabi-edu in https://github.com/google/model-viewer/issues/3948#issuecomment-1523004064

[Beilinson]

1. For the native WebXRRenderer for three.js, it requires some tinkering with the renderers that isn't fully supported yet by pmndrs/postprocesssing, which maybe shouldn't enter model-viewer as it is meant to be a fully stable API.
2. On most mobile devices <model-viewer> actually defaults to the native AR viewer, meaning <model-viewer-effects> actually has no control over the rendering. On IOS for example, this is because WebXR is mostly unsupported.

More on WebXR iOS support:

It is currently in an "experimental state", which is accessible through: Settings -> Safari -> Advanced -> Experimental Features and all the way at the bottom:

It is disabled by default, and I am not sure how well it will work in the case of model-viewer, though it might be interesting to test.

Additionally, apple has the RealityKit API for AR experiences on IOS, which does allow for custom postprocessing, however this is only for c/swift IOS apps, while browsers are limited to quick look which is not customizable.

[elalish]

Indeed, this would be an Android-only feature for now, since iOS doesn't yet support WebXR. We don't actually use three's WebXRRenderer currently, so hopefully it's a bit simpler.

[zelghrabi-edu]

Hello, Thanks guys for your answers It doesn't work for Android as well

[elalish]

That's actually SceneViewer on Android, which also can't support this, since like QuickLook, it's a separate app. Only WebXR mode can be made to work (though I don't think it does yet).

[mahdavifar2002]

@elalish Hello. I'm looking for applying some custom postprocessing effects on AR mode (webxr). Could you please give me a hint on how I may achieve this goal?

[elalish]

It's hasn't quite been implemented yet, but I don't think it should be too hard. Basically we need a similar update to the render loop in ARRenderer.ts as we now have in Renderer.ts. @Beilinson would be good to ask for review, and I'll certainly help with any PR as well.