<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Game Rendering &#187; Image Enhancements</title>
	<atom:link href="http://www.gamerendering.com/category/image-enhancements/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.gamerendering.com</link>
	<description></description>
	<lastBuildDate>Thu, 21 Jan 2010 01:32:12 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.5</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Screen Space Ambient Occlusion</title>
		<link>http://www.gamerendering.com/2008/11/04/screen-spaced-ambient-occlusion/</link>
		<comments>http://www.gamerendering.com/2008/11/04/screen-spaced-ambient-occlusion/#comments</comments>
		<pubDate>Tue, 04 Nov 2008 21:24:47 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Image Enhancements]]></category>
		<category><![CDATA[SSAO]]></category>
		<category><![CDATA[AO]]></category>
		<category><![CDATA[Blur]]></category>
		<category><![CDATA[Gaussian Blur]]></category>
		<category><![CDATA[Screen Space]]></category>
		<category><![CDATA[Screen Spaced Ambient Occlusion]]></category>

		<guid isPermaLink="false">http://www.gamerendering.com/?p=460</guid>
		<description><![CDATA[SSAO is the new technique that most new games just must include because of the hype around it since the computer game Crysis. It&#8217;s a technique for creating a rude approximation of ambient occlusion by using the a depth of the rendered scene. This works by comparing the current fragments depth with some random sample depths around it [...]]]></description>
			<content:encoded><![CDATA[<div class="mceTemp">SSAO is the new technique that most new games just must include because of the hype around it since the computer game Crysis. It&#8217;s a technique for creating a rude approximation of ambient occlusion by using the a depth of the rendered scene. This works by comparing the current fragments depth with some random sample depths around it to see if the current depth is occluded or not. The current fragment is occluded if the sample is closer to the eye than the current fragment. Although it sounds very bad to do so, in practice it does work beyond all expectations.</div>
<p>How to take the samples is a big concern as it will impact what will occlude and how much. The currently best implementations takes random samples in a hemisphere in the direction of the normal. This limits the amount of self occlusion. Another problem is that if you only take the depth into consideration then a flat surface might occlude itself because of the perspective. By also comparing the normal when calculating the AO, this problem will go away.</p>
<p>One of the hard parts of implementing SSAO is to choose the correct smoothing technique. Because of the big cost of taking occlusion samples you want to take as few samples as possible but this will give much noise in the SSAO so the result needs smoothing. Just doing a simple gaussian blur will not be good as the blur will make the SSAO bleed. Instead a blur that considers the depth and/or normals is needed. One of those is the bilateral filter which often is used in combination with SSAO.</p>
<p>The steps of a simple SSAO implementation:</p>
<ol>
<li>Render the scene. Save the linear depth in a texture. Save the normals in eye space in a texture.</li>
<li>Render a full screen quad with the SSAO shader. Save the result to a texture.</li>
<li>Blur the result in X</li>
<li>Blur the result in Y</li>
<li>Blend the blurred SSAO texture with the scene, or use it directly when rendering the scene.</li>
</ol>
<p>An optimization is to render the SSAO in a lower resolution than the screen and upsample it when blurring. Another optimization is to store both the normals and the depth in a single texture.</p>
<div id="attachment_465" class="wp-caption alignnone" style="width: 410px"><a href="http://www.gamerendering.com/wp-content/uploads/nvidia.jpg"><img class="size-medium wp-image-465" title="SSAO in the NVIDIA SDK " src="http://www.gamerendering.com/wp-content/uploads/nvidia-400x398.jpg" alt="SSAO in the NVIDIA SDK " width="400" height="398" /></a><p class="wp-caption-text">SSAO in the NVIDIA SDK </p></div>
<p>Probably one of the best implementations of SSAO is this one by NVIDIA (although it&#8217; rather slow). The SDK 10 has a paper about the technique and also source code!<br />
<a href="http://developer.download.nvidia.com/SDK/10.5/direct3d/samples.html">http://developer.download.nvidia.com/SDK/10.5/direct3d/samples.html</a></p>
<p>And here&#8217;s three papers/presentations from NVIDIA describing their SSAO in detail:<br />
<a href="http://developer.download.nvidia.com/presentations/2008/GDC/GDC08_Ambient_Occlusion.pdf">http://developer.download.nvidia.com/presentations/2008/GDC/GDC08_Ambient_Occlusion.pdf</a><br />
<a href="http://developer.download.nvidia.com/presentations/2008/SIGGRAPH/HBAO_SIG08b.pdf">http://developer.download.nvidia.com/presentations/2008/SIGGRAPH/HBAO_SIG08b.pdf</a><br />
<a href="http://developer.download.nvidia.com/SDK/10.5/direct3d/Source/ScreenSpaceAO/doc/ScreenSpaceAO.pdf">http://developer.download.nvidia.com/SDK/10.5/direct3d/Source/ScreenSpaceAO/doc/ScreenSpace AO.pdf</a></p>
<div id="attachment_475" class="wp-caption alignnone" style="width: 394px"><a href="http://www.gamerendering.com/wp-content/uploads/starcraft2a.jpg"><img class="size-medium wp-image-475" title="SSAO in Starcraft II" src="http://www.gamerendering.com/wp-content/uploads/starcraft2a.jpg" alt="SSAO in Starcraft II" width="384" height="287" /></a><p class="wp-caption-text">SSAO in Starcraft II</p></div>
<p>Some information of how Starcraft II will use SSAO is included in this paper ( see chapter 5.5 ):<br />
<a href="http://ati.amd.com/developer/SIGGRAPH08/Chapter05-Filion-StarCraftII.pdf">http://ati.amd.com/developer/SIGGRAPH08/Chapter05-Filion-StarCraftII.pdf</a></p>
<div id="attachment_462" class="wp-caption alignnone" style="width: 410px"><a href="http://www.gamerendering.com/wp-content/uploads/twoworlds.jpg"><img class="size-medium wp-image-462" title="SSAO in Two Worlds" src="http://www.gamerendering.com/wp-content/uploads/twoworlds-400x250.jpg" alt="SSAO in Two Worlds" width="400" height="250" /></a><p class="wp-caption-text">SSAO in Two Worlds</p></div>
<p>A link to a description of the SSAO implementation in the game Two Worlds:<br />
<a href="http://www.drobot.org/pub/GCDC_SSAO_RP_29_08.pdf">http://www.drobot.org/pub/GCDC_SSAO_RP_29_08.pdf</a></p>
<div id="attachment_464" class="wp-caption alignnone" style="width: 276px"><a href="http://www.gamerendering.com/wp-content/uploads/crysis.jpg"><img class="size-medium wp-image-464" title="SSAO in Crysis" src="http://www.gamerendering.com/wp-content/uploads/crysis.jpg" alt="SSAO in Crysis" width="266" height="166" /></a><p class="wp-caption-text">SSAO in Crysis</p></div>
<p>The paper and game that started it all (look in the chapter 8.5.4.3):<br />
<a href="http://delivery.acm.org/10.1145/1290000/1281671/p97-mittring.pdf?key1=1281671&amp;key2=9942678811&amp;coll=ACM&amp;dl=ACM&amp;CFID=15151515&amp;CFTOKEN=6184618">http://delivery.acm.org/10.1145/1290000/1281671/p97-mittring.pdf?key1=1281671&amp;key2=9942678811&amp;coll=ACM&amp;dl=ACM&amp;CFID=15151515&amp;CFTOKEN=6184618</a></p>
<div id="attachment_461" class="wp-caption alignnone" style="width: 410px"><a href="http://www.gamerendering.com/wp-content/uploads/start.jpg"><img class="size-medium wp-image-461" title="Hardware Accelerated Ambient Occlusion" src="http://www.gamerendering.com/wp-content/uploads/start-400x341.jpg" alt="Hardware Accelerated Ambient Occlusion" width="400" height="341" /></a><a href="http://www.gamerendering.com/wp-content/uploads/start.jpg"></a><p class="wp-caption-text">Hardware Accelerated Ambient Occlusion</p></div>
<p>One of the papers that probably inspired the Crysis team:<br />
<a href="http://perumaal.googlepages.com/">http://perumaal.googlepages.com/</a></p>
<p><a href="http://delivery.acm.org/10.1145/1290000/1281671/p97-mittring.pdf?key1=1281671&amp;key2=9942678811&amp;coll=ACM&amp;dl=ACM&amp;CFID=15151515&amp;CFTOKEN=6184618"></a></p>
<div id="attachment_466" class="wp-caption alignnone" style="width: 410px"><a href="http://www.gamerendering.com/wp-content/uploads/kindernoiser.jpg"><img class="size-medium wp-image-466" title="Kindernoiser SSAO" src="http://www.gamerendering.com/wp-content/uploads/kindernoiser-400x247.jpg" alt="Kindernoiser SSAO" width="400" height="247" /></a><p class="wp-caption-text">Kindernoiser SSAO</p></div>
<p>A simple but smart SSAO implementation, here with well commented shader source code:<br />
<a href="http://rgba.scenesp.org/iq/computer/articles/ssao/ssao.htm">http://rgba.scenesp.org/iq/computer/articles/ssao/ssao.htm</a></p>
<p>A gamedev.net thread with lots of discussion about SSAO<br />
<a href="http://www.gamedev.net/community/forums/topic.asp?topic_id=463075">http://www.gamedev.net/community/forums/topic.asp?topic_id=463075</a></p>

<div class="sociable">
<div class="sociable_tagline">
<strong>Please share:</strong>
</div>
<ul>
	<li class="sociablefirst"><a rel="nofollow" id="print" href="javascript:window.location='http%3A%2F%2Fwww.printfriendly.com%2Fprint%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Bpartner%3Dsociable';" title="Print this article!"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/printfriendly.png" title="Print this article!" alt="Print this article!" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="digg" href="javascript:window.location='http%3A%2F%2Fdigg.com%2Fsubmit%3Fphase%3D2%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion%26amp%3Bbodytext%3DSSAO%2520is%2520the%2520new%2520technique%2520that%2520most%2520new%2520games%2520just%2520must%2520include%2520because%2520of%2520the%2520hype%2520around%2520it%2520since%2520the%2520computer%2520game%2520Crysis.%2520It%2527s%2520a%2520technique%2520for%25C2%25A0creating%2520a%25C2%25A0rude%2520approximation%2520of%2520ambient%2520occlusion%2520by%2520using%2520the%2520a%2520depth%2520of%2520the%2520rendered%2520scene.%2520This%2520w';" title="Digg"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/digg.png" title="Digg" alt="Digg" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="sphinn" href="javascript:window.location='http%3A%2F%2Fsphinn.com%2Findex.php%3Fc%3Dpost%26m%3Dsubmit%26link%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F';" title="Sphinn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/sphinn.png" title="Sphinn" alt="Sphinn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="del.icio.us" href="javascript:window.location='http%3A%2F%2Fdelicious.com%2Fpost%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion%26amp%3Bnotes%3DSSAO%2520is%2520the%2520new%2520technique%2520that%2520most%2520new%2520games%2520just%2520must%2520include%2520because%2520of%2520the%2520hype%2520around%2520it%2520since%2520the%2520computer%2520game%2520Crysis.%2520It%2527s%2520a%2520technique%2520for%25C2%25A0creating%2520a%25C2%25A0rude%2520approximation%2520of%2520ambient%2520occlusion%2520by%2520using%2520the%2520a%2520depth%2520of%2520the%2520rendered%2520scene.%2520This%2520w';" title="del.icio.us"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/delicious.png" title="del.icio.us" alt="del.icio.us" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="facebook" href="javascript:window.location='http%3A%2F%2Fwww.facebook.com%2Fshare.php%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Bt%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="Facebook"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/facebook.png" title="Facebook" alt="Facebook" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="mixx" href="javascript:window.location='http%3A%2F%2Fwww.mixx.com%2Fsubmit%3Fpage_url%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="Mixx"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/mixx.png" title="Mixx" alt="Mixx" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="google" href="javascript:window.location='http%3A%2F%2Fwww.google.com%2Fbookmarks%2Fmark%3Fop%3Dedit%26amp%3Bbkmk%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion%26amp%3Bannotation%3DSSAO%2520is%2520the%2520new%2520technique%2520that%2520most%2520new%2520games%2520just%2520must%2520include%2520because%2520of%2520the%2520hype%2520around%2520it%2520since%2520the%2520computer%2520game%2520Crysis.%2520It%2527s%2520a%2520technique%2520for%25C2%25A0creating%2520a%25C2%25A0rude%2520approximation%2520of%2520ambient%2520occlusion%2520by%2520using%2520the%2520a%2520depth%2520of%2520the%2520rendered%2520scene.%2520This%2520w';" title="Google Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/googlebookmark.png" title="Google Bookmarks" alt="Google Bookmarks" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="current" href="javascript:window.location='http%3A%2F%2Fcurrent.com%2Fclipper.htm%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="Current"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/current.png" title="Current" alt="Current" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="linkedin" href="javascript:window.location='http%3A%2F%2Fwww.linkedin.com%2FshareArticle%3Fmini%3Dtrue%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion%26amp%3Bsource%3DGame%2BRendering%2B%26amp%3Bsummary%3DSSAO%2520is%2520the%2520new%2520technique%2520that%2520most%2520new%2520games%2520just%2520must%2520include%2520because%2520of%2520the%2520hype%2520around%2520it%2520since%2520the%2520computer%2520game%2520Crysis.%2520It%2527s%2520a%2520technique%2520for%25C2%25A0creating%2520a%25C2%25A0rude%2520approximation%2520of%2520ambient%2520occlusion%2520by%2520using%2520the%2520a%2520depth%2520of%2520the%2520rendered%2520scene.%2520This%2520w';" title="LinkedIn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/linkedin.png" title="LinkedIn" alt="LinkedIn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="live" href="javascript:window.location='https%3A%2F%2Ffavorites.live.com%2Fquickadd.aspx%3Fmarklet%3D1%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="Live"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/live.png" title="Live" alt="Live" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="myspace" href="javascript:window.location='http%3A%2F%2Fwww.myspace.com%2FModules%2FPostTo%2FPages%2F%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Bt%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="MySpace"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/myspace.png" title="MySpace" alt="MySpace" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="netvibes" href="javascript:window.location='http%3A%2F%2Fwww.netvibes.com%2Fshare%3Ftitle%3DScreen%2520Space%2520Ambient%2520Occlusion%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F';" title="Netvibes"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/netvibes.png" title="Netvibes" alt="Netvibes" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="stumbleupon" href="javascript:window.location='http%3A%2F%2Fwww.stumbleupon.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="StumbleUpon"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/stumbleupon.png" title="StumbleUpon" alt="StumbleUpon" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="twitter" href="javascript:window.location='http%3A%2F%2Ftwitter.com%2Fhome%3Fstatus%3DScreen%2520Space%2520Ambient%2520Occlusion%2520-%2520http%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F';" title="Twitter"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/twitter.png" title="Twitter" alt="Twitter" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="reddit" href="javascript:window.location='http%3A%2F%2Freddit.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Btitle%3DScreen%2520Space%2520Ambient%2520Occlusion';" title="Reddit"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/reddit.png" title="Reddit" alt="Reddit" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="technorati" href="javascript:window.location='http%3A%2F%2Ftechnorati.com%2Ffaves%3Fadd%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F';" title="Technorati"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/technorati.png" title="Technorati" alt="Technorati" class="sociable-hovers" /></a></li>
	<li class="sociablelast"><a rel="nofollow" id="yahoo! bookmarks" href="javascript:window.location='http%3A%2F%2Fbookmarks.yahoo.com%2Ftoolbar%2Fsavebm%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F11%252F04%252Fscreen-spaced-ambient-occlusion%252F%26amp%3Bt%3DScreen%2520Space%2520Ambient%2520Occlusion%26opener%3Dbm%26amp%3Bei%3DUTF-8%26amp%3Bd%3DSSAO%2520is%2520the%2520new%2520technique%2520that%2520most%2520new%2520games%2520just%2520must%2520include%2520because%2520of%2520the%2520hype%2520around%2520it%2520since%2520the%2520computer%2520game%2520Crysis.%2520It%2527s%2520a%2520technique%2520for%25C2%25A0creating%2520a%25C2%25A0rude%2520approximation%2520of%2520ambient%2520occlusion%2520by%2520using%2520the%2520a%2520depth%2520of%2520the%2520rendered%2520scene.%2520This%2520w';" title="Yahoo! Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/yahoomyweb.png" title="Yahoo! Bookmarks" alt="Yahoo! Bookmarks" class="sociable-hovers" /></a></li>
</ul>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.gamerendering.com/2008/11/04/screen-spaced-ambient-occlusion/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Gaussian Blur Filter Shader</title>
		<link>http://www.gamerendering.com/2008/10/11/gaussian-blur-filter-shader/</link>
		<comments>http://www.gamerendering.com/2008/10/11/gaussian-blur-filter-shader/#comments</comments>
		<pubDate>Sat, 11 Oct 2008 19:01:18 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Image Enhancements]]></category>
		<category><![CDATA[Blur]]></category>
		<category><![CDATA[Blur Filter]]></category>
		<category><![CDATA[Bluring Scene]]></category>
		<category><![CDATA[DirectX]]></category>
		<category><![CDATA[Filtering]]></category>
		<category><![CDATA[Fragment Shader]]></category>
		<category><![CDATA[Game]]></category>
		<category><![CDATA[Gaussian Blur]]></category>
		<category><![CDATA[GLSL]]></category>
		<category><![CDATA[Render-to-Texture]]></category>
		<category><![CDATA[Shaders]]></category>
		<category><![CDATA[Textures]]></category>
		<category><![CDATA[Vertex Shader]]></category>

		<guid isPermaLink="false">http://www.gamerendering.com/?p=295</guid>
		<description><![CDATA[There are different ways to perform blur and this is one of the most common way to do it in a shader. It&#8217;s a two step method with first a horizontal blur and then a vertical blur. By splitting the work in two directions (two passes) you can save a lot of computation.
The method can [...]]]></description>
			<content:encoded><![CDATA[<p>There are different ways to perform blur and this is one of the most common way to do it in a shader. It&#8217;s a two step method with first a horizontal blur and then a vertical blur. By splitting the work in two directions (two passes) you can save a lot of computation.</p>
<p>The method can be divided in the following parts:</p>
<ol>
<li>Render the scene you want to blur to a texture (could be downsampled)</li>
<li>Render a screen aligned quad with the horizontal blur shader to a texture</li>
<li>Render a screen aligned quad with the vertical blur shader to the screen or texture depending on what you want to use it for</li>
</ol>
<p>The following image shows how the blur works when splitted up in two directions.</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/image13-bluring.jpg"><img class="size-medium wp-image-298" title="Separable blur filter" src="http://www.gamerendering.com/wp-content/uploads/image13-bluring-390x400.jpg" alt="Separable blur filter" width="390" height="400" /></a></div>
<p>Here&#8217;s the horizontal blur shader.</p>
<p>Vertex Shader (GLSL) . This shader screen align a quad with width 1. Any method to render a screen aligned quad will work. So you&#8217;re free to use other shaders.</p>

<div class="wp_codebox"><table width="100%" ><tr id="p2955"><td class="code" id="p295code5"><pre class="c" style="font-family:monospace;">varying vec2 vTexCoord<span style="color: #339933;">;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">// remember that you should draw a screen aligned quad</span>
<span style="color: #993333;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #993333;">void</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
   gl_Position <span style="color: #339933;">=</span> ftransform<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;;</span>
  
   <span style="color: #666666; font-style: italic;">// Clean up inaccuracies</span>
   vec2 Pos<span style="color: #339933;">;</span>
   Pos <span style="color: #339933;">=</span> sign<span style="color: #009900;">&#40;</span>gl_Vertex.<span style="color: #202020;">xy</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
   gl_Position <span style="color: #339933;">=</span> vec4<span style="color: #009900;">&#40;</span>Pos<span style="color: #339933;">,</span> <span style="color:#800080;">0.0</span><span style="color: #339933;">,</span> <span style="color:#800080;">1.0</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
   <span style="color: #666666; font-style: italic;">// Image-space</span>
   vTexCoord <span style="color: #339933;">=</span> Pos <span style="color: #339933;">*</span> <span style="color:#800080;">0.5</span> <span style="color: #339933;">+</span> <span style="color:#800080;">0.5</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>Fragment Shader (GLSL) </p>

<div class="wp_codebox"><table width="100%" ><tr id="p2956"><td class="code" id="p295code6"><pre class="c" style="font-family:monospace;">uniform sampler2D RTScene<span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// the texture with the scene you want to blur</span>
varying vec2 vTexCoord<span style="color: #339933;">;</span>
&nbsp;
<span style="color: #993333;">const</span> <span style="color: #993333;">float</span> blurSize <span style="color: #339933;">=</span> <span style="color:#800080;">1.0</span><span style="color: #339933;">/</span><span style="color:#800080;">512.0</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// I've chosen this size because this will result in that every step will be one pixel wide if the RTScene texture is of size 512x512</span>
&nbsp;
<span style="color: #993333;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #993333;">void</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
   vec4 sum <span style="color: #339933;">=</span> vec4<span style="color: #009900;">&#40;</span><span style="color:#800080;">0.0</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
   <span style="color: #666666; font-style: italic;">// blur in y (vertical)</span>
   <span style="color: #666666; font-style: italic;">// take nine samples, with the distance blurSize between them</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">-</span> <span style="color:#800080;">4.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.05</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">-</span> <span style="color:#800080;">3.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.09</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">-</span> <span style="color:#800080;">2.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.12</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">-</span> blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.15</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.16</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">+</span> blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.15</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">+</span> <span style="color:#800080;">2.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.12</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">+</span> <span style="color:#800080;">3.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.09</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTScene<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span> <span style="color: #339933;">+</span> <span style="color:#800080;">4.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.05</span><span style="color: #339933;">;</span>
&nbsp;
   gl_FragColor <span style="color: #339933;">=</span> sum<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>And here&#8217;s the vertical blur shader.</p>
<p>Vertex Shader (GLSL) (the same as for the blur in horizontal direction)</p>

<div class="wp_codebox"><table width="100%" ><tr id="p2957"><td class="code" id="p295code7"><pre class="c" style="font-family:monospace;">varying vec2 vTexCoord<span style="color: #339933;">;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">// remember that you should draw a screen aligned quad</span>
<span style="color: #993333;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #993333;">void</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
   gl_Position <span style="color: #339933;">=</span> ftransform<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;;</span>
  
   <span style="color: #666666; font-style: italic;">// Clean up inaccuracies</span>
   vec2 Pos<span style="color: #339933;">;</span>
   Pos <span style="color: #339933;">=</span> sign<span style="color: #009900;">&#40;</span>gl_Vertex.<span style="color: #202020;">xy</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
   gl_Position <span style="color: #339933;">=</span> vec4<span style="color: #009900;">&#40;</span>Pos<span style="color: #339933;">,</span> <span style="color:#800080;">0.0</span><span style="color: #339933;">,</span> <span style="color:#800080;">1.0</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
   <span style="color: #666666; font-style: italic;">// Image-space</span>
   vTexCoord <span style="color: #339933;">=</span> Pos <span style="color: #339933;">*</span> <span style="color:#800080;">0.5</span> <span style="color: #339933;">+</span> <span style="color:#800080;">0.5</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>Fragment Shader (GLSL) </p>

<div class="wp_codebox"><table width="100%" ><tr id="p2958"><td class="code" id="p295code8"><pre class="c" style="font-family:monospace;">uniform sampler2D RTBlurH<span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// this should hold the texture rendered by the horizontal blur pass</span>
varying vec2 vTexCoord<span style="color: #339933;">;</span>
&nbsp;
<span style="color: #993333;">const</span> <span style="color: #993333;">float</span> blurSize <span style="color: #339933;">=</span> <span style="color:#800080;">1.0</span><span style="color: #339933;">/</span><span style="color:#800080;">512.0</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #993333;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #993333;">void</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
   vec4 sum <span style="color: #339933;">=</span> vec4<span style="color: #009900;">&#40;</span><span style="color:#800080;">0.0</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
   <span style="color: #666666; font-style: italic;">// blur in y (vertical)</span>
   <span style="color: #666666; font-style: italic;">// take nine samples, with the distance blurSize between them</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">-</span> <span style="color:#800080;">4.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.05</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">-</span> <span style="color:#800080;">3.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.09</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">-</span> <span style="color:#800080;">2.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.12</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">-</span> blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.15</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.16</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">+</span> blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.15</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">+</span> <span style="color:#800080;">2.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.12</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">+</span> <span style="color:#800080;">3.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.09</span><span style="color: #339933;">;</span>
   sum <span style="color: #339933;">+=</span> texture2D<span style="color: #009900;">&#40;</span>RTBlurH<span style="color: #339933;">,</span> vec2<span style="color: #009900;">&#40;</span>vTexCoord.<span style="color: #202020;">x</span><span style="color: #339933;">,</span> vTexCoord.<span style="color: #202020;">y</span> <span style="color: #339933;">+</span> <span style="color:#800080;">4.0</span><span style="color: #339933;">*</span>blurSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color:#800080;">0.05</span><span style="color: #339933;">;</span>
&nbsp;
   gl_FragColor <span style="color: #339933;">=</span> sum<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>And this is a scene without blur.</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/preblurshader.jpg"><img class="size-medium wp-image-297" title="Scene before bluring" src="http://www.gamerendering.com/wp-content/uploads/preblurshader-395x400.jpg" alt="Scene before bluring" width="357" height="385" /></a></div>
<p>And this is the same scene but with gaussian blur.</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/postblurshader.jpg"><img class="size-medium wp-image-296" title="Blured Scene" src="http://www.gamerendering.com/wp-content/uploads/postblurshader.jpg" alt="Blured Scene" width="356" height="334" /></a></div>
<p>You can tweak the blur radius to change the size of the blur and change the number of samples in each direction.</p>
<p>Cost for separable blur shader : 9+9 = 18 (number of texture samples)<br />
Cost for shader if blured in one pass: 9*9 = 81 (number of texture samples)<br />
So splitting up in two directions saves a lot.</p>
<p>The gaussian weights are calculated accordingly to the gaussian function with standard deviation of 2.7. These calculations were done in the excel document found [2].</p>
<p>Here&#8217;s a description of blur shaders and other image processing shaders in DirectX:<br />
[1] <a href="http://ati.amd.com/developer/shaderx/ShaderX2_AdvancedImageProcessing.pdf">http://ati.amd.com/developer/shaderx/ShaderX2_AdvancedImageProcessing.pdf</a></p>
<p>More info about calculating weights for separable gaussian blur:<br />
[2] <a href="http://theinstructionlimit.com/?p=40">http://theinstructionlimit.com/?p=40</a></p>

<div class="sociable">
<div class="sociable_tagline">
<strong>Please share:</strong>
</div>
<ul>
	<li class="sociablefirst"><a rel="nofollow" id="print" href="javascript:window.location='http%3A%2F%2Fwww.printfriendly.com%2Fprint%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Bpartner%3Dsociable';" title="Print this article!"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/printfriendly.png" title="Print this article!" alt="Print this article!" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="digg" href="javascript:window.location='http%3A%2F%2Fdigg.com%2Fsubmit%3Fphase%3D2%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520%26amp%3Bbodytext%3DThere%2520are%2520different%2520ways%2520to%2520perform%2520blur%2520and%2520this%2520is%2520one%2520of%2520the%2520most%2520common%2520way%2520to%2520do%2520it%2520in%2520a%2520shader.%2520It%2527s%2520a%2520two%2520step%2520method%2520with%2520first%2520a%2520horizontal%2520blur%2520and%2520then%2520a%2520vertical%2520blur.%2520By%2520splitting%2520the%2520work%2520in%2520two%2520directions%2520%2528two%2520passes%2529%2520you%2520can%2520save%2520a%2520lo';" title="Digg"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/digg.png" title="Digg" alt="Digg" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="sphinn" href="javascript:window.location='http%3A%2F%2Fsphinn.com%2Findex.php%3Fc%3Dpost%26m%3Dsubmit%26link%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F';" title="Sphinn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/sphinn.png" title="Sphinn" alt="Sphinn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="del.icio.us" href="javascript:window.location='http%3A%2F%2Fdelicious.com%2Fpost%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520%26amp%3Bnotes%3DThere%2520are%2520different%2520ways%2520to%2520perform%2520blur%2520and%2520this%2520is%2520one%2520of%2520the%2520most%2520common%2520way%2520to%2520do%2520it%2520in%2520a%2520shader.%2520It%2527s%2520a%2520two%2520step%2520method%2520with%2520first%2520a%2520horizontal%2520blur%2520and%2520then%2520a%2520vertical%2520blur.%2520By%2520splitting%2520the%2520work%2520in%2520two%2520directions%2520%2528two%2520passes%2529%2520you%2520can%2520save%2520a%2520lo';" title="del.icio.us"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/delicious.png" title="del.icio.us" alt="del.icio.us" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="facebook" href="javascript:window.location='http%3A%2F%2Fwww.facebook.com%2Fshare.php%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Bt%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="Facebook"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/facebook.png" title="Facebook" alt="Facebook" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="mixx" href="javascript:window.location='http%3A%2F%2Fwww.mixx.com%2Fsubmit%3Fpage_url%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="Mixx"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/mixx.png" title="Mixx" alt="Mixx" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="google" href="javascript:window.location='http%3A%2F%2Fwww.google.com%2Fbookmarks%2Fmark%3Fop%3Dedit%26amp%3Bbkmk%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520%26amp%3Bannotation%3DThere%2520are%2520different%2520ways%2520to%2520perform%2520blur%2520and%2520this%2520is%2520one%2520of%2520the%2520most%2520common%2520way%2520to%2520do%2520it%2520in%2520a%2520shader.%2520It%2527s%2520a%2520two%2520step%2520method%2520with%2520first%2520a%2520horizontal%2520blur%2520and%2520then%2520a%2520vertical%2520blur.%2520By%2520splitting%2520the%2520work%2520in%2520two%2520directions%2520%2528two%2520passes%2529%2520you%2520can%2520save%2520a%2520lo';" title="Google Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/googlebookmark.png" title="Google Bookmarks" alt="Google Bookmarks" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="current" href="javascript:window.location='http%3A%2F%2Fcurrent.com%2Fclipper.htm%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="Current"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/current.png" title="Current" alt="Current" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="linkedin" href="javascript:window.location='http%3A%2F%2Fwww.linkedin.com%2FshareArticle%3Fmini%3Dtrue%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520%26amp%3Bsource%3DGame%2BRendering%2B%26amp%3Bsummary%3DThere%2520are%2520different%2520ways%2520to%2520perform%2520blur%2520and%2520this%2520is%2520one%2520of%2520the%2520most%2520common%2520way%2520to%2520do%2520it%2520in%2520a%2520shader.%2520It%2527s%2520a%2520two%2520step%2520method%2520with%2520first%2520a%2520horizontal%2520blur%2520and%2520then%2520a%2520vertical%2520blur.%2520By%2520splitting%2520the%2520work%2520in%2520two%2520directions%2520%2528two%2520passes%2529%2520you%2520can%2520save%2520a%2520lo';" title="LinkedIn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/linkedin.png" title="LinkedIn" alt="LinkedIn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="live" href="javascript:window.location='https%3A%2F%2Ffavorites.live.com%2Fquickadd.aspx%3Fmarklet%3D1%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="Live"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/live.png" title="Live" alt="Live" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="myspace" href="javascript:window.location='http%3A%2F%2Fwww.myspace.com%2FModules%2FPostTo%2FPages%2F%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Bt%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="MySpace"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/myspace.png" title="MySpace" alt="MySpace" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="netvibes" href="javascript:window.location='http%3A%2F%2Fwww.netvibes.com%2Fshare%3Ftitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F';" title="Netvibes"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/netvibes.png" title="Netvibes" alt="Netvibes" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="stumbleupon" href="javascript:window.location='http%3A%2F%2Fwww.stumbleupon.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="StumbleUpon"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/stumbleupon.png" title="StumbleUpon" alt="StumbleUpon" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="twitter" href="javascript:window.location='http%3A%2F%2Ftwitter.com%2Fhome%3Fstatus%3DGaussian%2520Blur%2520Filter%2520Shader%2520%2520-%2520http%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F';" title="Twitter"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/twitter.png" title="Twitter" alt="Twitter" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="reddit" href="javascript:window.location='http%3A%2F%2Freddit.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Btitle%3DGaussian%2520Blur%2520Filter%2520Shader%2520';" title="Reddit"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/reddit.png" title="Reddit" alt="Reddit" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="technorati" href="javascript:window.location='http%3A%2F%2Ftechnorati.com%2Ffaves%3Fadd%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F';" title="Technorati"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/technorati.png" title="Technorati" alt="Technorati" class="sociable-hovers" /></a></li>
	<li class="sociablelast"><a rel="nofollow" id="yahoo! bookmarks" href="javascript:window.location='http%3A%2F%2Fbookmarks.yahoo.com%2Ftoolbar%2Fsavebm%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F11%252Fgaussian-blur-filter-shader%252F%26amp%3Bt%3DGaussian%2520Blur%2520Filter%2520Shader%2520%26opener%3Dbm%26amp%3Bei%3DUTF-8%26amp%3Bd%3DThere%2520are%2520different%2520ways%2520to%2520perform%2520blur%2520and%2520this%2520is%2520one%2520of%2520the%2520most%2520common%2520way%2520to%2520do%2520it%2520in%2520a%2520shader.%2520It%2527s%2520a%2520two%2520step%2520method%2520with%2520first%2520a%2520horizontal%2520blur%2520and%2520then%2520a%2520vertical%2520blur.%2520By%2520splitting%2520the%2520work%2520in%2520two%2520directions%2520%2528two%2520passes%2529%2520you%2520can%2520save%2520a%2520lo';" title="Yahoo! Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/yahoomyweb.png" title="Yahoo! Bookmarks" alt="Yahoo! Bookmarks" class="sociable-hovers" /></a></li>
</ul>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.gamerendering.com/2008/10/11/gaussian-blur-filter-shader/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Bilinear Interpolation</title>
		<link>http://www.gamerendering.com/2008/10/05/bilinear-interpolation/</link>
		<comments>http://www.gamerendering.com/2008/10/05/bilinear-interpolation/#comments</comments>
		<pubDate>Sun, 05 Oct 2008 15:18:47 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Filtering]]></category>
		<category><![CDATA[Bilinear Interpolation]]></category>
		<category><![CDATA[DirectX]]></category>
		<category><![CDATA[Fragment Shader]]></category>
		<category><![CDATA[GLSL]]></category>
		<category><![CDATA[Interpolation]]></category>
		<category><![CDATA[OpenGL]]></category>
		<category><![CDATA[Vertex Shader]]></category>

		<guid isPermaLink="false">http://www.gamerendering.com/?p=229</guid>
		<description><![CDATA[When sampling a texel from a texture that has been re-sized (which is nearly always the case in 3D rendering) you need to use some kind of filter to select what result you should get. Bilinear interpolation uses the four nearest neighbors to interpolate an average texel value.


This is a built in filter in OpenGL and to activate [...]]]></description>
			<content:encoded><![CDATA[<p>When sampling a texel from a texture that has been re-sized (which is nearly always the case in 3D rendering) you need to use some kind of filter to select what result you should get. Bilinear interpolation uses the four nearest neighbors to interpolate an average texel value.</p>
<p><a href="http://www.gamerendering.com/wp-content/uploads/bilinearinterpolation.jpg"></a></p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/bilinearinterpolation1.jpg"><img class="size-full wp-image-231" title="Bilinear Interpolation" src="http://www.gamerendering.com/wp-content/uploads/bilinearinterpolation1.jpg" alt="Bilinear Interpolation" width="421" height="126" /></a></div>
<p>This is a built in filter in OpenGL and to activate it you set the following lines when setting up a texture:</p>

<div class="wp_codebox"><table width="100%" ><tr id="p22911"><td class="code" id="p229code11"><pre class="c" style="font-family:monospace;"><span style="color: #666666; font-style: italic;">// set the minification filter</span>
glTexParameterf<span style="color: #009900;">&#40;</span> GL_TEXTURE_2D<span style="color: #339933;">,</span> GL_TEXTURE_MIN_FILTER<span style="color: #339933;">,</span> GL_LINEAR_MIPMAP_NEAREST <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">// set the magnification filter</span>
glTexParameterf<span style="color: #009900;">&#40;</span> GL_TEXTURE_2D<span style="color: #339933;">,</span> GL_TEXTURE_MAG_FILTER<span style="color: #339933;">,</span> GL_LINEAR <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>

<p>If you for some reason wants to do bilinear interpolation manually in a shader then the function to do so looks like the following in GLSL. Note that in vertex shaders you have to do manual bilinear interpolation between texture samples.</p>

<div class="wp_codebox"><table width="100%" ><tr id="p22912"><td class="code" id="p229code12"><pre class="c" style="font-family:monospace;"><span style="color: #993333;">const</span> <span style="color: #993333;">float</span> textureSize <span style="color: #339933;">=</span> <span style="color:#800080;">512.0</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//size of the texture</span>
<span style="color: #993333;">const</span> <span style="color: #993333;">float</span> texelSize <span style="color: #339933;">=</span> <span style="color:#800080;">1.0</span> <span style="color: #339933;">/</span> textureSize<span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">//size of one texel </span>
&nbsp;
vec4 texture2DBilinear<span style="color: #009900;">&#40;</span> sampler2D textureSampler<span style="color: #339933;">,</span> vec2 uv <span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
    <span style="color: #666666; font-style: italic;">// in vertex shaders you should use texture2DLod instead of texture2D</span>
    vec4 tl <span style="color: #339933;">=</span> texture2D<span style="color: #009900;">&#40;</span>textureSampler<span style="color: #339933;">,</span> uv<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    vec4 tr <span style="color: #339933;">=</span> texture2D<span style="color: #009900;">&#40;</span>textureSampler<span style="color: #339933;">,</span> uv <span style="color: #339933;">+</span> vec2<span style="color: #009900;">&#40;</span>texelSize<span style="color: #339933;">,</span> <span style="color: #0000dd;">0</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    vec4 bl <span style="color: #339933;">=</span> texture2D<span style="color: #009900;">&#40;</span>textureSampler<span style="color: #339933;">,</span> uv <span style="color: #339933;">+</span> vec2<span style="color: #009900;">&#40;</span><span style="color: #0000dd;">0</span><span style="color: #339933;">,</span> texelSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    vec4 br <span style="color: #339933;">=</span> texture2D<span style="color: #009900;">&#40;</span>textureSampler<span style="color: #339933;">,</span> uv <span style="color: #339933;">+</span> vec2<span style="color: #009900;">&#40;</span>texelSize <span style="color: #339933;">,</span> texelSize<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    vec2 f <span style="color: #339933;">=</span> fract<span style="color: #009900;">&#40;</span> uv.<span style="color: #202020;">xy</span> <span style="color: #339933;">*</span> textureSize <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// get the decimal part</span>
    vec4 tA <span style="color: #339933;">=</span> mix<span style="color: #009900;">&#40;</span> tl<span style="color: #339933;">,</span> tr<span style="color: #339933;">,</span> f.<span style="color: #202020;">x</span> <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// will interpolate the red dot in the image</span>
    vec4 tB <span style="color: #339933;">=</span> mix<span style="color: #009900;">&#40;</span> bl<span style="color: #339933;">,</span> br<span style="color: #339933;">,</span> f.<span style="color: #202020;">x</span> <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// will interpolate the blue dot in the image</span>
    <span style="color: #b1b100;">return</span> mix<span style="color: #009900;">&#40;</span> tA<span style="color: #339933;">,</span> tB<span style="color: #339933;">,</span> f.<span style="color: #202020;">y</span> <span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #666666; font-style: italic;">// will interpolate the green dot in the image</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>Here&#8217;s a magnification of a texture using using three different types of filters. The texture is mapped on a sphere and the viewport has been zoomed in on a small part of it.</p>
<p>Nearest Neigbour  (OpenGL fixed function implementation)</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/nearestneigbor.jpg"><img class="size-medium wp-image-245" title="Nearest Neigbor filter" src="http://www.gamerendering.com/wp-content/uploads/nearestneigbor.jpg" alt="Nearest Neigbor filter" width="216" height="185" /></a></div>
<p>Bilinear Interpolation (OpenGL fixed function implementation)</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/bilinearfilteringfixed.jpg"><img class="size-medium wp-image-246" title="Bilinear Interpolation OpenGL" src="http://www.gamerendering.com/wp-content/uploads/bilinearfilteringfixed.jpg" alt="Bilinear Interpolation OpenGL" width="214" height="184" /></a></div>
<p>Bilinear Interpolation (GLSL implementation, the code above)</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/bilinearmanually.jpg"><img class="size-medium wp-image-247" title="Bilinear Interpolation GLSL" src="http://www.gamerendering.com/wp-content/uploads/bilinearmanually.jpg" alt="Bilinear Interpolation GLSL" width="216" height="187" /></a></div>
<p>Some information about OpenGL texture mapping and how to set the filtering properties:<br />
<a href="http://www.nullterminator.net/gltexture.html">http://www.nullterminator.net/gltexture.html</a></p>
<p>Here&#8217;s some discussion why you should not always use bilinear interpolation:<br />
<a href="http://gregs-blog.com/2008/01/14/how-to-turn-off-bilinear-filtering-in-opengl/">http://gregs-blog.com/2008/01/14/how-to-turn-off-bilinear-filtering-in-opengl/</a></p>
<p>Link to a bilinear interpolation function for DirectX:<br />
<a href="http://www.catalinzima.com/?page_id=85">http://www.catalinzima.com/?page_id=85</a></p>
<p>Article on GameDev.net about bilinear filtering:<br />
<a href="http://www.gamedev.net/reference/articles/article669.asp">http://www.gamedev.net/reference/articles/article669.asp</a></p>

<div class="sociable">
<div class="sociable_tagline">
<strong>Please share:</strong>
</div>
<ul>
	<li class="sociablefirst"><a rel="nofollow" id="print" href="javascript:window.location='http%3A%2F%2Fwww.printfriendly.com%2Fprint%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Bpartner%3Dsociable';" title="Print this article!"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/printfriendly.png" title="Print this article!" alt="Print this article!" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="digg" href="javascript:window.location='http%3A%2F%2Fdigg.com%2Fsubmit%3Fphase%3D2%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation%26amp%3Bbodytext%3DWhen%2520sampling%2520a%2520texel%2520from%2520a%2520texture%2520that%2520has%2520been%2520re-sized%2520%2528which%2520is%2520nearly%25C2%25A0always%2520the%2520case%2520in%25C2%25A03D%2520rendering%2529%25C2%25A0you%2520need%2520to%2520use%2520some%2520kind%2520of%2520filter%2520to%2520select%2520what%2520result%2520you%2520should%2520get.%2520Bilinear%2520interpolation%2520uses%2520the%2520four%2520nearest%2520neighbors%2520to%2520inter';" title="Digg"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/digg.png" title="Digg" alt="Digg" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="sphinn" href="javascript:window.location='http%3A%2F%2Fsphinn.com%2Findex.php%3Fc%3Dpost%26m%3Dsubmit%26link%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F';" title="Sphinn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/sphinn.png" title="Sphinn" alt="Sphinn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="del.icio.us" href="javascript:window.location='http%3A%2F%2Fdelicious.com%2Fpost%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation%26amp%3Bnotes%3DWhen%2520sampling%2520a%2520texel%2520from%2520a%2520texture%2520that%2520has%2520been%2520re-sized%2520%2528which%2520is%2520nearly%25C2%25A0always%2520the%2520case%2520in%25C2%25A03D%2520rendering%2529%25C2%25A0you%2520need%2520to%2520use%2520some%2520kind%2520of%2520filter%2520to%2520select%2520what%2520result%2520you%2520should%2520get.%2520Bilinear%2520interpolation%2520uses%2520the%2520four%2520nearest%2520neighbors%2520to%2520inter';" title="del.icio.us"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/delicious.png" title="del.icio.us" alt="del.icio.us" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="facebook" href="javascript:window.location='http%3A%2F%2Fwww.facebook.com%2Fshare.php%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Bt%3DBilinear%2520Interpolation';" title="Facebook"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/facebook.png" title="Facebook" alt="Facebook" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="mixx" href="javascript:window.location='http%3A%2F%2Fwww.mixx.com%2Fsubmit%3Fpage_url%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation';" title="Mixx"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/mixx.png" title="Mixx" alt="Mixx" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="google" href="javascript:window.location='http%3A%2F%2Fwww.google.com%2Fbookmarks%2Fmark%3Fop%3Dedit%26amp%3Bbkmk%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation%26amp%3Bannotation%3DWhen%2520sampling%2520a%2520texel%2520from%2520a%2520texture%2520that%2520has%2520been%2520re-sized%2520%2528which%2520is%2520nearly%25C2%25A0always%2520the%2520case%2520in%25C2%25A03D%2520rendering%2529%25C2%25A0you%2520need%2520to%2520use%2520some%2520kind%2520of%2520filter%2520to%2520select%2520what%2520result%2520you%2520should%2520get.%2520Bilinear%2520interpolation%2520uses%2520the%2520four%2520nearest%2520neighbors%2520to%2520inter';" title="Google Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/googlebookmark.png" title="Google Bookmarks" alt="Google Bookmarks" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="current" href="javascript:window.location='http%3A%2F%2Fcurrent.com%2Fclipper.htm%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation';" title="Current"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/current.png" title="Current" alt="Current" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="linkedin" href="javascript:window.location='http%3A%2F%2Fwww.linkedin.com%2FshareArticle%3Fmini%3Dtrue%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation%26amp%3Bsource%3DGame%2BRendering%2B%26amp%3Bsummary%3DWhen%2520sampling%2520a%2520texel%2520from%2520a%2520texture%2520that%2520has%2520been%2520re-sized%2520%2528which%2520is%2520nearly%25C2%25A0always%2520the%2520case%2520in%25C2%25A03D%2520rendering%2529%25C2%25A0you%2520need%2520to%2520use%2520some%2520kind%2520of%2520filter%2520to%2520select%2520what%2520result%2520you%2520should%2520get.%2520Bilinear%2520interpolation%2520uses%2520the%2520four%2520nearest%2520neighbors%2520to%2520inter';" title="LinkedIn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/linkedin.png" title="LinkedIn" alt="LinkedIn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="live" href="javascript:window.location='https%3A%2F%2Ffavorites.live.com%2Fquickadd.aspx%3Fmarklet%3D1%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation';" title="Live"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/live.png" title="Live" alt="Live" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="myspace" href="javascript:window.location='http%3A%2F%2Fwww.myspace.com%2FModules%2FPostTo%2FPages%2F%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Bt%3DBilinear%2520Interpolation';" title="MySpace"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/myspace.png" title="MySpace" alt="MySpace" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="netvibes" href="javascript:window.location='http%3A%2F%2Fwww.netvibes.com%2Fshare%3Ftitle%3DBilinear%2520Interpolation%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F';" title="Netvibes"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/netvibes.png" title="Netvibes" alt="Netvibes" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="stumbleupon" href="javascript:window.location='http%3A%2F%2Fwww.stumbleupon.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation';" title="StumbleUpon"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/stumbleupon.png" title="StumbleUpon" alt="StumbleUpon" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="twitter" href="javascript:window.location='http%3A%2F%2Ftwitter.com%2Fhome%3Fstatus%3DBilinear%2520Interpolation%2520-%2520http%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F';" title="Twitter"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/twitter.png" title="Twitter" alt="Twitter" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="reddit" href="javascript:window.location='http%3A%2F%2Freddit.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Btitle%3DBilinear%2520Interpolation';" title="Reddit"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/reddit.png" title="Reddit" alt="Reddit" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="technorati" href="javascript:window.location='http%3A%2F%2Ftechnorati.com%2Ffaves%3Fadd%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F';" title="Technorati"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/technorati.png" title="Technorati" alt="Technorati" class="sociable-hovers" /></a></li>
	<li class="sociablelast"><a rel="nofollow" id="yahoo! bookmarks" href="javascript:window.location='http%3A%2F%2Fbookmarks.yahoo.com%2Ftoolbar%2Fsavebm%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F10%252F05%252Fbilinear-interpolation%252F%26amp%3Bt%3DBilinear%2520Interpolation%26opener%3Dbm%26amp%3Bei%3DUTF-8%26amp%3Bd%3DWhen%2520sampling%2520a%2520texel%2520from%2520a%2520texture%2520that%2520has%2520been%2520re-sized%2520%2528which%2520is%2520nearly%25C2%25A0always%2520the%2520case%2520in%25C2%25A03D%2520rendering%2529%25C2%25A0you%2520need%2520to%2520use%2520some%2520kind%2520of%2520filter%2520to%2520select%2520what%2520result%2520you%2520should%2520get.%2520Bilinear%2520interpolation%2520uses%2520the%2520four%2520nearest%2520neighbors%2520to%2520inter';" title="Yahoo! Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/yahoomyweb.png" title="Yahoo! Bookmarks" alt="Yahoo! Bookmarks" class="sociable-hovers" /></a></li>
</ul>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.gamerendering.com/2008/10/05/bilinear-interpolation/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Improved Alpha-Testing</title>
		<link>http://www.gamerendering.com/2008/09/29/improved-alpha-testing/</link>
		<comments>http://www.gamerendering.com/2008/09/29/improved-alpha-testing/#comments</comments>
		<pubDate>Mon, 29 Sep 2008 21:43:04 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Image Enhancements]]></category>
		<category><![CDATA[Alpha-Testing- Alpha Killing]]></category>
		<category><![CDATA[Decaling]]></category>
		<category><![CDATA[Decals]]></category>
		<category><![CDATA[Magnification]]></category>
		<category><![CDATA[Precision]]></category>
		<category><![CDATA[Rendering]]></category>
		<category><![CDATA[Special Effects]]></category>
		<category><![CDATA[Textures]]></category>
		<category><![CDATA[Vector]]></category>

		<guid isPermaLink="false">http://www.gamerendering.com/?p=145</guid>
		<description><![CDATA[The full title of this paper is improved &#8220;Alpha-Tested Magnification for Vector Textures and Special Effects&#8221;. It&#8217;s about a technique to use vector textures when decaling for improved precision when magnificating. This kind of decal is useful for signs and such things that contains text or symbols because they can easily be represented as vector [...]]]></description>
			<content:encoded><![CDATA[<p>The full title of this paper is improved &#8220;Alpha-Tested Magnification for Vector Textures and Special Effects&#8221;. It&#8217;s about a technique to use vector textures when decaling for improved precision when magnificating. This kind of decal is useful for signs and such things that contains text or symbols because they can easily be represented as vector graphics. The left image below shows standard Alpha-Testing and the image on the right shows the improved version.</p>
<div class="mceTemp"><a href="http://www.gamerendering.com/wp-content/uploads/improveddecaling.jpg"><img class="size-medium wp-image-146" title="Improved Alpha-Testing for Decaling" src="http://www.gamerendering.com/wp-content/uploads/improveddecaling-400x182.jpg" alt="Improved Alpha-Testing for Decaling" width="400" height="182" /></a></div>
<p>Link to the paper:<br />
<a href="http://www.valvesoftware.com/publications/2007/SIGGRAPH2007_AlphaTestedMagnification.pdf">http://www.valvesoftware.com/publications/2007/SIGGRAPH2007_AlphaTestedMagnification.pdf</a></p>

<div class="sociable">
<div class="sociable_tagline">
<strong>Please share:</strong>
</div>
<ul>
	<li class="sociablefirst"><a rel="nofollow" id="print" href="javascript:window.location='http%3A%2F%2Fwww.printfriendly.com%2Fprint%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Bpartner%3Dsociable';" title="Print this article!"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/printfriendly.png" title="Print this article!" alt="Print this article!" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="digg" href="javascript:window.location='http%3A%2F%2Fdigg.com%2Fsubmit%3Fphase%3D2%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing%26amp%3Bbodytext%3DThe%2520full%2520title%2520of%2520this%2520paper%2520is%2520improved%2520%2522Alpha-Tested%2520Magnification%2520for%2520Vector%2520Textures%2520and%2520Special%2520Effects%2522.%2520It%2527s%2520about%2520a%2520technique%2520to%2520use%2520vector%2520textures%2520when%2520decaling%2520for%2520improved%2520precision%2520when%2520magnificating.%2520This%2520kind%2520of%2520decal%2520is%2520useful%2520for%2520sig';" title="Digg"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/digg.png" title="Digg" alt="Digg" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="sphinn" href="javascript:window.location='http%3A%2F%2Fsphinn.com%2Findex.php%3Fc%3Dpost%26m%3Dsubmit%26link%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F';" title="Sphinn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/sphinn.png" title="Sphinn" alt="Sphinn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="del.icio.us" href="javascript:window.location='http%3A%2F%2Fdelicious.com%2Fpost%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing%26amp%3Bnotes%3DThe%2520full%2520title%2520of%2520this%2520paper%2520is%2520improved%2520%2522Alpha-Tested%2520Magnification%2520for%2520Vector%2520Textures%2520and%2520Special%2520Effects%2522.%2520It%2527s%2520about%2520a%2520technique%2520to%2520use%2520vector%2520textures%2520when%2520decaling%2520for%2520improved%2520precision%2520when%2520magnificating.%2520This%2520kind%2520of%2520decal%2520is%2520useful%2520for%2520sig';" title="del.icio.us"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/delicious.png" title="del.icio.us" alt="del.icio.us" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="facebook" href="javascript:window.location='http%3A%2F%2Fwww.facebook.com%2Fshare.php%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Bt%3DImproved%2520Alpha-Testing';" title="Facebook"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/facebook.png" title="Facebook" alt="Facebook" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="mixx" href="javascript:window.location='http%3A%2F%2Fwww.mixx.com%2Fsubmit%3Fpage_url%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing';" title="Mixx"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/mixx.png" title="Mixx" alt="Mixx" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="google" href="javascript:window.location='http%3A%2F%2Fwww.google.com%2Fbookmarks%2Fmark%3Fop%3Dedit%26amp%3Bbkmk%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing%26amp%3Bannotation%3DThe%2520full%2520title%2520of%2520this%2520paper%2520is%2520improved%2520%2522Alpha-Tested%2520Magnification%2520for%2520Vector%2520Textures%2520and%2520Special%2520Effects%2522.%2520It%2527s%2520about%2520a%2520technique%2520to%2520use%2520vector%2520textures%2520when%2520decaling%2520for%2520improved%2520precision%2520when%2520magnificating.%2520This%2520kind%2520of%2520decal%2520is%2520useful%2520for%2520sig';" title="Google Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/googlebookmark.png" title="Google Bookmarks" alt="Google Bookmarks" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="current" href="javascript:window.location='http%3A%2F%2Fcurrent.com%2Fclipper.htm%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing';" title="Current"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/current.png" title="Current" alt="Current" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="linkedin" href="javascript:window.location='http%3A%2F%2Fwww.linkedin.com%2FshareArticle%3Fmini%3Dtrue%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing%26amp%3Bsource%3DGame%2BRendering%2B%26amp%3Bsummary%3DThe%2520full%2520title%2520of%2520this%2520paper%2520is%2520improved%2520%2522Alpha-Tested%2520Magnification%2520for%2520Vector%2520Textures%2520and%2520Special%2520Effects%2522.%2520It%2527s%2520about%2520a%2520technique%2520to%2520use%2520vector%2520textures%2520when%2520decaling%2520for%2520improved%2520precision%2520when%2520magnificating.%2520This%2520kind%2520of%2520decal%2520is%2520useful%2520for%2520sig';" title="LinkedIn"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/linkedin.png" title="LinkedIn" alt="LinkedIn" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="live" href="javascript:window.location='https%3A%2F%2Ffavorites.live.com%2Fquickadd.aspx%3Fmarklet%3D1%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing';" title="Live"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/live.png" title="Live" alt="Live" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="myspace" href="javascript:window.location='http%3A%2F%2Fwww.myspace.com%2FModules%2FPostTo%2FPages%2F%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Bt%3DImproved%2520Alpha-Testing';" title="MySpace"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/myspace.png" title="MySpace" alt="MySpace" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="netvibes" href="javascript:window.location='http%3A%2F%2Fwww.netvibes.com%2Fshare%3Ftitle%3DImproved%2520Alpha-Testing%26amp%3Burl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F';" title="Netvibes"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/netvibes.png" title="Netvibes" alt="Netvibes" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="stumbleupon" href="javascript:window.location='http%3A%2F%2Fwww.stumbleupon.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing';" title="StumbleUpon"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/stumbleupon.png" title="StumbleUpon" alt="StumbleUpon" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="twitter" href="javascript:window.location='http%3A%2F%2Ftwitter.com%2Fhome%3Fstatus%3DImproved%2520Alpha-Testing%2520-%2520http%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F';" title="Twitter"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/twitter.png" title="Twitter" alt="Twitter" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="reddit" href="javascript:window.location='http%3A%2F%2Freddit.com%2Fsubmit%3Furl%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Btitle%3DImproved%2520Alpha-Testing';" title="Reddit"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/reddit.png" title="Reddit" alt="Reddit" class="sociable-hovers" /></a></li>
	<li><a rel="nofollow" id="technorati" href="javascript:window.location='http%3A%2F%2Ftechnorati.com%2Ffaves%3Fadd%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F';" title="Technorati"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/technorati.png" title="Technorati" alt="Technorati" class="sociable-hovers" /></a></li>
	<li class="sociablelast"><a rel="nofollow" id="yahoo! bookmarks" href="javascript:window.location='http%3A%2F%2Fbookmarks.yahoo.com%2Ftoolbar%2Fsavebm%3Fu%3Dhttp%253A%252F%252Fwww.gamerendering.com%252F2008%252F09%252F29%252Fimproved-alpha-testing%252F%26amp%3Bt%3DImproved%2520Alpha-Testing%26opener%3Dbm%26amp%3Bei%3DUTF-8%26amp%3Bd%3DThe%2520full%2520title%2520of%2520this%2520paper%2520is%2520improved%2520%2522Alpha-Tested%2520Magnification%2520for%2520Vector%2520Textures%2520and%2520Special%2520Effects%2522.%2520It%2527s%2520about%2520a%2520technique%2520to%2520use%2520vector%2520textures%2520when%2520decaling%2520for%2520improved%2520precision%2520when%2520magnificating.%2520This%2520kind%2520of%2520decal%2520is%2520useful%2520for%2520sig';" title="Yahoo! Bookmarks"><img src="http://www.gamerendering.com/wp-content/plugins/sociable/images/yahoomyweb.png" title="Yahoo! Bookmarks" alt="Yahoo! Bookmarks" class="sociable-hovers" /></a></li>
</ul>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.gamerendering.com/2008/09/29/improved-alpha-testing/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
