PDA

View Full Version : [Request] How implement this effect



sesillabubu
15-05-2011, 10:23 PM
Hi all,

How can i implement this effect? I have one first start image. In three time, with alpha mask?!!! i would clear the part of image and see the second image is behind.

First start image
http://imageshack.us/photo/my-images/233/17977135.gif/

First pass
http://imageshack.us/photo/my-images/829/98425113.gif/

Seconda pass
http://imageshack.us/photo/my-images/8/41703609.gif/

Thirth pass
http://imageshack.us/photo/my-images/96/84931006.gif/

Thanks
Sesilla

WILL
16-05-2011, 02:34 AM
Yes, it would be an 'alpha mask' that you would use to do this effect. You could do this in one of 2 ways.

1) draw your 'original' image on top of the resulting image. Then gradually modify the alpha channel of the original (top) image changing it's alpha channel from fully visible to fully transparent.

2) draw the resulting on top of the original, but then make your resulting image's alpha channel completely transparent BEFORE you start drawing. Then you would gradually modify the alpha channel of the resulting (top) image making it fully visible instead of fully transparent where you want the effect to reveal your resulting image.

BOTH require manipulation of the alpha channel of one of your textures and BOTH require you to draw both images one on top of the other.

My personal thoughts; Option 2 might be a bit more work to get it setup, as you'll have to change an entire texture's alpha channel from it's image data before you can begin the effect. With Option 1, you already have your textures' alpha channels as you need them and just need to start modifying the areas where your effect will take place.

To modify the alpha channel of the TOP image, you can do it procedurally, but you may find it easier to make your own 'brush' of sorts. Pop open Photoshop or GIMP, or whatever else you use, and create your image there.

As for the code, I'll leave that for other more talented folks to get into for you. You'll want to do this in OpenGL or Direct3D, I'm quite sure. A software-based API will be too slow for this effect to look nice.

Hope this helps. It should at least give you an idea of how to get started. :)

Dan
16-05-2011, 06:04 AM
It's very easy to make this effect using shaders, that is if you are using D3D or OGL.
It's also possible to make a usable real time implementation of this effect in software but only for small resolutions.

virtual
16-05-2011, 06:54 AM
Dan , this is really cool effect , if you don't mind could u post the source code ?

code_glitch
16-05-2011, 06:58 AM
Source would be nice in order to compile for linux... Wine seems to throw some major errors up :(

Dan
16-05-2011, 09:46 AM
here's the code for Gen2 version (Delphi) and an identical software implementation (Lazarus). code_glitch, the sample that I posted earlier uses Gen2 engine which is Direct3D/Windows only, you can however compile the software version. the source for the gen2 version will not be very useful without the engine itself, you can get it from here: http://code.google.com/p/gen2gdk/

code_glitch
16-05-2011, 03:24 PM
Ah... Darn... I might have a look at that code and consider writing an OpenGL alternative or something short in a cross platform lib.

virtual
16-05-2011, 05:44 PM
thanks , can be a cool transition between 2 levels

User137
17-05-2011, 09:59 AM
1) draw your 'original' image on top of the resulting image. Then gradually modify the alpha channel of the original (top) image changing it's alpha channel from fully visible to fully transparent.
...
BOTH require manipulation of the alpha channel of one of your textures and BOTH require you to draw both images one on top of the other.

Just want to clarify the option 1) way from OpenGL point of view (and you didn't mention which graphics engine or API you use). As this does not requre modification of textures alpha channel. In simplest form glColor4f(R,G,B,A) can be used to fade 1 image into another.

For more advanced looking fades one can for example split the image in a "thick" (realistically about 100x100, or more if you want detail at cost of efficiency) grid and draw a triangle_strip with vertexarray. Each vertex index can then have unique alpha color, and modified with mathematical formulas.

wagenheimer
17-05-2011, 10:31 AM
Very Cool Effect!!

farcodev
28-05-2011, 04:38 AM
yeah, i concur