Hello,
I have a scene that has plane objects behind some imported Objects. Now my goal would be to have the objects in the front blurred and only the planes visible, but when hovering the objects (i.e. when a ray from camera intersects at mouse position) the entire scene becomes blurred and only the hovered object becomes sharp. The effect is visualized in some mock ups I attatched as images below.
Basically achieving something like this using the blur shaders provided by three (horizontal & vertical blur) instead of bloom would already be great:
https://threejs.org/examples/webgl_postprocessing_unreal_bloom_selective.html
Another idea would be to use actual depth of field like in this example and just shift the focus point: three.js webgl - postprocessing - depth-of-field
Here I wouldn’t be sure how to achieve that the all the planes are in focus simultaneously at first tho.
Another trick I could use would be a plane or other object in front of the planes but I wouldn’t know how to blur the objects in the front and not the planes.
Generally I’d be interested in applying a post processing effect only to a subset of objects in a scene so let me know if you have any tricks or examples that do that and of you think my desired effect is achievable using post processing in three.