examples: post-processing material AO

[Rabbid76]

The incident light of a fragment is composed of ambient light, direct light and indirect light. Ambient Occlusion only occludes ambient light and environment light, but not direct light. Direct light is only occluded by geometry that casts shadows. And of course the emitted light should not be darkened by ambient occlusion either. This cannot be achieved if the AO post processing pass is simply blended with the diffuse render pass.

The aim of this mesh material is to use information from a post-processing pass in the diffuse color pass. This example material is based on MeshPhysicalMaterial.
In the example, the output of an AO pass is used to create AO with the same logic and the same effect on the material as from the aoMap. Actually, the output of any screen space AO (SSAO, GTAO) can be used, as it is only necessary to provide the AO in a color channel of a texture, however, the AO pass must be rendered prior to the color pass, which makes the post-processing pass somewhat of a pre-processing pass. This can still be achieved with the the standard EffectComposer features.
For this purpose a new map (aoPassMap) is added to the material. The map is used the same way as the aoMap.

[Mugen87]

For testing: https://rawcdn.githack.com/Rabbid76/three.js/examples/postprocessing-material-ao/examples/webgl_postprocessing_material_ao.html

[Mugen87]

Interesting PR!

About the GUI options: When configuring the output, why can you only select the diffuse pass for one side? I have the feeling it would be more clear to show the normal beauty pass for both sides.

Besides, selecting it disables AO on the left side, not right. Is the label wrong or do I miss something?

[Rabbid76]

why can you only select the diffuse pass for one side?

because I would have to change the materials on the right side. Actually all that needs to be done is to deactivate the map. I will change that.

[Rabbid76]

Besides, selecting it disables AO on the left side, not right.

You're absolutely right.

[Mugen87]

I wonder if we can simplify the example a bit....

Would it be possible and have just one scene using MeshPostProcessingMaterial and then use a checkbox to toggle between normal and "improved" AO? The renderer caches shader permutations so there should not be much overhead if you switch between composers and reconfigure the materials (adding/removing aoPassMap).

In this way, the slider can be removed as well.

[Rabbid76]

I wonder if we can simplify the example a bit....

@Mugen87 done

[Mugen87]

In any event, it's interesting how much better the material version looks compared with the standard AO approach.

[Rabbid76]

Actually, I never really liked screen space AO, because it always changes the whole scene and you always have to implement some hacks for emissive or transparent materials or find a compromise with the intensity. However, this offers new options.

[Mugen87]

The way the demo conceptually connects FX outputs to material inputs should ideally match to a node based approach. Just saying because we recently started to support the first FX features with the new node material and WebGPURenderer. Can't wait to see GTAONode 😁 .

[gkjohnson]

A couple thoughts on this - the post processing effects have long been incorrect in the ways pointed out, but I'd really like to see some progress towards a deferred rendering system to help address these issues (or at least a proof of concept one). I feel the approach in this pr seems like much more of a workaround to that / demo than a practical solution for projects.

Generally a deferred renderer should use less memory, require fewer draws, and have less overdraw then what's being done now in this PR and other postprocessing effects. Effects like ambient occlusion, screen space reflections, contact shadows, and other effects all need to account for unique material properties.

I'm hoping node materials can help provide a more elegant solution to a deferred rendering compared to what's been available in the past but some validation would be nice to see.

Cc @RenaudRohlinger since you've been working on some of these post effect nodes.

[RenaudRohlinger]

@gkjohnson I believe the nodes I've been working on only works in with WebGPURenderer. Not sure what's the roadmap in regards to nodes and the WebGLRenderer but indeed a GTAONode sounds like a dream.

On that note to be honest after playing a bit with the new renderer I don't think I will be able to ever go back to the old renderer, it's just so good.
I've been doing things in 70 LOC of TSL that would have required 500+ LOC of custom shaders, with a bunch of FBOs, datatexture and texelFetch before. On top of that this month WebGPU support will basically go up to 50/60% support with Android... You should join the WebGPURenderer side Garrett 😏