2

I am currently playing around with a react-three-fiber project and I'm looking to create a glow effect around individual meshes in a scene (that are imported from Blender), similar to what is done here: https://100gecs.com/

I have tried experimenting with Bloom Postprocessing but I have found that

a) It slows down performance significantly b) It applies to all meshes and I cannot target just one

Does anyone have advice for other techniques for this effect? Or if Bloom is the only way to go about it, are there methods for targeting a single mesh for the effect?

I'm very new to ThreeJS so i'm unsure where else to look for help on this specific issue! Let me know if I can clarify anything further

Bejal
  • 81
  • 6

1 Answers1

3

a) It slows down performance significantly

Well, the unreal bloom pass is not a cheap post processing pass since it requires multiple renderings to produce a single frame.

b) It applies to all meshes and I cannot target just one

There is an official three.js example that shows how you can selectively apply bloom to objects in your scene.

https://threejs.org/examples/#webgl_postprocessing_unreal_bloom_selective

There are also other techniques to produce a fake bloom/glow effect which do not require the above bloom pass. You should find information about this topic right here:

three.js outer glow for sphere object?

Mugen87
  • 17,773
  • 4
  • 13
  • 31