Based on the optimized anaglyph display mode from the stereoscopic player, I developed a Pixelbender filter that can be used inside of Photoshop, Adobe After Effects, and Flash. Using the filter is very straight forward and extremely fast. You can now create optimized anaglyph images in Photoshop, Videos in After Effects and even realtime games in Flash.
DOWNLOAD : optimized_anaglyph_filter.zip
- Parallel processing The filter runs efficiently on different GPU and CPU architectures, including multi-core and multiprocessor systems. It delivers excellent image processing performance in Adobe products.
- Supports all bit-depths The filter runs in 8-bit/16-bit/32-bit within the application.
VIDEOTUTORIAL! See it in action in a very well done videotutorial by Stefan Voigt. He goes the long way to make sure you actually understand the principles behind optimized anaglyph: stereoscopic-session-01-basics
USE IN AFTER EFFECTS
copy the optimized_anaglyph_AE.pbk to …\Adobe After Effects CS4\Support FIles\Plug-ins\Effects
The effect will appear inside the stereo3d category under effects. Apply it to your left eye compostion and choose the right eye composition from the drop-down list. You can adjust (and animate) the red to green mapping, the red to blue mapping and gamma.
WARNING: Pretty much all codecs use chroma subsambling in their compression routine which is very hurtful to the 3D-effect. Chroma subsampling works by compressing color information stronger than brightness information. This is a great technique since it goes by unnoticed by the viewer. Unfortunately anaglyph images store depth information in the color and in this case compression will be noticed. I still haven’t found a codec that is good for compressing anaglyph video. If you find one please tell me. I believe MP4 high 4:4:4 could be the answer.
USE IN FLASH
The filter can be either implemented with flex or loaded via URLRequest. It’s a good practice to place a movie Clip for the right eye on your stage and a movie clip of same size for the left eye above it. Apply “optimized_anaglyph.pbj” as blendmode shader. For each element in one movieclip create a corresponding one inside the other. The offset in x will define the depth.
// declare some variables
var urlRequest:URLRequest = new URLRequest( "optimized_anaglyph_FLASH.pbj" );
var urlLoader:URLLoader = new URLLoader();
var left_container_mc:MovieClip = new MovieClip();
var right_container_mc:MovieClip = new MovieClip();
public function main () :void
urlLoader.dataFormat = URLLoaderDataFormat.BINARY;
urlLoader.addEventListener( Event.COMPLETE, init );
urlLoader.load( urlRequest );
function init( event:Event ):void
urlLoader.removeEventListener( Event.COMPLETE, init );
shader = new Shader( event.target.data );
left_container_mc.blendShader = shader;
left_container_mc.blendMode = BlendMode.SHADER;
You probably can use it in combination with a 3dengine inside of flash. If you input bitmapdatas instead of using a Blendmode shader, update the shader inputs each frame by reassigning them.
private function loop(e:Event):void //on enter frame event
target_mc.filters.shader.data.right.input = source_bmp;
target_mc.filters = [ shaderFilter ];
USE IN PHOTOSHOP
1) Install the Pixelbender Photoshop Plug-In from adobe’s website (scroll all the way down): http://www.adobe.com/devnet/pixelbender/ .You can find installation instructions in the release notes.
2) Place the optimized_anaglyph_PS.pbk file inside the \Adobe Photoshop CS4\Pixel Bender Files\ folder. Next time you start Photoshop the Filter will be available (along with a couple of others).
To make it work you need to have a side-by-side stereo image. Left image should be for the left eye and right image for the right eye, but you can have it swapped and use the invert option of the filter later. The next important step is to define the single image width which is usually half the size of your entire image. This step is necessary because the filter has no awareness of the image size. Defining the imagesize manually comes with the benefit, that you can adjust your imageplane interactively. When you’re done press apply and crop your image.
You can find a lot of sample images to play with at the flickr X-View group http://www.flickr.com/groups/62553512@N00/pool/ . All of those images need invert checked to look properly.
Have Fun and enjoy