Tutorial - OpenGL Bloom Effect

Just because it’s not been easy (for a total c++ beginner like me) to find precise documentation about the -popular- bloom effect, I thought that maybe it could be useful to others :
http://prideout.net/bloom/index.php (include sources files)

kikko.

Tank you, I’ll check it tonight and tell you if for an other OF newbie worked fine!!

Thank you for your information, this information very helpful to me.

This also contains instructions for very efficiently calculating gaussian blur on the GPU. Thanks Kikko :slight_smile:

i’ve implemented most of the tutorial in 007:

https://github.com/kylemcdonald/Eyeshine/tree/master/BoxFilter
https://github.com/kylemcdonald/Eyeshine/tree/master/GaussianFilter
https://github.com/kylemcdonald/Eyeshine/tree/master/SeparableFilter
https://github.com/kylemcdonald/Eyeshine/tree/master/HardwareFilter

i’ll be making a simple wrapper for the blurring part. here’s where it is at the moment:

https://github.com/kylemcdonald/Eyeshine/tree/master/ofxBlur

the shaders in that last project have some minor optimizations on top of philip’s original code.

Hi, I just tried ofxBlur, it really does the blur, but unfortunately I don’t really see the bloom effect, the image/drawings is blurred, but not more bright than before, what is the reason?

ofxBlur is just me working towards an ultra fast blur addon. it has nothing to do with bloom. sorry!

that ofxBlur project has been updated, and now contains what i’m pretty sure is the fastest blur available for OF right now.

https://github.com/kylemcdonald/Eyeshine/tree/master/ofxBlur

i’ve also attached it to this post.

instead of using shaders in the data/ folder, it automatically generates the shaders with code depending on the parameters it’s initialized with. if you enable OF_LOG_VERBOSE, it will print the shader to the console.

for example, here’s a generated blur shader that runs a circular gaussian kernel with radius 32:

  
  
uniform sampler2DRect source;  
uniform vec2 direction;  
void main(void) {  
	vec2 tc = gl_TexCoord[0].st;  
	gl_FragColor = 0.0285367 * texture2DRect(source, tc);  
	gl_FragColor += 0.0567264 *   
		(texture2DRect(source, tc - (direction * 1.49817)) +   
		texture2DRect(source, tc + (direction * 1.49817)));  
	gl_FragColor += 0.0553599 *   
		(texture2DRect(source, tc - (direction * 3.49573)) +   
		texture2DRect(source, tc + (direction * 3.49573)));  
	gl_FragColor += 0.0529827 *   
		(texture2DRect(source, tc - (direction * 5.49329)) +   
		texture2DRect(source, tc + (direction * 5.49329)));  
	gl_FragColor += 0.0497279 *   
		(texture2DRect(source, tc - (direction * 7.49085)) +   
		texture2DRect(source, tc + (direction * 7.49085)));  
	gl_FragColor += 0.0457714 *   
		(texture2DRect(source, tc - (direction * 9.48841)) +   
		texture2DRect(source, tc + (direction * 9.48841)));  
	gl_FragColor += 0.0413158 *   
		(texture2DRect(source, tc - (direction * 11.486)) +   
		texture2DRect(source, tc + (direction * 11.486)));  
	gl_FragColor += 0.0365735 *   
		(texture2DRect(source, tc - (direction * 13.4835)) +   
		texture2DRect(source, tc + (direction * 13.4835)));  
	gl_FragColor += 0.0317501 *   
		(texture2DRect(source, tc - (direction * 15.4811)) +   
		texture2DRect(source, tc + (direction * 15.4811)));  
	gl_FragColor += 0.0270303 *   
		(texture2DRect(source, tc - (direction * 17.4787)) +   
		texture2DRect(source, tc + (direction * 17.4787)));  
	gl_FragColor += 0.0225676 *   
		(texture2DRect(source, tc - (direction * 19.4762)) +   
		texture2DRect(source, tc + (direction * 19.4762)));  
	gl_FragColor += 0.0184777 *   
		(texture2DRect(source, tc - (direction * 21.4738)) +   
		texture2DRect(source, tc + (direction * 21.4738)));  
	gl_FragColor += 0.0148367 *   
		(texture2DRect(source, tc - (direction * 23.4713)) +   
		texture2DRect(source, tc + (direction * 23.4713)));  
	gl_FragColor += 0.0116831 *   
		(texture2DRect(source, tc - (direction * 25.4689)) +   
		texture2DRect(source, tc + (direction * 25.4689)));  
	gl_FragColor += 0.00902199 *   
		(texture2DRect(source, tc - (direction * 27.4665)) +   
		texture2DRect(source, tc + (direction * 27.4665)));  
	gl_FragColor += 0.00683246 *   
		(texture2DRect(source, tc - (direction * 29.4641)) +   
		texture2DRect(source, tc + (direction * 29.4641)));  
	gl_FragColor += 0.00507434 *   
		(texture2DRect(source, tc - (direction * 31.4616)) +   
		texture2DRect(source, tc + (direction * 31.4616)));  
}  
  

you can set the addon to do fewer lookups and use multiple passes (ping pong) with optional downsampling, but in my opinion the results look best for the speed with a single blur pass.

ofxBlur.zip

Hi kikko!

this is great,
i have also been making a bloom effect with of 007 and shaders, so this is a great contri.
thanks to kylemcdonald also for his fast blurr…
i will check this and tell you about…
best,

miguel.
www.tangiblex.net

@kyle,
what’s your eyeshine project about? or what it does?
I just downloaded it and fiddled with it a bit. I see that it uses the canon SDK, so I guess that canon DSLR is needed.

Best regards!

@roymacdonald eyeshine is a project with golan, it uses libdc with a point grey grasshopper. http://vimeo.com/29356492