An attempt to simulate an out-of-focus depth of field effect based on a depth map, plus a demonstration for the possibility to create blurs with smoothly increasing radius in Flash.
A depth map is a greyscale image which shows the distance of each pixel to the camera - white pixels are close, black pixels are far away (at least in my experiment, in other applications it may be the other way round). The depth map for this one looks like this:
Usually depth maps can be generated by 3D-Applications as an extra for a rendered scene, but as I used a normal photo I quickly drew the map manually with a few simple gradients. That's why it's not really exact, but it is good enough.
I'm not yet 100% satisfied with the outcome - as you will see there is a problem with the figure in front when she is out of focus - her body is blurred, but her outline stays sharp. The reason is that the depth map says that the area around her is actually behind her and is in focus - in reality her outline would be blurry and semi-transparent so you could see through the sharp background. To work around that I'd probably have to use a pixel-by-pixel solution which I fear might become too slow.
So here we go, just point the mouse to the area that should be in focus. I've added a few sliders so you can play with the depth of the focussed area and the length of the transition from sharp to blurry.Posted at September 10, 2005 03:08 PM | Further reading