tag:blogger.com,1999:blog-10965332446605460512024-02-19T23:09:16.370-08:00Oren Game Engineits time to see what i can do with it...orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.comBlogger113125tag:blogger.com,1999:blog-1096533244660546051.post-40475846914182099982013-12-03T08:58:00.000-08:002013-12-03T08:58:09.904-08:00OrenVideo is OnlineHi all<br />
<br />
i'm still kicking and coding...<br />
last few months i worked on my videos solution:<br />
* create online site.<br />
* code and make it robust.<br />
* add documentation.<br />
* test it with real application/games.<br />
etc<br />
<br />
and now its ready to by shipped, the site is ONLINE!<br />
<br />
<b>spread the word: now you have alternative and can use videos in your game/application without emptying your pocket!</b><br />
<b>please check out: </b><b><a href="http://www.orenvid.com/"><span style="color: red;"><b>http://www.orenvid.com</b></span></a> </b><br />
<b><br /></b>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjymZvhPpFcxpiWXVk2S6vX708ianhel7wpdmvQkwiefyB_MDDx-_xUhOFTBWIpX5wBmOwSxBrqGOoz6UW3zSTiTpSEO9VhmZFOVPHXg5XWVIpRB8n1ndl-coITDTc3xRp2vwE03JqMIqE/s1600/OrenVideoHeader.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="65" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjymZvhPpFcxpiWXVk2S6vX708ianhel7wpdmvQkwiefyB_MDDx-_xUhOFTBWIpX5wBmOwSxBrqGOoz6UW3zSTiTpSEO9VhmZFOVPHXg5XWVIpRB8n1ndl-coITDTc3xRp2vwE03JqMIqE/s320/OrenVideoHeader.jpg" width="320" /></a></div>
<b></b><br />
<div style="text-align: center;">
<span style="color: red;"><br /></span></div>
<br />
thanks.orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-52280837593140723112013-07-01T04:22:00.001-07:002013-07-01T04:45:45.562-07:00My Video Solution Used By Super Splatter!Hi all<br />
<br />
long time i didn't update, same old song, busy busy and no time to update...<br />
anyway, remember the last posts about video solutions etc, pricing and stuff? well guess what?<br />
my own video solution is out and used by the game "super splatters" which is cross platform pc/mac/linux game, and a really cool one!<br />
<br />
some background info, these guys used to use other cross platform video solution, and they was happy with the results, until one day i came and say, hey wana check other solution, with better performance and less $?<br />
they said, it can't be, you can't make something better than what we already use now.<br />
i told them try and you will see.<br />
so they did, and they never went back :)<br />
<br />
btw: this game is very nice and cool, using in-house physics engine, really cool effects and next gen ui system uses lots of videos (smaller/bigger you name it), you can read more about it here: <a href="http://store.steampowered.com/app/95000/" target="_blank">super splatters</a> <br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4iCpj5-RdXq4Rnwkp_A4GULb_a1X9lHClJWlnGZw9b3hjvye-5coipEouxWS-MpzXqxmNWpmHoVYYYFZSpKVgaaNZCQZCSI346SVPQmuaDi9ljaowJ3XM5oiPrgIeDhZcRGVgZ8e-uPc/s1024/Splatters-2013-07-01-14-19-.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4iCpj5-RdXq4Rnwkp_A4GULb_a1X9lHClJWlnGZw9b3hjvye-5coipEouxWS-MpzXqxmNWpmHoVYYYFZSpKVgaaNZCQZCSI346SVPQmuaDi9ljaowJ3XM5oiPrgIeDhZcRGVgZ8e-uPc/s320/Splatters-2013-07-01-14-19-.jpg" width="320" /></a></div>
<br />
few words regarding my video solution:<br />
name: OrenVideo <br />
platforms: pc/mac/linux/android<br />
speed: lighting fast, super splatters team checked it against top of the line solution and mine was better.<br />
memory: less or equal to anything you know or used.<br />
integrations: easy as hello word app ;P<br />
<br />
soon enough i will be ready to launch my video solution site, meanwhile if you have any questions related, feel free to ask here...<br />
cya<br />
<br />orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-81633329530909096652012-08-07T02:55:00.002-07:002012-08-07T02:59:38.457-07:00Fair Price For Cross Platform Video Solution?Hi all<br />
<br />
since my last post i'm working full power on publishing cross platform video solution. <br />
first stage it will be:<br />
1. pc<br />
2. linux<br />
3. mac<br />
second stage will depend on sells so eventually i will add top consoles:<br />
1. xbox 360 (future 720)<br />
2. ps3<br />
more platforms will be added based on customers requirements...<br />
<br />
now for the important stuff: Pricing<br />
<br />
from my last post you already know that it a pain in the butt to create such a solution and at the same time making it fast enough to run multiple hd videos at 30 fps game...<br />
<br />
i'v added a poll at the top left corner so i could know what do you think:<br />
YOUR VOTE COUNTS!<br />
believe it or not, but your vote will have a HUGE influence on the price.<br />
pool keywords: <br />
indie = independence/independent<br />
comm = commercial<br />
<br />
so... if you have friends, colleague or people who might consider buying such a solution, get them here to vote...<br />
<br />
thanks and cya.<br />
<br />orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-47698147146038475752012-05-30T03:23:00.003-07:002012-05-30T03:23:50.295-07:00Generic Video Solution for GamesHi all<br />
<br />
this time i will talk about the video in your game..<br />
well, first i will say that this issue was back in my head for long time, but recently, after i talked with my friend who has to buy video solution for their game, it popped to my head again...<br />
why is it so complicated to make video solution for games?<br />
my friend answer was, if you are going to make a cross platform game, want real-time speed, alpha channel support then you don't have any alternatives but to buy bink.<br />
<br />
for these who don't now, bink is a cross platform video solution developed by rad game tools, its fast and easy to use and the quality isn't so bad either.<br />
so what's the problem you ask? well, the price! its too expensive, 8500$ per platform per game, yes yes you read this right.<br />
<br />
so for example, if you are a small indie developer and you are going to make a windows and xbox360 game, you will have to pay 17,000$, that's a lot of money for indie! hell, its a lot of money period!.<br />
<br />
besides, most of the games will need to play video only at the beginning of the game, for example, some game story video, hardware video (nvidia, havok, amd) etc.. and for that its a real pain that you need to pay that kind of money.<br />
<br />
anyway, what else you can do? well, you can create you own video solution for both xbox360 and windows.<br />
for windows: use windows vfw lib<br />
for xbox360, use xmedia lib<br />
<br />
but this will take time, and you will have to design some nice lib to have same functions in both windows and xbox360 for the same/different features you have in each platform, and that's if you have 2 platform, it gets really dirty for more.<br />
<br />
in my experience, if you need to create your own video solution for the ps3, you are unlucky, in the past i created video solution for an in-game ads company, and i used libsail that comes with sony sdk to support video playing on the ps3, let me tell you that in one word: nightmare!<br />
<br />
lets say you want to play videos without sounds, lets say for explosions, menus etc... and the sound comes from your sound system (that you already licensed) triggered sounds when needed.<br />
well, you don't have any kind of solution for this one too... same problem as i said above.<br />
<br />
so it turns out that you don't really have any generic video solution for you game, that doesn't rip your wallet...<br />
<br />
so why don't we have anything other than bink for games you ask? well i can't really answer this question, as i'm asking it myself for some time.<br />
i turn out that even if you think you have what it takes to write something like bink, it is very difficult to do that, thats because its not so easy, and there is a lot of patents around video/audio compression that you need to carefully walk around so you won't land on a mine.<br />
<br />
so maybe you ask yourself, what all these words, i already know that, so don't walk on my wounds...<br />
<br />
what if tell you that there is an alternative! <br />
maybe not so complete unit as bink (not supporting all the platforms etc), but will support:<br />
* popular platforms and will add new ones in time.<br />
* alpha channel in videos<br />
* real-time speed<br />
* good compression ratio.<br />
<br />and the crazy thing about it, it won't cost 8500$ per platform per game!<br />
<br />
so the real question is:<br />
will you be interesting in such solution?<br />
if so, please write a comment to this post and i appreciate if you could write what features you want in such solution, how much do you think it worth paying for etc..<br />
<br />
thanks and stay tuned, cya<br />
<br />orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com11tag:blogger.com,1999:blog-1096533244660546051.post-44884282685315673532012-05-10T02:38:00.002-07:002012-05-10T02:38:48.882-07:00Flying Camerahi<br />
quick update...<br />
this time i added support for flying camera, or spline paths.<br />
what this means, is that i can place path nodes inside the editor, and make the camera follow it.<br />
the reason i add this 'not so important feature' is that i wanted a way to capture videos and not capture me walking inside the scene, so every time i change something i could use the same path and see the new look with the same angles/pos etc...<br />
anyway, here is a video showing flying camera in my scene, enjoy!<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dxIk-xFIixgct-TFo2yv8l2EoLtw9VxKCAFMti4-_YfDquLvCdHSi90xlYL7AlbjCqWAnslGsDPRXYV3UzJCA' class='b-hbp-video b-uploaded' frameborder='0'></iframe></div>
<br />orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com1tag:blogger.com,1999:blog-1096533244660546051.post-48810462524788343632012-04-07T11:31:00.004-07:002012-04-07T11:34:13.012-07:00Another Bokeh Technique - RM VideoHi all, just created a quick video of the new vs technique, compare it with the quality of the ps technique from the previous posts and see how good it is, as for the numbers, check out my comment from the prev pos, enjoy:<br /><br /><div style="text-align: center;"><iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dzQKrOIkwa8PZnrxJn6XHYiGORPTP415X0olPLR6HtLfKKoDaxtAQ697qVsNU5ChhyrDdd88aO7iycvgbETXg' class='b-hbp-video b-uploaded' frameborder='0'></iframe><br /><br /></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-21900997541234360292012-04-07T04:28:00.005-07:002012-04-07T04:57:22.316-07:00Another Bokeh Techniquehi all<br /><br />last post i talked about bokeh effect done inside pixel shader using special bokeh kernel, this time i will talk about more generic technique for doing bokeh.<br />first lets talk about whats wasn't good in the pixel shader technique.<br />in my engine i say i have film dof effect, what this means is that i can set almost any size of kernel per pixel! this means i'm not suffering from depth difference and stuff like that.<br />i can set one pixel to be blurred by radius 5, and the next pixel beside by radius 100, without any artifacts... (as long i will not get crazy with kernel radius)<br /><br />anyway, because the ps technique is some kind of blur technique, if i will inject it to my engine on top of my dof, it will 'erase' my 'perfect' blur technique, because it is a blur, but not smarter than what i already have.<br /><br />so if you don't have any dof/blur solution yet, it will probably be good for you, if you have some kind of smart blur, it probably wont.<br /><br />so is there any thing we can do to add bokeh effect without dx10,11?<br />yes there is...<br />on the last post i said few words about a technique to generate bokeh using vertex shader, here i will write some detail about it and show some images from the engine.<br /><br />this new technique uses the vertex shader to generate bokeh sprites/billboards, the steps to do this is:<br />* create big vertex shader containing 4 vertices per pixel!, yes you are reading it correct, 4 vertices per pixel...<br />* inside vs, you generate the quad vertices based on some math, this math will actually use some circle of confusion values and your current image, so you can set bokeh color and size.<br />* inside ps, you just sample your bokeh texture, can be any shape you like, and use the color you output from the vs, to set its intensity etc.<br /><br />technique pros:<br />* very easy to do<br />* support any bokeh shape<br />* dx9 hardware (shader model 3)<br />* work hand by hand with any dof/blur technique<br />* very fast<br /><br />technique cons:<br />* takes lots of vertex memory (depends on your size)<br />* vertex shader heavy (basically not a problem as we are more ps heave than vs)<br />* can be slow if you won't filter them in a good way, you don't want to generate bokeh for every pixel in the screen, this can be nasty! i got blur screen on win 7 ;)<br /><br />here is few screenshots (not compressed) from the engine that's shows it in action, you could also see the film dof effect with very large coc to enhanced the effect (kernel radius of 80 for far pixels)<br /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX4ptuUYjh6xYhEoyQfnGrnXjct8M7DqS7NCntJElKAKjyaS_wuurgF0BfxJU1reapeVTnoHkann5hYH7xYPgWU9V6vBFQv1UsRL6mFa-vtMI0Qf6ZiAlhkty-XzjpHl8gXAX7yyLX6Sw/s1600/Test1+2012-04-07+14-25-48-79.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX4ptuUYjh6xYhEoyQfnGrnXjct8M7DqS7NCntJElKAKjyaS_wuurgF0BfxJU1reapeVTnoHkann5hYH7xYPgWU9V6vBFQv1UsRL6mFa-vtMI0Qf6ZiAlhkty-XzjpHl8gXAX7yyLX6Sw/s400/Test1+2012-04-07+14-25-48-79.png" alt="" id="BLOGGER_PHOTO_ID_5728623038414587362" border="0" /></a>orignal image (no dof, no bokeh)<br /></div><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf38AqEALHiScJCeE2B6nCwDp9hyphenhyphenzHYSG1vAeaLsZFgPkdywhYWyR50cWq12LmZuHuyjW49I3S7oYw8_cE0QTn0ReUFMgGB4xRapbA0jDicPXXYQWYmT_unh4ueUWxmI-GbE66cg9RybE/s1600/Test1+2012-04-07+14-26-05-28.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf38AqEALHiScJCeE2B6nCwDp9hyphenhyphenzHYSG1vAeaLsZFgPkdywhYWyR50cWq12LmZuHuyjW49I3S7oYw8_cE0QTn0ReUFMgGB4xRapbA0jDicPXXYQWYmT_unh4ueUWxmI-GbE66cg9RybE/s400/Test1+2012-04-07+14-26-05-28.png" alt="" id="BLOGGER_PHOTO_ID_5728623028591331650" border="0" /></a>film dof (no bokeh)<br /></div><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTDqU6vyzN107yR_Q9LFjLf6ofDIfIqA2HAZ9n8O536jakrxrSe71AqqNpVY-liiKONgqoTNhKu7ryeD2ED_pLqJprco0EPq7iV-0kE8QmNFq41BW-kZ8zk56BKRkY9rgSxui87wvAzoU/s1600/Test1+2012-04-07+14-26-10-56.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTDqU6vyzN107yR_Q9LFjLf6ofDIfIqA2HAZ9n8O536jakrxrSe71AqqNpVY-liiKONgqoTNhKu7ryeD2ED_pLqJprco0EPq7iV-0kE8QmNFq41BW-kZ8zk56BKRkY9rgSxui87wvAzoU/s400/Test1+2012-04-07+14-26-10-56.png" alt="" id="BLOGGER_PHOTO_ID_5728623016972058866" border="0" /></a>pentagonal bokeh<br /></div><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF9UPSnL02oowjcnQ_lmYPkvoXZB2agvloiko1vhybqDiuMgHJTz8hmUqGwCHsD_ufM5zVfllBno8-7HEdTmzMDMZZ8sF36NyGY00Owt4J0EK7YkCvRkm0lrI3xEkEBbwkQTEhG1oluWA/s1600/Test1+2012-04-07+14-26-20-63.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF9UPSnL02oowjcnQ_lmYPkvoXZB2agvloiko1vhybqDiuMgHJTz8hmUqGwCHsD_ufM5zVfllBno8-7HEdTmzMDMZZ8sF36NyGY00Owt4J0EK7YkCvRkm0lrI3xEkEBbwkQTEhG1oluWA/s400/Test1+2012-04-07+14-26-20-63.png" alt="" id="BLOGGER_PHOTO_ID_5728623010431949010" border="0" /></a>hexagonal bokeh<br /></div><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJFgUiw46NqubNtpQyCsm7_5tzbzh45BV-1qAg45WNqUpaerTRZVyz_zuMRu5T-bUlLy5uWeri6HmUN9IKxHFkKESxSQYS4W24qmnuTUSN4HIsKYXlX1KWYvAiSwe11Iw86o_qsdu87ig/s1600/Test1+2012-04-07+14-26-24-38.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJFgUiw46NqubNtpQyCsm7_5tzbzh45BV-1qAg45WNqUpaerTRZVyz_zuMRu5T-bUlLy5uWeri6HmUN9IKxHFkKESxSQYS4W24qmnuTUSN4HIsKYXlX1KWYvAiSwe11Iw86o_qsdu87ig/s400/Test1+2012-04-07+14-26-24-38.png" alt="" id="BLOGGER_PHOTO_ID_5728623001978026050" border="0" /></a>circle bokeh<br /></div><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaYYUCFLrkk__2RN-pMjcPADEsswZtLnKiAk5y-uUPIVAf7kizVaq60jL8bAh2RzrgDE2KyaurR79YrpjSp9i8G6FOUsQWvOJy-15KfDRxlQgffTC8Xl4Tf3ofheT4YP7t3q6Bx1r8diA/s1600/Test1+2012-04-07+14-26-28-52.png"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaYYUCFLrkk__2RN-pMjcPADEsswZtLnKiAk5y-uUPIVAf7kizVaq60jL8bAh2RzrgDE2KyaurR79YrpjSp9i8G6FOUsQWvOJy-15KfDRxlQgffTC8Xl4Tf3ofheT4YP7t3q6Bx1r8diA/s400/Test1+2012-04-07+14-26-28-52.png" alt="" id="BLOGGER_PHOTO_ID_5728623947072975522" border="0" /></a>star bokeh<br /><div style="text-align: left;"><br />that's it, very simple and very fast! cya until next time...<br /><br /></div></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com2tag:blogger.com,1999:blog-1096533244660546051.post-37692075035211489792012-03-29T13:17:00.004-07:002012-03-29T13:51:17.596-07:00Revisiting Lens Effect / Bokeh - DetailsHi<br />just finished doing another test with this technique, and even test it on my old card... and it rocks, can't wait to inject it to the engine (its still a render monkey tester).<br />anyway, someone asked for some details about this technique, so here is the post that i hope will clear few things.<br /><br />let me start with example with steps:<br />* we have image A<br />* we want new image B (blurred)<br />* so we apply blur filter on A and get B<br />the tricky part is the blur filter.<br /><br />if we want to apply simple blur, lets say we take 4 samples, so we will sample four locations around our current pixel and do some average to get our new pixel, this is the basic of blurring. in this example we say the kernel/radius size is 1, because we sample at distance of one pixel from our current pixel.<br /><br />if we want to control the radius and make it more then 1 pixel, we could manually change our samples locations, but a better way would be to set our samples as directions/vectors from our current pixel to the sample location we would like to sample, so we could scale it and sample at larger distance from our current pixel.<br /><br />some numbers to show what i mean:<br />if we have an image with 3x3 pixels, and we are at pixel (1,1), our absolute samples locations will be:<br />(0,0), (2,0) - top<br />(0,2), (2,2) - bottom<br />but when we convert these to directions, we get:<br />(-1,-1), (1,-1) - top<br />(-1,1), (1,1) - bottom<br /><br />NOTE: these directions are simply added to our current pixel location to get the right sample location.<br />the directions format is better since it allows as to scale them and sample at larger distance and its keeps the code more generic.<br />keep in mind that these directions will be good for radius 1 or 2, larger values results in artifacts dues to not enough samples around our pixel.<br />to use large values, you want more samples, but more samples means more gpu power, so you want to find nice balance between quality and speed.<br /><br />anyway, how could we get shape like blurs? like circles, squares, pentagon etc..<br />the same idea we did in the simple case, we create a set of directions that creates or match the shape we want and apply it, we need to use more samples so our shape will maintain its shape.<br /><br />one thing you should know is that when you sample and gather pixels almost all the time you will apply some kind of weight on them so each pixel will have its contribution (you may not want that every pixel will have the same contribution...).<br /><br />here is a new video with better quality that shows this technique in action.<br />the test uses 2 inputs to emulate simple depth of field effect:<br />* first input is color image of a really nice car :)<br />* second is CoC image that represent the circle of confusion which in turn will change our radius when we blur (created in photoshop to apply dof on specific areas in the image)<br /><br /><div style="text-align: center;"><iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dykFYvJowxpcD6fSIddVNFVqraAi6aJAejgEObzQtCAJuo5rRgJ-FtSLRoL4wQzVC-bxlln9gCVmxHTArmY9w' class='b-hbp-video b-uploaded' frameborder='0'></iframe><br /><div style="text-align: left;"><br /></div></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-26463530805085152602012-03-28T09:51:00.003-07:002012-03-28T10:08:40.622-07:00Revisiting Lens Effect / BokehHi all<br />this time i'm revisiting lens effect called bokeh.<br />last week a friend of mine asked me about my film dof effect, and he asked if i'm supporting bokeh effect, i told him that i used to do it with FFT and with dx11 i can do it better.<br />as i don't have dx11 card (i'v old geforce 240 gt with dx10.1) i can't do the effect like crytek and unreal samaritan demo.<br />so is there another technique to do it without dx11? well yes...<br />what we can do is to create a huge vertex buffer that contain quads, one quad per pixel, and inside the vertex shader we can place and size them as needed.<br />this technique will work on dx9 hw and should be done on half or quarter size render target because the hugh amount of vertices it required, this technique add as new feature to unreal engine.<br />i don't really like the idea of having huge VB per pixel, so can we do better?<br />i did simple test in render monkey and create a "pentagon filter" inside the pixel shader, i control the size via simple circle of confusion value just to test and see if its working.<br />the filter uses 30 samples per pixel and its very fast, not that i had the chance to test the VB technique, but its faster than crytek method which is very fill rate heavy.<br />anyway, here is a short movie that show this simple test i did, enjoy :)<br /><br /><div style="text-align: center;"><iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dwt8n0tWfTdkHougYDvGhoPHFxRw1JsDcEV6BK0VsfwsNK2AC79qPmUgDSu9YRxuTyESGQfzcqqeu6115uivQ' class='b-hbp-video b-uploaded' frameborder='0'></iframe><br /><br /></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com1tag:blogger.com,1999:blog-1096533244660546051.post-22578308936248764502012-03-05T01:36:00.003-08:002012-03-05T01:58:37.223-08:00The First SceneHi all<br /><br />finally i got to the point that i can share some info about the first scene i'v been working on.<br />the scene is an abandon parking place which i designed all by myself.<br />here are few screenshots from the scene:<br /><br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4vP0fAh8ct1CcHxzoZmOd16gXtkHX6FzcL0Vd53k4WxXh8RRPJIxSr6eEDK4J8WnnTzPBGan32ySMZvHKHOMSRYRcJiByx26EvW233INP5sqHGCNlds6A9A0IB3ON_gq84XZV2FBsTOQ/s1600/Test1+2012-03-03+23-09-07-08.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4vP0fAh8ct1CcHxzoZmOd16gXtkHX6FzcL0Vd53k4WxXh8RRPJIxSr6eEDK4J8WnnTzPBGan32ySMZvHKHOMSRYRcJiByx26EvW233INP5sqHGCNlds6A9A0IB3ON_gq84XZV2FBsTOQ/s400/Test1+2012-03-03+23-09-07-08.jpg" alt="" id="BLOGGER_PHOTO_ID_5716345542536960850" border="0" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3iqh989xTWk_OWiALbrPKh4sIEa6NutqaWoGp3U_ALlN4bR5t4KAFk5LjvQO_S9FzflS74T4i9j0A6qIYEhkKoFOjEOuKpIr7yvag6PefHWh_O2AbbNN62cOmSi-3EM2Q6Agqb2tTgXI/s1600/Test1+2012-03-03+23-08-01-09.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3iqh989xTWk_OWiALbrPKh4sIEa6NutqaWoGp3U_ALlN4bR5t4KAFk5LjvQO_S9FzflS74T4i9j0A6qIYEhkKoFOjEOuKpIr7yvag6PefHWh_O2AbbNN62cOmSi-3EM2Q6Agqb2tTgXI/s400/Test1+2012-03-03+23-08-01-09.jpg" alt="" id="BLOGGER_PHOTO_ID_5716345538270407154" border="0" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVZpG_8PfPBMPWK5CHNaTY33g_4CNo2QDtEEgk1P8pYxXE64T28Eb1y3PC78M6VR88BRnOOBQ_449ZiQf8BdiodlVQDzTyqZ4_ecoFHYOtlw9l3grQ7KVuI6vI2lzvjAh_xAmyKORbAKY/s1600/Test1+2012-03-03+23-07-32-95.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVZpG_8PfPBMPWK5CHNaTY33g_4CNo2QDtEEgk1P8pYxXE64T28Eb1y3PC78M6VR88BRnOOBQ_449ZiQf8BdiodlVQDzTyqZ4_ecoFHYOtlw9l3grQ7KVuI6vI2lzvjAh_xAmyKORbAKY/s400/Test1+2012-03-03+23-07-32-95.jpg" alt="" id="BLOGGER_PHOTO_ID_5716345534697640642" border="0" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2s4OUoP0RKFIN_i86SiVYI7Kt2CdtpHgGhsxd2rT4198UvHOLIzk_oh2Py79MqzHavvNTx3panpCZeC-h8CmZ2xao7aCy6kCdAHOBy-H2kedEvKGVvuzkA1AyTRJyw5lRVNHfMMfcIx8/s1600/Test1+2012-03-03+23-10-29-97.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2s4OUoP0RKFIN_i86SiVYI7Kt2CdtpHgGhsxd2rT4198UvHOLIzk_oh2Py79MqzHavvNTx3panpCZeC-h8CmZ2xao7aCy6kCdAHOBy-H2kedEvKGVvuzkA1AyTRJyw5lRVNHfMMfcIx8/s400/Test1+2012-03-03+23-10-29-97.jpg" alt="" id="BLOGGER_PHOTO_ID_5716345546790228082" border="0" /></a>the scene is far from being complete, i need to add more models, fix textures for pipes/flares etc... but i wanted to share it and not keeping it in the dark as last time...<br />for now i'm working on new props to fill the scene with so it won't look too clean/empty.<br /><br />some rendering highlights used (for these who interested):<br />1. hdr<br />2. film tone mapping<br />3. film depth of field<br />4. gamma & color correction<br />5. screen space AA<br />6. sun shafts<br />7. dynamic shadows (from all lights)<br />8. real time GI (color & ambient occlusion)<br />9. light flares<br /><br />i would be glad to hear what do you think...<br />cya until next timeorenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com4tag:blogger.com,1999:blog-1096533244660546051.post-65332855711980865132011-12-28T23:56:00.000-08:002011-12-29T00:35:43.346-08:00Playing Inside Artist World...hi<br />recently i put my time mainly in modeling/texturing etc... so in the post i will talk about the tools and the pipeline i'm using and then i'll show some works i'm working on.<br />the tools i'm using is:<br />1. autodesk 3dsmax 2012, 3d modeling software, for me its the best software... i always liked this program, very easy to understand and control, tons of tutorials more stable version.<br />2. autodesk mudbox 2012, this is a new program i had to learn from scratch, basically its a 3d sculpting and painting app, allows you to create high detail models and paint directly on them.<br />3. adobe photoshop, nothing to say about it, great image editing software.<br />so, the pipeline i'm using now is:<br />1. collect reference pictures, anything i want in my scene i search for real world references from different viewing angles.<br />2. start modeling low poly model using the reference images i collected, yes yes, i know i should start modeling high poly model and then create the low poly one, but i found this technique is a waste of time (for most of the models), and i can add detail later in mudbox/photoshop and believe me you wont even know...<br />3. create uv mapping, well, this is really important, what we really want is to create a uv set the maximize texture space in a way that important parts of the model get bigger area in the texture and at the same time try to make all our uv islands/chinks uniform as much as possible, in simple words, if you put a checker board texture on the model, you should see uniform checkers.<br />4. texturing, for this i'm using both photoshop and mudbox:<br />mudbox used when i don't need pixel perfect alignment and its great as i can see the results immediately, photoshop used when i need to fix things and add extra detail that needs pixel perfect matching...<br /><br />one of the best things in 3dsmax/mudbox/photoshop is that they communicate, in a single click i can send model to mudbox, paint on it, another click to pass the textures to photoshop, fix few things and return to mudbox, the textures in modbox update automatically, and then in another click i update max scene to contain all the changes... really cool stuff, and time saver!<br /><br />another thing that is really cool is that autodesk software can be downloaded for free! yes free!<br />how, well, they have an education program that allow students to enjoy their software, so what you really need to do is to register, fill your education info etc.. and you can download everything for free! really nice...<br />on autodesk site, click solutions-education-students-join...<br /><br />the pipeline described used to create diffuse texture, to create other textures: normal/bump, specular etc... you can also use mudbox and photoshop also, though you can use other app's like: crazybump, shadermap pro, ndo2 etc... great programs.<br />maybe i will post on this next time.<br /><br />now for some works i did recently (simple scene lighting, mudbox capture, without normal/bump/specular maps)<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoUPRUMZO2F4Hl-_OPIJdryh6wbTjZOnyhQYFgOYWUcHpH2QKgXE91A58_AhpoPf18EqVpYr9w2YbmlZW3IQdRx7HTfqkBHGHXq7TbkEpg-na8pSfIX05DO4TNpOZ6Fy26ojQGnXLe6zc/s1600/fusebox.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 304px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoUPRUMZO2F4Hl-_OPIJdryh6wbTjZOnyhQYFgOYWUcHpH2QKgXE91A58_AhpoPf18EqVpYr9w2YbmlZW3IQdRx7HTfqkBHGHXq7TbkEpg-na8pSfIX05DO4TNpOZ6Fy26ojQGnXLe6zc/s400/fusebox.jpg" alt="" id="BLOGGER_PHOTO_ID_5691464435344383938" border="0" /></a></div><div style="text-align: center;">Fuse Box<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit18EX0mzlTkYhx0YuBO1R45FfW6fds6NtgR86qfK-X1UWAzRYKK7ROL-LMoHl26H-fiUS87XifPyUAX6K4pDpx-0A2NkX-ihDniWTugm2myJuijhXwe2Rfny8qOE2OvCf3M8Ah9nVAIE/s1600/trailertire.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 304px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit18EX0mzlTkYhx0YuBO1R45FfW6fds6NtgR86qfK-X1UWAzRYKK7ROL-LMoHl26H-fiUS87XifPyUAX6K4pDpx-0A2NkX-ihDniWTugm2myJuijhXwe2Rfny8qOE2OvCf3M8Ah9nVAIE/s400/trailertire.jpg" alt="" id="BLOGGER_PHOTO_ID_5691464426601503218" border="0" /></a></div><div style="text-align: center;">Trailer Tire<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqmMiWSYkN9lzjwKg0OxyY4LAqhuoYsLwa46Ci75hUjo_T-8P1FMgY1-yzFZE6oXLpgDEuz-JKdryJI3pE8PFwGITxx2njaBhqMj76VK8ABLUyw4hpiSHfPIrs2RZBEd8Z57HGO-ibAgA/s1600/woodpallet.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 304px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqmMiWSYkN9lzjwKg0OxyY4LAqhuoYsLwa46Ci75hUjo_T-8P1FMgY1-yzFZE6oXLpgDEuz-JKdryJI3pE8PFwGITxx2njaBhqMj76VK8ABLUyw4hpiSHfPIrs2RZBEd8Z57HGO-ibAgA/s400/woodpallet.jpg" alt="" id="BLOGGER_PHOTO_ID_5691464423047818674" border="0" /></a></div><div style="text-align: center;">Wood Pallet<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4CuaMicJbIQuMBZPQblBKH1y6TKExofX9Qj1HUgRN_eSOrN1JAquHX7xQjfLuXCHOKv070Zt2LmJseMTacVY76MaDQZ-m9c4Uud2UW1uhaNf_M5f6T1T9rKhb-MMlQjHRDrcVLoTwypw/s1600/barrel.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 304px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4CuaMicJbIQuMBZPQblBKH1y6TKExofX9Qj1HUgRN_eSOrN1JAquHX7xQjfLuXCHOKv070Zt2LmJseMTacVY76MaDQZ-m9c4Uud2UW1uhaNf_M5f6T1T9rKhb-MMlQjHRDrcVLoTwypw/s400/barrel.jpg" alt="" id="BLOGGER_PHOTO_ID_5691464418700502482" border="0" /></a></div><div style="text-align: center;">Barrel<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQUgvxsS-fk6JVkcZFDLAsb3r26C-FOFZkZOFRc90DWCF89xaGoTPMxEylLrZp4Oq6D2RsH5ptRlRCZnWVi9eDJ1Ypt60oA1_6uJbMt-qu1NOMLG3S0AeaouGt_YTbig63libzt5F3zpI/s1600/powerbox.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 304px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQUgvxsS-fk6JVkcZFDLAsb3r26C-FOFZkZOFRc90DWCF89xaGoTPMxEylLrZp4Oq6D2RsH5ptRlRCZnWVi9eDJ1Ypt60oA1_6uJbMt-qu1NOMLG3S0AeaouGt_YTbig63libzt5F3zpI/s400/powerbox.jpg" alt="" id="BLOGGER_PHOTO_ID_5691464439486666722" border="0" /></a></div><div style="text-align: center;">Power Box<br /><br /><div style="text-align: left;">cya until next time...<br /></div></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com1tag:blogger.com,1999:blog-1096533244660546051.post-48323983506573249682011-11-28T04:03:00.000-08:002011-11-28T04:42:01.314-08:00FBX ExporterHi<br />after the last post, i had to create a new plan and the first phase was to support different app's to create assets from.<br /><br />up until now, i use my own maya exporter, which converts models/animations to my own format the engine can read.<br />this exporter was created entirely for the artist as he worked with maya.<br /><br />for the record, i don't know to work with maya, but i know to work with 3dsmax, at the time, i didn't want to handle models/animation and prefer to focus on dev but now i will need to do both.<br /><br />anyway, i decided that an FBX exporter will be good since i know to model/animate with max so i could create few things here and there and in the future i will not bound to a single software, and this is great as finding artist will be much easier if you are not bound to single app.<br /><br />for these who don't know FBX format: FBX is an autodesk format created so you could share works with different autodesk app's like maya, 3dsmax, softimage, motionbuilder, mudbox etc...<br />FBX it comes will full SDK & samples and have fairly readable doc that explain how to use and build FBX app. (can be downloaded from autodesk site)<br /><br />because i already had maya exporter which had all the conversion code to the engine, i just needed to import the fbx and convert everything just like i did with the old exporter, and within few hours i had support for models (no animation).<br /><br />to support animation i had to dig a little bit as at first i tried to convert the matrices imported from the FBX to engine format at import time (left handed Z up) and that didn't went very well, as the hierarchy of the skeleton needed to work with the stored format, even when i succeeded the animation was screw up.<br />so what i did i imported the data as is (not changing/converting anything) and only in the exporting phase (just before writing to a file) i convert to my own engine format.<br />just like i did in the old maya exporter...<br />i burn a lot of hours just to realize that what i did in the old maya exporter was correct, if i just went and look at the old code i could save a lot of time and thinking...<br /><br />after i finishing this i notice few animation didn't running correctly, some vertices isn't moving like they supposed to (relative the the skeleton), and after digging a little more i saw that some code i took from the old exporter wasn't fit right for the new one, and the vertices indices wasn't correct.<br />'vertices indices' means i have for each vertex X indices or more, for vertex position,normal,uv etc.. so these was screw up (the order wasn't correct) and the nasty thing is that for few test models with animation there was no bug at all and for some there was.<br /><br />NOTE: the skeleton always act and looks fine but vertices wasn't, so it was hard to track down the bug.<br />the way i eventually track it is that i created a very simple model with animation and compare each of the vertices weights with the vertices weights exported (using weight table in 3dsmax), when i did that i notice that the weights values was fine but the order wasn't, so few vertices that influence by bone1 was influence by bone2 etc...<br /><br />anyway, one thing to remember from this is that when you take code from some old code of yours make sure to check it fits, and don't assume its good.<br />it can be good/clean code but it doesn't means it fits like a glove...<br /><br />so now that the pipeline works you will see some works on the next posts...<br />cyaorenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com3tag:blogger.com,1999:blog-1096533244660546051.post-82720729977365438392011-10-19T11:24:00.000-07:002011-10-19T12:52:36.087-07:00The Smell of the Money Can Make You Blind...Hi all<br />this time i'v some "bad" news.<br />last post i wrote about a project i'm about to expose, unfortunately this isn't going to happened.<br />i turns out that when "my friend" saw we have some real thing in our hands he smell the money, and that make him do what he did this week.<br />i wont get into details (numbers and stuff), but i feel i need to share what went wrong so if you will be in my position you know what to do.<br /><br />i got to know this guy from a good friend of mine, so i trust my friend that this guy is ok.<br />from day one our working model based on free time only!<br />i gave him X percent for starting, and he began to work on some models, after working for a while, i rise it 1.5X and eventually he got 2X percent, even that the work he did stays the same, average of one model per week! (for the simple ones!, complex ones could get to one month)<br /><br />2 weeks before exposing he told me that he wants more and told me to think very careful about what i'm going to say, so i though and even that there was no good reason to rise it up, i want him to be happy, so i give him another 25% of the 2X he got and told him i want him to sign on a contract i will arrange about everything we agreed on.<br /><br />this week he told me that he doesn't want to continue, talking a little bit with him i realize that he wants 25%+, and he told me that i can't use his models in anyway... for the record, i can use them for non profit use, but i decided that i don't want to, i don't want him to have anything with my projects not now and not ever...<br /><br />after checking out what he actually did in almost 2 years i saw its less than 50 models! including the simplest one (cans, bottles, barrels etc), so giving him 25% is giving him 0.5% per model!<br /><br />so the bottom line of all this little story is:<br />don't trust anyone when doing this kind of thing, make a construct from day one, i did one and gave him but i didn't insist him to sign it, bad mistake.<br />i will be happy to hear what do you think, did i do the right thing? did i handled it correctly?<br /><br />i always knew that money can blind wise peoples, but now i know that even the smell...<br /><br />i will continue to update this blog, hopefully more recent...<br />cyaorenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com5tag:blogger.com,1999:blog-1096533244660546051.post-83856553897263450872011-10-06T01:43:00.000-07:002011-10-06T02:44:04.050-07:00Stay Tuned for the BLAST!hi<br />recently i'm not updating this blog often, the reason is that me and my friend working very hard on a big project and i can't find time to post, every free minute i have i put in the project...<br />if you are curious, here are some Q/A:<br /><br />* so... whats the big project you are working on?<br />well, basically it's a game.<br /><br />* what kind of game?<br />that's will be published soon.<br /><br />* what is so special about this game?<br />feeling! we work hard to make it feel real, in terms of look and feel...<br /><br />* is it going to be a full game?<br />no, for now we will publish one level, to show what we can do.<br /><br />* what engine are you using?<br />internal, for now i named it: OGE (oren game engine)<br /><br />* why didn't you use cry-engine,unreal, unity,ogre, or any other free engines out there?<br />one word: freedom!<br /><br />* can you tell about the engine a little?<br />yes, but this can be a very long answer, so here are few cool things we have:<br /><ul><li> Editor - the engine is just loading and running levels, all logic and gameplay scripted or set by the editor (nothing is hard coded)</li><li> Graphics - real-time GI, HDR, filmic tonemapping and filmic DOF , sun effects, flares unlimited lights and shadows! (every light cast shadow) and more...</li><li> UI - script based dynamic UI system supporting any resolution.</li></ul> * where can i see screenshots, videos?<br />soon i will post screenshots of the project, and talked about few nice things i'v added into.<br /><br />* do you need people to join in?<br />yep, basically we need:<br />art guys - concept, models, textures, animations etc...<br />sound/music guys to do sound effects and music.<br /><span style="font-weight: bold;">so if you know someone, feel free to contact me.</span><br /><br />i'v you have questions you want to ask, feel free...<br />cyaorenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com6tag:blogger.com,1999:blog-1096533244660546051.post-88332746964762720722011-08-15T01:10:00.001-07:002011-08-15T02:14:50.089-07:00Sun Lens Flare
<br />
<br />hi
<br />this time i added sun lens flare effect, if you don't know what i'm talking about, just read about it here
<br /><a href="http://en.wikipedia.org/wiki/Lens_flare">http://en.wikipedia.org/wiki/Lens_flare</a>
<br />
<br />or if you are lazy :) here is a picture shown this effect:
<br />
<br /><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNAMDyFkV2pOzch-DyiakUoxZxwEZB8y6xLWg-vEIsMgUApdzixA28ZnIrh1g50CxYq5BJ0fzCBIN4272biAAMYckBk6TDdXMtlyfKeRqTHoBEV9BPtclBACm-c6EKRglKa3jnW_VfPiA/s1600/flare785.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 290px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNAMDyFkV2pOzch-DyiakUoxZxwEZB8y6xLWg-vEIsMgUApdzixA28ZnIrh1g50CxYq5BJ0fzCBIN4272biAAMYckBk6TDdXMtlyfKeRqTHoBEV9BPtclBACm-c6EKRglKa3jnW_VfPiA/s400/flare785.jpg" alt="" id="BLOGGER_PHOTO_ID_5640995093048616066" border="0" /></a>anyway, to create this effect, what you really need is few things:
<br />1. couple of flare images
<br />2. light position in 2d (screen space)
<br />
<br />1. this is simple, just google on it, and you'll get some nice textures... (you can also use photoshop)
<br />2. take you sun light position and project it into screen space, check z to make sure the light isn't behind the camera.
<br />after you have this 2d pos, you need to create 2d direction vector pointed to the center of the screen, and place the flares from 1 in a different color/sizes along this vector.
<br />that's it.
<br />one thing to note is that flares do not disappear immediately when occluded, they basically stay visible and fade away very nice and smoothly (also when they become visible), thats because these flares created from a very bright light sources.
<br />to achieve this kind of effect, what we really need is a way to count how much the light is occluded.
<br />from this info we can compute a scale factor between [0..1] and scale the lens color so they fade in and out smoothy.
<br />few options to use:
<br />
<br />1. the simplest and naive way is to trace few rays from the light to camera eye and see how many of them passed and then compute scale factor from 0..1
<br />pros: simple to implement.
<br />cons: not accurate, can hurt performance.
<br />
<br />2. texture masking, you render the scene from light point of view to small render target, lets say 16x16 (cleared to white), for every pixel passed you write black, at the end this texture will tell you how much the sun is occluded (the black pixels), to get the result from it, you can lock it out and count for the black/white pixels - not good idea, a better way is to render this texture into 1x1 render target (float point rt, and we will have to use 16x16 vertices for each pixel), we need to enable alpha blending to count the pixels. note that 1 in the 16x16 rt, could be counter for 256 times if all the texture is white (sun isn't occluded), but we need a value between 0..1 to scale the lens color with, so what we output from the ps, is the sampled pixel from the 16x16 rt scaled by 1.0/256.0 (16x16 = 256)
<br />pros: better accuracy.
<br />cons: not easy to implement, need hw float point rt, can hurt performace for big scenes.
<br />
<br />3. use hardware occlusion query, just rendered some simple query mesh (quad,box,sphere) and count how many pixels passed, from this you can compute scale factor between 0..1
<br />note that its a little tricky to use, you need a way to know the maximum pixels for the query mesh so you could compute the [0..1] scale factor, second, they can hurt your performance if isn't used right.
<br />pros: very accurate, performance is very good if done right.
<br />cons: need hw occlusion query support, can be tricky to do right.
<br />
<br />here is a scren shot to show you the effect in action:
<br />
<br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNe1Q4-73vQUm4Ru_a85cZH1qQTu9DdLszSBHzJwwIsScuDO4xjOdFeHYMIYBjejBcoYURK4azfsOIaoaQRsPrGa8SiDsLM5wZ1N2dwAHTLyg5EDNFFFZWajzDhs7zFFstKetZydAm9ow/s1600/LensFlare0.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNe1Q4-73vQUm4Ru_a85cZH1qQTu9DdLszSBHzJwwIsScuDO4xjOdFeHYMIYBjejBcoYURK4azfsOIaoaQRsPrGa8SiDsLM5wZ1N2dwAHTLyg5EDNFFFZWajzDhs7zFFstKetZydAm9ow/s400/LensFlare0.jpg" alt="" id="BLOGGER_PHOTO_ID_5641008026660962066" border="0" /></a>no lens effect
<br />
<br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6akMfu22nipawegtszZNCTtEOc8p52TR_2bqm4IBf6NpT8dPkLpCJupVIWFoigAVrnE8QGSZJraXSdNnbDW1TNAlPXmnI9wyE-x7c5vtsavfzl5D1EjIJGyTtDA5w8TxP89jAmWsp9fM/s1600/LensFlare1.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6akMfu22nipawegtszZNCTtEOc8p52TR_2bqm4IBf6NpT8dPkLpCJupVIWFoigAVrnE8QGSZJraXSdNnbDW1TNAlPXmnI9wyE-x7c5vtsavfzl5D1EjIJGyTtDA5w8TxP89jAmWsp9fM/s400/LensFlare1.jpg" alt="" id="BLOGGER_PHOTO_ID_5641008024104317250" border="0" /></a>with lens effect
<br />
<br /></div>in my implementation i use option 3...
<br />that's it for now, cya until next time ;)
<br />
<br />orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com7tag:blogger.com,1999:blog-1096533244660546051.post-74944766729746299872011-06-12T09:40:00.000-07:002011-06-18T13:16:33.196-07:00Sun Shafts / God Rayshi<br /><br />this time i talk about nice effect called: sun shafts/god rays/sun rays...<br />to save words explaining what it is, i found a nice picture that shows how this effects looks like in reality:<br /><br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHMunziYiv7Rfm3uyNioYn8TtrCGRVxHoDdWRJuth3QFB48kNDmZFuhwD81y-4GLaSXJ2uEv-5azN99dgQk_YIHA2shx5vobbGlJ43lp3KHNOvlC8wRh8u1TgKaMs-g8enLYBHTZYI64g/s1600/fall-forest-with-sun-rays-through-the-trees-thumb8388519.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHMunziYiv7Rfm3uyNioYn8TtrCGRVxHoDdWRJuth3QFB48kNDmZFuhwD81y-4GLaSXJ2uEv-5azN99dgQk_YIHA2shx5vobbGlJ43lp3KHNOvlC8wRh8u1TgKaMs-g8enLYBHTZYI64g/s400/fall-forest-with-sun-rays-through-the-trees-thumb8388519.jpg" alt="" id="BLOGGER_PHOTO_ID_5617375476516367762" border="0" /></a>notice how the sun "enters" between the trees and block by others, this create the light shafts you see in the picture.<br />so how do we going to do this effect in real-time you ask?<br />well, very simple, good old demo scene effect called radial blur as post process effect will do the work (well, with a little help of some Gaussian blur)<br />so the main steps is:<br />1. compute light position in screen space (this is our sun light pos)<br />2. compute radial blur on our image, this is done by blurring the image using normalized pixel to light direction.<br />something like this:<br /><br />blur_dir = (sun_pos_2d - pixel_pos) / NUM_SAMPLES<br />sum = 0<br />for i = 0 to NUM_SAMPLES do<br />{<br />sum += sample(image, uv)<br />uv += blur_dir<br />}<br />return sum / NUM_SAMPLES<br /><br />this is just an example of the radial blur idea, keep in mind that in order to make the effect looks good you need to weight the samples to give you the best look that you are looking for.<br />3. combine both sun shafts result we got in 2, with our original image.<br />thats it.<br />here is some pictures to show the effect in action:<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo35faspYoNPtnzTX8o_HswGw6rLoMP088kkoxYoRymK9eiRWPLNYC77WUItiK7KKZ76Y29oQIMa515Rd-OdrEWrQR5E-4dFIUynMVSK5gAaC1TE0t9WeSvyiCx6-UULept7BoMRdoGR4/s1600/SunShafts_0.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo35faspYoNPtnzTX8o_HswGw6rLoMP088kkoxYoRymK9eiRWPLNYC77WUItiK7KKZ76Y29oQIMa515Rd-OdrEWrQR5E-4dFIUynMVSK5gAaC1TE0t9WeSvyiCx6-UULept7BoMRdoGR4/s400/SunShafts_0.jpg" alt="" id="BLOGGER_PHOTO_ID_5617378511734841810" border="0" /></a>no sun shafts<br /></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg34WO9pD13zweQ1RGmhO83vA-OPa1nVCK59kwz31qEiDMYqBSdeSlL8HZJwPgWLAZU4ygz7jBzpeg84vo9-Ghf6ljlhPU12APHncS1u3QJ9LwAKyq47QrVmPP5l6wU177LY9YcEQtHrkU/s1600/SunShafts_1.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg34WO9pD13zweQ1RGmhO83vA-OPa1nVCK59kwz31qEiDMYqBSdeSlL8HZJwPgWLAZU4ygz7jBzpeg84vo9-Ghf6ljlhPU12APHncS1u3QJ9LwAKyq47QrVmPP5l6wU177LY9YcEQtHrkU/s400/SunShafts_1.jpg" alt="" id="BLOGGER_PHOTO_ID_5617378517467919058" border="0" /></a>with sun shafts<br /><div style="text-align: left;"><br />if you follow exactly by the steps i wrote, you probably need a lot of samples to get nice results, so here is few tips to make the effect fast and smooth:<br />1. try to down sample your image and apply the sun shafts effect on it<br />2. blur the sun shafts result with your favorite blur (should be fast enough)<br />3. because it a post effect, the effect will apply the sun shafts on all the image resulting shafts from none sun light pixels, to overcome this, you should mask out all pixels that shouldn't be effected by the sun shafts effect, techniques to consider:<br />* stencil buffer<br />* depth buffer<br />whatever fits you engine...<br /></div></div>that's it for now, if you have any question, feel free to ask...<br />cya until next timeorenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com3tag:blogger.com,1999:blog-1096533244660546051.post-85624201525984504192011-05-03T05:22:00.000-07:002011-05-03T06:09:09.561-07:00Bitwise Operators on Low End GPU'shi<br />recently i was needed to perform bitwise operators on SM 3, but as you know, SM 3- doesn't support it (only DX10 SM 4.0 and up).<br />if you try to write this line: (hlsl SM 3 for example):<br />some_var & 2<br />you will get error message saying: Bitwise operations not supported on legacy targets.<br />the technique i present here can be used for few more things (lighting, shading etc), but here i will show how to do bitwise ops with it.<br />i support: &, |, ^ (AND,OR,XOR) - more complicated operators could be used but these are the base.<br />the trick is to use a texture to store the results of these operators, and then to sample this texture and get the result.<br />a code to compute this texture will look like this: (assuming 8 bit range for AND op)<br />for i=0 to 255<br />for j=0 to 255<br />texture[i][j] = i & j<br />to maximize storage, encode different operators on different channels.<br />here is a sample texture that encode AND,OR,XOR in different channels:<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1LjChXmoTqw-5IOM2iLzBS3bQS9ghHQfuytmTSax1ktk2BR7hoE6z37hXZxM7EdRMKHV45g3nHRRB07SaC5fOhQZxExWxcM487hwB-HsnqFryVApFK5bsPysYszTI95hIken_W9CH-Rc/s1600/bitwiseop.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 256px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1LjChXmoTqw-5IOM2iLzBS3bQS9ghHQfuytmTSax1ktk2BR7hoE6z37hXZxM7EdRMKHV45g3nHRRB07SaC5fOhQZxExWxcM487hwB-HsnqFryVApFK5bsPysYszTI95hIken_W9CH-Rc/s400/bitwiseop.jpg" alt="" id="BLOGGER_PHOTO_ID_5602472494108247634" border="0" /></a>bitwise operators texture: AND,OR,XOR<br /><br /><div style="text-align: left;">the way you use this texture in your shader looks something like this: (hlsl style)<br />float AND(in float A, in float B)<br />{<br />tex2Dlod(BitwiseOpMap, float4(A, B,0,0)).r;<br />}<br /><br />NOTE: make sure you use POINT sampling, you don't want to filter the results in the texture, you also don't need mipmaps...<br /><br />thats it, i hope you find this post useful...<br />cya until next time ;)<br /></div><div style="text-align: left;"><br /></div></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com2tag:blogger.com,1999:blog-1096533244660546051.post-78473823909656503822011-05-01T10:04:00.000-07:002011-05-01T11:20:19.801-07:00Post Anti-Aliasing #2hi<br />few months ago i'v read an article on intel research group called: Morphological Antialiasing.<br />this technique designed for cpu but with few tricks and hacks we can use it on gpu as well.<br />the algorithm consist of 3 main steps:<br />1. find discontinuities between pixels<br />2. identify predefined patterns<br />3. blend pixels in the neighborhood of the patterns in 2<br />1. simple edge detection on the image, using depth or color differences should do the work, keep in mind that you should encode edge type in you color channels so you could use it in 2, lets say red is horizontal edges, and g is vertical edges.<br />2. this is tricky, you basically need to identify few shapes: Z, U, L<br />see image below (grabbed from original intel article):<br /><img src="file:///C:/Users/ORENK/AppData/Local/Temp/moz-screenshot-5.png" alt="" /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTy1COIhqtbGYAKNqdmFALdpZuEktWuJ5MPisf2x1fvaiTj_N0FUCIoeFhTGRlvGk4Xc68s-Ju4zycxrvGxRf92gPJGMmw9anac0GSTf0CXgfXCQI2PzCw4gRjPrqriwN30YRmEjDyJc8/s1600/MLAAShapes.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 251px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTy1COIhqtbGYAKNqdmFALdpZuEktWuJ5MPisf2x1fvaiTj_N0FUCIoeFhTGRlvGk4Xc68s-Ju4zycxrvGxRf92gPJGMmw9anac0GSTf0CXgfXCQI2PzCw4gRjPrqriwN30YRmEjDyJc8/s400/MLAAShapes.jpg" alt="" id="BLOGGER_PHOTO_ID_5601798309087238066" border="0" /></a><br />Reshetov A. 2009. Morphological Antialiasing. In <em>Proceedings of High Performace Graphics</em></div><br />so based on the article, you only need to identify L shapes, as Z, U can be split into L shapes.<br />for more deep information please refer to the original article that can be found here:<br /><a href="http://visual-computing.intel-research.net/publications/publications.htm#Y2009">http://visual-computing.intel-research.net/publications/publications.htm#Y2009</a><br /><br />to identify L shapes there are few tricks, a simple one is to just follow the edges you mark in 1 and see if you get a match (few loops for each side: left/right/top/bottom and of course branching), if so you compute blend weights for these and continue to the next edges.<br />at the end, you end up with blend weights texture so you could blend the pixel to get the final image, you can use a the trick described in gpu pro 2, they encode the final weights in textures and sample it.<br />btw: if you have ATI HD 6850+ you have built in support for that, so no need to worry, for consoles you may want to worry a little ;)<br /><br />this technique isn't simple to implement as a first shot, i tried few algorithms and techniques before i got this thing working.<br />after seeing the demo from gpu pro 2, i'v got to say i was impressed by the speed of their implementation so i put some tricks into mine as well to get the missing cycles :)<br /><br />optimization tip: when doing edge detection pass, use the stencil buffer to mark these pixels, then in the next step, use the stencil apply your "massive" shapes/blend weights shader only on edges pixels, this way you won't waste power on irrelevant pixels<br /><br />here is a few screenshots of the main steps and result:<br /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguA_NJd1iGFwKBcBklg8QfZqsCUQBwRznacO-jbiccUgTZdxbjsIx6-3yCnsByVnikX0pLiyXGnhosZvmWM8qu2FGaz5n33VumzlwMQyH6SYZR0iH4RZxQShqYcDirCpXCWmLH7KcMzJY/s1600/Edges.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguA_NJd1iGFwKBcBklg8QfZqsCUQBwRznacO-jbiccUgTZdxbjsIx6-3yCnsByVnikX0pLiyXGnhosZvmWM8qu2FGaz5n33VumzlwMQyH6SYZR0iH4RZxQShqYcDirCpXCWmLH7KcMzJY/s400/Edges.png" alt="" id="BLOGGER_PHOTO_ID_5601807806618921474" border="0" /></a>Edges Detection with encoded edge type using image colors<br /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiRF6pT9hK-J2DC4sfy6_2vTnbavC7MiV5U9zZ7KEcptsOF4louByx1ISNIJNBMaX4h0_okXeb49bz7lh9YyVvZxi67rwmTqmpzQj6YGzm64_xr-fTyY0m5jy8c23wRqfZg5HUwI2j93A/s1600/Weights.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiRF6pT9hK-J2DC4sfy6_2vTnbavC7MiV5U9zZ7KEcptsOF4louByx1ISNIJNBMaX4h0_okXeb49bz7lh9YyVvZxi67rwmTqmpzQj6YGzm64_xr-fTyY0m5jy8c23wRqfZg5HUwI2j93A/s400/Weights.png" alt="" id="BLOGGER_PHOTO_ID_5601807811238898370" border="0" /></a>Blend Weights<br /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTEVrSHCgvD_LtzxxtR6_vS0xWMV9ur0qcwq0_B4I2yEU3hy0uhfbeNqfs2KIWbKOVE-kfVKFXgL-MNq5XG1fsA1fu93CZpvL0Zoq9sn2uo9VBKo5MesAU6I3CEQLb4HjFi37koVUKO0E/s1600/NoMLAA.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTEVrSHCgvD_LtzxxtR6_vS0xWMV9ur0qcwq0_B4I2yEU3hy0uhfbeNqfs2KIWbKOVE-kfVKFXgL-MNq5XG1fsA1fu93CZpvL0Zoq9sn2uo9VBKo5MesAU6I3CEQLb4HjFi37koVUKO0E/s400/NoMLAA.png" alt="" id="BLOGGER_PHOTO_ID_5601807820045535922" border="0" /></a>Without MLAA<br /></div></div><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsPU-4SYbQkK023arViV0F2oUQVsdV9wh_aNS1qEWf5Q6HvxVNCX1dPmT55iXPwSZxvsAEcKiE1e-ZYMhl8_mh31nFQAvGscNMSbOxJbv5MP5xAEYr9NvzVZiFPuLACfC7r7qg_hpC38c/s1600/WithMLAA.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsPU-4SYbQkK023arViV0F2oUQVsdV9wh_aNS1qEWf5Q6HvxVNCX1dPmT55iXPwSZxvsAEcKiE1e-ZYMhl8_mh31nFQAvGscNMSbOxJbv5MP5xAEYr9NvzVZiFPuLACfC7r7qg_hpC38c/s400/WithMLAA.png" alt="" id="BLOGGER_PHOTO_ID_5601807828891769762" border="0" /></a>With MLAA<br /></div><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkzCdstiyHFDoItijcdiVV7-e5OxsjmejfVGJLA5B5E6rib_8aPPQYKwjMYXo8uMFrOo3Ts2et3TCInqJFkShv_xG_KgsKv2gg3PnNnXEv6MmLB_vi7BHY32oSwfk71blIh4MMXiEgcSk/s1600/ZoomNoMLAA.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 256px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkzCdstiyHFDoItijcdiVV7-e5OxsjmejfVGJLA5B5E6rib_8aPPQYKwjMYXo8uMFrOo3Ts2et3TCInqJFkShv_xG_KgsKv2gg3PnNnXEv6MmLB_vi7BHY32oSwfk71blIh4MMXiEgcSk/s400/ZoomNoMLAA.png" alt="" id="BLOGGER_PHOTO_ID_5601808819036653890" border="0" /></a>Without MLAA<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMU_UrgXzsylhpKefHCbyuqFT1gRem9sJDaElos2AjoYVuiDbpPn52PqEjZCayn3Ja7-JQKFKmbewvMGj9-1CpgMyE9bkABzfqhMc4RIfAgpnaMAv2bPI_mVmw-fwHKG4XlApf1hN78Ck/s1600/ZoomWithMLAA.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 256px; height: 256px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMU_UrgXzsylhpKefHCbyuqFT1gRem9sJDaElos2AjoYVuiDbpPn52PqEjZCayn3Ja7-JQKFKmbewvMGj9-1CpgMyE9bkABzfqhMc4RIfAgpnaMAv2bPI_mVmw-fwHKG4XlApf1hN78Ck/s400/ZoomWithMLAA.png" alt="" id="BLOGGER_PHOTO_ID_5601808813362868274" border="0" /></a>With MLAA<br /></div><br />as you can see, this technique have very good result.<br />extra: few other techniques you should check:<br />* GPAA - show it at humus<br />* FXAA - nvidia sdk 11 (looks pretty good)<br /><br />cya until next time...orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-10334604863419302852011-03-20T11:31:00.000-07:002011-03-20T12:07:39.642-07:00Adding Vegetationhi<br />one of the thing i always wanted to add is vegetation, tree, weeds, grass etc...<br />in a nutshell, to support all kind of vegetation you need to have few things:<br />1. some app to generate the content, plant model, textures etc.<br />2. engine supporting geometry instancing.<br />3. extra (depends of scene size), engine supporting model level of detail (LOD)<br />4. extra (depends of scene size), engine supporting good outdoor culling.<br />1. this is very critical, having great app for generating plants is a must, if the model and textures isn't quality enough, the best code won't do much... i checked some apps, and i want to tell you that if you have some $, speedtree is the way to go, checked it, love it...<br />2. if you are going to render plants, you won't render one tree with 1x1 meter of grass, you probably want to spread it all over a 1x1 km terrain, so you are going to render hundreds of the same plant with different properties or such, so you don't want to kill your gpu with 20000 draw calls... unless real time performance isn't an issue for you. <br />for me performance is critical so i'v implemented instancing support for each plant type.<br />3. if your scene is large enough you need to consider LOD support, there is not need to render full plant geometry from certain distance, you probably won't notice if its real geometry or simple billboard, but your gpu will, so consider replacing you full model with low model or even quad when distance to eye pos is large enough.<br />i added auto lod support in the engine and use it also for plants (maybe i will post on it next time)<br />4. if your scene is large enough and you have massive amount of plants, so you already know that its a good idea to cull your data.<br /><br />anther thing, because we are using instancing on the same model again and again, its a better idea to break symmetry when rendering the plants.<br />you can place them with different rotation and apply random motion for each plant (in shader).<br />here is a screenshot of a test scene:<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigTo_L1K1bSolfuamKfRkkQchKySoYKlXIBIh628c8vfm3XFYudqJLWjQzwTGcmd2dsZExevULPOiw8-FS685a9eDuQNhI24s8wyPN3BswXtJZXv9l9-y59_CMNnH91QNg8Ax3oG8Bh-g/s1600/Vegetation.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigTo_L1K1bSolfuamKfRkkQchKySoYKlXIBIh628c8vfm3XFYudqJLWjQzwTGcmd2dsZExevULPOiw8-FS685a9eDuQNhI24s8wyPN3BswXtJZXv9l9-y59_CMNnH91QNg8Ax3oG8Bh-g/s400/Vegetation.jpg" alt="" id="BLOGGER_PHOTO_ID_5586238855149183186" border="0" /></a>vegetation, sun shafts and dynamic atmosphere<br /><br /></div>cya until next time...orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com2tag:blogger.com,1999:blog-1096533244660546051.post-84195763116399971552011-01-30T03:56:00.000-08:002011-01-30T05:22:17.523-08:00Lens Effect / Bokeh - Getting Into Detailshi<br />last time i talked about lens effect/bokeh, this time i talk about how to do it using FFT with information of how to implement it on the GPU.<br />i will not get into the theory of FFT, if you want to, check out this:<br /><a href="http://en.wikipedia.org/wiki/Fast_Fourier_transform">http://en.wikipedia.org/wiki/Fast_Fourier_transform</a><br /><br />what i will explain here is how to do image processing using FFT and how to achieve a lens effects/bokeh filter.<br />if we have an image and we apply FFT on it we get this image in something called frequency domain.<br />after applying FFT every pixel in the image have its own frequency in the frequency domain that compose of a real and imaginary parts (a complex number)<br />after getting the image in the frequency domain, all we have to do is to decide which frequencies we want to "filter" out and then, apply the inverse FFT to get back to our image domain again, without the "filtered pixels"<br />that's the main idea.<br /><br />nice thing with FFT is that its separable, what this means is that to apply FFT in 2D, we can simply apply 2 1D FFT, the first one goes on the rows (horizontal) and the second one goes on the columns (vertical) of the result.<br />another thing to know is that transforming N points can be done with two N/2 transforms, that is a dived and conquer approach, which helps to reuse computations.<br />so knowing that, we will use a divide and conquer algorithm called butterflies:<br />more info can be found here:<br /><a href="http://en.wikipedia.org/wiki/Butterfly_diagram">http://en.wikipedia.org/wiki/Butterfly_diagram</a><br /><a href="http://www.cmlab.csie.ntu.edu.tw/cml/dsp/training/coding/transform/fft.html">http://www.cmlab.csie.ntu.edu.tw/cml/dsp/training/coding/transform/fft.html</a><br /><br />you can see really nice diagrams which helps to understand how it is works and how we can create and encode indices and weights for doing FFT on the GPU using textures and ping/pong method.<br /><br />so if for example we have N=8 points to transform, we have log2(8) =3 steps of butterflies to perform, beginning with computation on four 2 points DFT, then two 4 points DFT and finally one 8 points DFT.<br /><br />so, assuming you understand what the butterfly does, the steps to do it on the GPU is a matter of doing those steps:<br />1. create 2 textures (render targets) used for the ping/pong operations, those needed to be with high precision float point because the pixel on the frequency domain is a complex number with greater range than the pixel in the image spatial domain.<br />2. encode indices & weights into texture (also high precision)<br />3. do log2(Width) horizontal butterflies steps (using RT's from 1 and bf from 2)<br />4. do log2(Height) vertical butterflies steps (using RT's from 1 and bf from 2) on the result from 3<br />lets call those steps GPFFT<br />note: the log2 in steps 3,4 - this needs your image to with power of two size.<br />so how all of this nasty things helps us to do image processing on an image? and where is the bokeh stuff?<br />so here is the beauty:<br />suppose we have 2 images, one of them is our kernal, lets call it K, and the other is our source image that we wish to apply the effect on, lets call it I<br />apply GPFFT on K,I (transform them into frequency domain), multiply them together (complex multiply, remember we are using complex number in this domain), and then apply inverse GPFFT (to inverse transform the result) on the result to get a new I' convolved with K.<br />and that's it, all it matter is how your K looks like (the size and shape: triangle, square, octagon etc) and whats I.<br />as for bokeh/lens effect, basically it is working on bright pixels so simply filter the brighter pixels from your image with some threshold into other image (this is your I) and do the process on it.<br />this method works on low systems, DX9 with MRT support.<br />we can optimize the algorithm a lot using DX11 compute shader and get rid of the log(N) passes of steps 3,4 and perform only on pass each.<br />hope this post didn't make you headache' i'm starting to get one ;P<br />that's it for now<br />cya next time...orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-70041365124211349822011-01-04T13:56:00.000-08:002011-01-04T15:01:08.321-08:00Lens Effect / Bokehhi<br />this time i'm attacking a problem related to lens blur effect or bokeh.<br />as you know (or don't) real time app such as games mimic lens effects with blur filters that applied on some image (scaled or not, depending or the app)<br />until now, blur could be done with few methods/filters such as gaussian, poisson disk, bilateral and etc depending on the problem you want to solve.<br />for example:<br />1. Gaussian could be used for blurring image that need a smooth look, like lighting and such...<br />2. Poisson disk blur could be used to smooth shadow mapping as it faster than 1 and basically produces nice result.<br />3. Bilateral blur could be for smoothing SSAO, because it can take into account few vars (like normal, depth) when doing the blur and reduce bleeding.<br />ok, those methods used until now and rely on samples count.<br />more samples means nicer result but takes a lot of power and most of the time it doesn't really worth it...<br />what we really need is a filter that doesn't rely on the kernal/filter size and mimic real camera lens effects without killing our app and can achieve this:<br /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAI1qCnSqXnI00jInfLEzPMm8q8rPLfmOLdP11J2PcUuf5yp5FV4qhgMvGwSJIXWpwdJBRaWCqNy_DgCq6kSdkDIX9F2fFb8lwqTv11-DMw0NKeKY2jVQk68v4veY6-QTjmQCsoodb8mQ/s1600/Josefina_with_Bokeh.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 267px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAI1qCnSqXnI00jInfLEzPMm8q8rPLfmOLdP11J2PcUuf5yp5FV4qhgMvGwSJIXWpwdJBRaWCqNy_DgCq6kSdkDIX9F2fFb8lwqTv11-DMw0NKeKY2jVQk68v4veY6-QTjmQCsoodb8mQ/s400/Josefina_with_Bokeh.jpg" alt="" id="BLOGGER_PHOTO_ID_5558460781936596610" border="0" /></a>image taken from wiki under 'bokeh'<br />Coarse bokeh on a photo shot with an 85mm lens and 70mm aperture, which corresponds to f/1.2<br /><br /><div style="text-align: left;">the circle shapes is what we need to achieve! (or any other shape we want).<br />how we get this in reality: when we use smaller f in our camera, out of focus areas/points blurred into polygonal shape formed by the aperture blades.<br /></div></div>somebody did this in real time or what? yes, Futuremark group in their new 3dmark 2011 benchmark (the underwater demo... amazing stuff...) and i think me 8p<br />lets see screenshots:<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsqeZhrL_Jn3bc1UAbDr60FkyEyJTYLXuyhK1UW8ZtEmzzv0HGiTxsHbPm9XUJV-MnKWEfN5-0eL_axytm2e-rQMvx0YOMT5kq5WycdXcMGrezZCWs1_k8jo1CJlFFNWy7bnHktERm1wU/s1600/Bokeh_0.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 400px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsqeZhrL_Jn3bc1UAbDr60FkyEyJTYLXuyhK1UW8ZtEmzzv0HGiTxsHbPm9XUJV-MnKWEfN5-0eL_axytm2e-rQMvx0YOMT5kq5WycdXcMGrezZCWs1_k8jo1CJlFFNWy7bnHktERm1wU/s400/Bokeh_0.jpg" alt="" id="BLOGGER_PHOTO_ID_5558464122175231298" border="0" /></a>original image<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyrlbDhxZmf7WLxmVFacQgraQbPZCmTaj6xcFHQZRBgysHZJKdPomW0YWm7MeJ560v6jC-7knIFF-ksUF9W9HspvFLHU30UiwKVZnv2wC4RWPa9OjLA0FwPih-s0a2cE7gMcSgIXApuEk/s1600/Bokeh_1.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 400px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyrlbDhxZmf7WLxmVFacQgraQbPZCmTaj6xcFHQZRBgysHZJKdPomW0YWm7MeJ560v6jC-7knIFF-ksUF9W9HspvFLHU30UiwKVZnv2wC4RWPa9OjLA0FwPih-s0a2cE7gMcSgIXApuEk/s400/Bokeh_1.jpg" alt="" id="BLOGGER_PHOTO_ID_5558464122903685186" border="0" /></a>increase filter size<br /><br /></div><div style="text-align: center;"><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQuVwVKNYh7Ul4nNniUBKDGDsu0lYyNh_11tIRvgLMQ3GHJZCdhucFxmpTomONDd2o2wu3f29RBagiiZwq-7m49qeB_fW3T6LdD6uW2HIrYYZO_z21_Fy1avJnDaWXTylTekQjAFXIfrc/s1600/Bokeh_2.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 400px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQuVwVKNYh7Ul4nNniUBKDGDsu0lYyNh_11tIRvgLMQ3GHJZCdhucFxmpTomONDd2o2wu3f29RBagiiZwq-7m49qeB_fW3T6LdD6uW2HIrYYZO_z21_Fy1avJnDaWXTylTekQjAFXIfrc/s400/Bokeh_2.jpg" alt="" id="BLOGGER_PHOTO_ID_5558464116885689170" border="0" /></a>and here is the hexagon shape...<br />note that any shape could be done with no cost!<br /></div></div><br />and a video...<br /><br /><div style="text-align: center;"><iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dwvBFF_fLpLAFu_aAh32VbEFygP5oVe4Zaqgq1_js9X-svLkSIYWOBW1lsMNNL9KBj-ZAhR4rqbk4IiXEy1-A' class='b-hbp-video b-uploaded' frameborder='0'></iframe><br /><br />real time video of lens effect / bokeh<br /><br /><div style="text-align: left;">with the new gpu's features and dx11 we can do it in real time, right?<br />well... yes, but we don't really need dx11 or 10... ;p<br /></div><div style="text-align: left;"> what we really need the heavy duty guns! Fast Fourier Transform or FFT in short...<br />cya until next time...<br /><br /></div></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com4tag:blogger.com,1999:blog-1096533244660546051.post-58960329953366069552010-12-02T12:35:00.000-08:002010-12-02T13:24:50.377-08:00Deferred Iterative Parallax Mappinghi<br />the title name is a "bomb" but its nothing too fancy...<br />just added parallax mapping using iterative scheme, this method uses few iterations of parallax mapping in order to get more accuracy.<br />for those who doesn't familiar with parallax mapping, here is a short description:<br />1. you need two texture maps: height, normal map<br />2. start from current texcoord used to sample your diffuse map (for example) and offset it by the height value (scaled and biased) of the current pixel in the direction you view direction (in texture/tangent space)<br />3. sample your diffuse map with the new texcoord.<br />iterative parallax mapping does just like that, but for X iteration, every iteration tries to move one step closer to more accurate solution.<br />don't get me wrong, you are not going to get better solution than a ray traced methods (depends on you viewing angle, at some angles you can't even tell the difference), but this method cost almost nothing, especially if you can save your height map values in normal map alpha channel.<br />also num iteration can be changed depending on surface properties and such.<br />here is screenshots thats shows it in action using deferred method:<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQEla39qjeheF82YPo8nCXlrF_qnoltkPWlv86J5qZk5oftvYdFOB2th7h4BUoBeJZb8xISnj_IawFAUI5vTl6IQBFKfroMPjE3JJ7HUcAs83s28Fe-6bB8fOdvJgIzzsd864sF041kwM/s1600/Parallax_0.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 294px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQEla39qjeheF82YPo8nCXlrF_qnoltkPWlv86J5qZk5oftvYdFOB2th7h4BUoBeJZb8xISnj_IawFAUI5vTl6IQBFKfroMPjE3JJ7HUcAs83s28Fe-6bB8fOdvJgIzzsd864sF041kwM/s400/Parallax_0.jpg" alt="" id="BLOGGER_PHOTO_ID_5546192654501845442" border="0" /></a>without parallax<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOd5rEyIHpY01LiYpyoNCP3b9V7sQ7oAe7BqcIUxPaRcvaWYUUqxFkuqRw68zlF8BzEGVHTRGKJuY4ERicaVQsvZ4zxH4Ispsl5RrVn7Xa4SuD8Sq_RKUxS-ivM8751KsQlINJ_4OLF64/s1600/Parallax_1.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 294px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOd5rEyIHpY01LiYpyoNCP3b9V7sQ7oAe7BqcIUxPaRcvaWYUUqxFkuqRw68zlF8BzEGVHTRGKJuY4ERicaVQsvZ4zxH4Ispsl5RrVn7Xa4SuD8Sq_RKUxS-ivM8751KsQlINJ_4OLF64/s400/Parallax_1.jpg" alt="" id="BLOGGER_PHOTO_ID_5546192649401926146" border="0" /></a>with parallax (4 iterations)<br /><br /></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-67983650756538479592010-10-27T02:55:00.000-07:002010-10-28T01:26:19.972-07:00OIT - Order Independent Transparency #3<div style="text-align: left;">hi<br /></div>recently i needed to do OIT in DX9 HW and as you know (from my previous posts), i don't have the same access i have in DX11 (i can't create linked list per pixel and do the sorting after), so what i can do is simple depth peeling...<br />few words about depth peeling: depth peeling works by peel geometry with specific depth value, so to create OIT we can peel geometry starting from the nearest depth (to the camera eye) going to the farthest depth, each step we peel few pixels and store them to in separate RT, then we composite those RT's in back to front order to achieve the right transparency order effect.<br />so how do we implement that?<br />well, from what we can see we need color RT to store the result, also a depth buffer so we could compare pixels depth against, we also need a "second" depth buffer so we could reject pixels that already peeled/visited.<br />1. color RT supported by DX9 and upper<br />2. first depth buffer, also supported but...<br />3. second depth buffer, not supported but...<br />so we have issues with 2,3, to implement pixel depth compression we need to have the ability to pass depth buffer into the pixel shader so we could do the compare ourselves so we could reject already peeled/visited pixels, BUT DX9 doesn't even let us bind depth buffer as texture (even if i'm not writing to it - can be done in DX10, but we need DX9), so we need a way to emulate depth buffer that can be bind as texture and act as depth buffer.<br />to do this we can use float point RT, for the OIT we will use 2 float point RT, the first one used for first pass, second for the second pass, then the first again and so on, this is our ping/pong depth RT's.<br />the reason we need this kind of ping/pong RT's is to peel the correct layer every pass.<br />for example:<br />to peel the first layer we need empty depth buffer, the we render and store it to our color RT<br />to peel the second layer, we need to use the depth buffer from the first pass, so we could ignore the pixels handled at the first layer<br />to peel the third layer, we need to use the depth buffer from the second pass, so we could ignore the pixels handled at the second layer (and first layer)<br />and so on... you can see that we don't need more then 2 depth buffer to manage all those passes.<br />ok, so now we can peel layers with our depth buffer RT's, but how can do OIT for more than 8 layers? (we can only bind 8/16 texture), well here comes the reverse depth peeling (RDP) technique, instead of peeling in front to back order, peel with back to front order, so every time you peel one layer you can immediately composite it to the back buffer, so only one color buffer needed.<br />total memory needed could be one of those:<br />1. 3 RT's, two 32 bit float point and one RGBA<br />2. 2 RT's, one 32 bit float point for both depth buffer, and one RGBA<br />NOTE: in deferred rendering you can get rid of the RGBA buffer.<br />so as you can see, total memory is very low.<br />after all the talking, here comes a video that shows RDP in action:<br /><br /><div style="text-align: center;"><iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dxy1XaYMhARY6EYhK2weoCKcvXWqlaNtUKNpb8eaanIK0K-h8uLHPV0y0nbBHxUERRt9wGCkCzhTnDO3Wgqeg' class='b-hbp-video b-uploaded' frameborder='0'></iframe><br /><br />simple planes shows the idea, this model doesn't need per pixel sorting but it shows that the algorithm works well.<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiqHkvcLEwgtxFmwzLYRLuCOkMSiKJEcQ9pGlYjUXPgeOZTH3KokI9pJn1Qorx2yaGWZcDYG4AlDVUgWHwY25Im6cTzKmwYMEv0H1v6Ut3uZRrBYZ9Hm3T6mCwFCeFcrymsDlOnIN6rxE/s1600/OIT_DX9_1.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 299px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiqHkvcLEwgtxFmwzLYRLuCOkMSiKJEcQ9pGlYjUXPgeOZTH3KokI9pJn1Qorx2yaGWZcDYG4AlDVUgWHwY25Im6cTzKmwYMEv0H1v6Ut3uZRrBYZ9Hm3T6mCwFCeFcrymsDlOnIN6rxE/s400/OIT_DX9_1.jpg" alt="" id="BLOGGER_PHOTO_ID_5533009447947528418" border="0" /></a>Teapot model - needs per pixel sorting<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKt5ScXPfvldmx3906_5p_fLQ35QHKUMVgZWxphw57RMZzxSgmznOwz-qFlK8r_0AJzYgEE8GLDeh1tKG0F_czpx1fgIu_EPh89lu0NhL4y4kBoG5KXat-5QyIyfJ8fbNt47I75fUSkEU/s1600/OIT_DX9_2.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 299px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKt5ScXPfvldmx3906_5p_fLQ35QHKUMVgZWxphw57RMZzxSgmznOwz-qFlK8r_0AJzYgEE8GLDeh1tKG0F_czpx1fgIu_EPh89lu0NhL4y4kBoG5KXat-5QyIyfJ8fbNt47I75fUSkEU/s400/OIT_DX9_2.jpg" alt="" id="BLOGGER_PHOTO_ID_5533009448406722242" border="0" /></a><br /></div></div><div style="text-align: left;">NOTE: technique implemented in render monkey, the video shows very simple mesh containing 8 planes so it will be easy to see the effect.<br />each peeled layer render with small alpha value, so you can see how layers blended when you see through all layers (you get the white color)<br />some performance info: RM window 1272x856 ATI 5850 - 270+ FPS<br />thats it for now, cya...<br /></div></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com8tag:blogger.com,1999:blog-1096533244660546051.post-5151850804993077022010-10-10T10:49:00.000-07:002010-10-10T11:15:00.138-07:00Post Anti-Aliasinghi<br />recently i'v added few post effects and i thought i need some AA solution to remove those jaggy edges.<br />traditional AA solution have its quality, no questions but it have some drawbacks:<br />1. deferred or semi deferred need special care and will need DX10+.<br />2. needs more memory<br />3. eat gpu power<br />i guess there is more but this is enough for me to consider some other solution, not the same quality but better than none.<br />so what i did is pretty simple:<br />1. run edge detection<br />2. run post AA which samples 4 pixels and use the value from 1 to know if its an edge or not, if its an edge i output the filtered pixel, if not i output none filtered pixel.<br />the heart of the algorithm is 1, what i did is taking few neighbors pixels and check for a big change in their depths/normals (for normals i check angles, for depth i check the gradients from center pixel)<br />again, very simple but i think it does the work, very fast and its generic for xbox,ps3,pc...<br />here is few screenshots that shows you the process<br /><br /><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJbahTWWRHDJDRuarJ0CIJgTSWpL85zhOP6i1HRRF_hx8RvQrC9XqUvDV3yj8LsMN5cE7BfmX0UXPzUDFa_koqVD9tcMPutuuUWgM05jsE8GsAw6vj5lDVLAd13Khu42proCqkzzr-sYs/s1600/PostAA_0.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJbahTWWRHDJDRuarJ0CIJgTSWpL85zhOP6i1HRRF_hx8RvQrC9XqUvDV3yj8LsMN5cE7BfmX0UXPzUDFa_koqVD9tcMPutuuUWgM05jsE8GsAw6vj5lDVLAd13Khu42proCqkzzr-sYs/s400/PostAA_0.png" alt="" id="BLOGGER_PHOTO_ID_5526480922092708322" border="0" /></a>Without Post AA<br /><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7evF5rYwiJ1THLbaHORh4UeZGtF0oPYlsFs1OleL1QlTw1f-C-QZ7aLiNx3RlQyJ2elZ0NiOgZ9GieZm90bObSkIVRWHyMSOgyANrN_jeVINLgtEEUZ4YAP-GplY3LyTBoclNsd-HfSc/s1600/PostAA_1.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7evF5rYwiJ1THLbaHORh4UeZGtF0oPYlsFs1OleL1QlTw1f-C-QZ7aLiNx3RlQyJ2elZ0NiOgZ9GieZm90bObSkIVRWHyMSOgyANrN_jeVINLgtEEUZ4YAP-GplY3LyTBoclNsd-HfSc/s400/PostAA_1.png" alt="" id="BLOGGER_PHOTO_ID_5526480898177897010" border="0" /></a>Edge Detection<br /></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixtB-ikZTYyb0ocQiMBiEvc5fG5eYK95p43wlP-r4IJU0ES8qkNKhPfLWDd9Wnx7wKwA0nURzydjjpwnZugJ8fjHzG5-bslvdC0Lqh-OqvWttNTUwSsZkn-_HvKd1-3rUoMphmVQlZ-b4/s1600/PostAA_2.png"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixtB-ikZTYyb0ocQiMBiEvc5fG5eYK95p43wlP-r4IJU0ES8qkNKhPfLWDd9Wnx7wKwA0nURzydjjpwnZugJ8fjHzG5-bslvdC0Lqh-OqvWttNTUwSsZkn-_HvKd1-3rUoMphmVQlZ-b4/s400/PostAA_2.png" alt="" id="BLOGGER_PHOTO_ID_5526480874358848066" border="0" /></a>With Post AA<br /></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com0tag:blogger.com,1999:blog-1096533244660546051.post-9624778216817335022010-09-10T09:48:00.001-07:002010-09-10T10:10:02.804-07:00Deferred Decalshi<br />this time i improved my decals system.<br />one of the things that make decals looks real is the way it interact with the environment lighting and how it clipped against the world geometry...<br />the old decals system has good clipping but it was rendered using a forward rendering, so it didn't interact with environment lights/shadows which look very strange when you put decals in a dark room with small candle light.<br />another thing is, decals on dynamic entities, which need to take into account fast clipping against those entities.<br />to fix problem 1, i replaced the forward renderer into a deferred one, which rendered the decals into two render targets (using MRT support), one rt for diffuse color and the other for normals, then in the rendering pass i blend the diffuse/normal with surfaces diffuse/normals to get the final image.<br />to fix the second one, i change the way i create collision data, each object in the scene that needs collision detection keeps handle to collision tree which used to get the needed data when doing clipping, collisions etc...<br />that's it for now, i think the result are pretty good...<br />here is a screen shots that show it in action:<br /><br /><br /><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm2J4Xz5EGH8v68vPe8rNygnRWKO1EolUz-oAlpX_vzMNceEUmPQzrJzN-QCLPz2uog790Vtp2SqNUaS1ADFSgXz-2H9iM4V5EwIDVR0640ni2stGBTRtLwMBEvO6Pmrjk3IyVIWmK8ac/s1600/DeferredDecals_0.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm2J4Xz5EGH8v68vPe8rNygnRWKO1EolUz-oAlpX_vzMNceEUmPQzrJzN-QCLPz2uog790Vtp2SqNUaS1ADFSgXz-2H9iM4V5EwIDVR0640ni2stGBTRtLwMBEvO6Pmrjk3IyVIWmK8ac/s400/DeferredDecals_0.jpg" alt="" id="BLOGGER_PHOTO_ID_5515329337937835314" border="0" /></a>wall rendered without decal on it<br />the small picture in the top left shows diffuse term of lighting<br /><br /></div><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMbp6hRp8tbeQ3oc5tY6p7nsM9q7DHYolXXJltCs_EM1_f0p2sYWeQk3x67_Ttc_ZafPT_MWlnlJv5ETxxCGh-xjC62sKqYYa73K8LfrK3_KR9qu9Qb-G-sh9QFfwyohgDKO7jA_gdVm0/s1600/DeferredDecals_1.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMbp6hRp8tbeQ3oc5tY6p7nsM9q7DHYolXXJltCs_EM1_f0p2sYWeQk3x67_Ttc_ZafPT_MWlnlJv5ETxxCGh-xjC62sKqYYa73K8LfrK3_KR9qu9Qb-G-sh9QFfwyohgDKO7jA_gdVm0/s400/DeferredDecals_1.jpg" alt="" id="BLOGGER_PHOTO_ID_5515329342922061106" border="0" /></a>wall rendered with decal on it<br />notice the bump map generated from the decal normals<br /><br /></div><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8uVkgRKcmYhch_v96D_teaSuyQ9r61UPC02ma5c8fleSC8asP8b6JWAE39vJJ7P2S4KYYwHIxQJaquhxWjGm1sjfzsAEJYjum6DrgOYkuEoHtasInik20GXcOaaVOGM2rnMTQj3H-_wQ/s1600/DeferredDecals_2.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8uVkgRKcmYhch_v96D_teaSuyQ9r61UPC02ma5c8fleSC8asP8b6JWAE39vJJ7P2S4KYYwHIxQJaquhxWjGm1sjfzsAEJYjum6DrgOYkuEoHtasInik20GXcOaaVOGM2rnMTQj3H-_wQ/s400/DeferredDecals_2.jpg" alt="" id="BLOGGER_PHOTO_ID_5515332185174973090" border="0" /></a>physical entity rendered without decal on it<br /><br /></div><div style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc-LL5wT_B4aOOXKOqqpba9oLS8LmFx7XwfbkHzL9-WXUuHVnDdlpzXY3f5Qi_Gsp1H8miHUTunWTBTc5SJTuEJsQbAhyphenhyphenZNn9tccIyh_IJg4dqfuwP5Fp2senveR_XpSf7qVrqCATRiro/s1600/DeferredDecals_3.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc-LL5wT_B4aOOXKOqqpba9oLS8LmFx7XwfbkHzL9-WXUuHVnDdlpzXY3f5Qi_Gsp1H8miHUTunWTBTc5SJTuEJsQbAhyphenhyphenZNn9tccIyh_IJg4dqfuwP5Fp2senveR_XpSf7qVrqCATRiro/s400/DeferredDecals_3.jpg" alt="" id="BLOGGER_PHOTO_ID_5515332187733753282" border="0" /></a>physical entity rendered with decal on it<br />note that when i "shot" the decal on the box, i apply impulse on the box so it moves a little<br /><br /></div>orenk2khttp://www.blogger.com/profile/17368325567494358231noreply@blogger.com2