Rendering against a transparent background with shadows

About Truespace Archives

These pages are a copy of the official truespace forums prior to their removal somewhere around 2011.

They are retained here for archive purposes only.

Rendering against a transparent background with shadows // Archive: Tech Forum

1  |  

Post by miru // Aug 29, 2006, 7:13am

miru
Total Posts: 3
Hi,


I am desperately searching for a way to render objects on a transparent background including the shadow it casts. I already tried with the shadow catcher shader but on rendering I always see the background color. I also tried to set the background to a fully transparent bitmap but no way, I always get some color in the back. I need to have those objects as layers in photoshop later and the best would be to have the shadow on a separat layer. (Yes I also tried to render into a photoshop file with a layer for shadow, but then I get somehow usable alpha channel, but have to do all the masking and deleting of the unuseful background on my own, not funny on animations...)

So any hint? I would really appreciate some help.


miru

Post by spacekdet // Aug 29, 2006, 7:54am

spacekdet
Total Posts: 1360
pic
Try rendering to a 32 bit TGA file.

Post by TomG // Aug 29, 2006, 8:31am

TomG
Total Posts: 3397
Not sure on what is being asked here.


You say a "transparent background" but not sure what you mean by that - you say you always see the "background color" but then you always will, there has to be some color in all parts of the image when rendered.


I suggest a shadow catcher - not the in-built one, I've never got that working well - I would use my one in ShaderLab :) I always found mine more controllable, personally:

http://www.tmgcgart.com/ShaderLab/html/shader_listing_1.htm#Catcher


What I would do is render with a solid background color, plane to catch the shadow. You will get an image with the solid background color and the shadow overlaid onto that (with adjustments to the shadow catcher settings).


You will NOT get an alpha channel - since there is an object there (the shadow catching plane), then it registers as being rendered at that point, and as being "something there", so no alpha. This would prevent a 32 bit TGA from working in this case.


However since the background color is solid, you can use it as a mask in a video editing application, just like a "green screen". That should work in such a way that the mask can "fade" so the shadow blends in onto whatever is in the background.


Now - also depends on what you are aiming to do. If composite, why not just play the video you are compositing into as a background in trueSpace, and so do the compositing all at once? Background image = video, shadow catcher plane, object, render to sequence of still frames for your output, and you get the composite done in one step, no need for an external application or selecting masks etc.


If you are doing something else.... well, do let us know :) Depending on why you want and need this, there may be other solutions.



HTH!

Tom

Post by miru // Aug 29, 2006, 11:24am

miru
Total Posts: 3
Thanks Tom for that fast answer, I will try to explain a bit better what I really need to do. I am in GUI design for virtual music instruments and this means that I have to render a lot of single objects like knobs, faders, buttons, potentiometers and stuff like that, that are used in many different places later on an software interface. Inside my GUI design environment (it's a proprietary software) I have the possibility to use a sequence of pngs to integrate animations. So normally I am rendering eg. a potentiometer with 64 frames for a rotation of 270 degrees and put it into one of my layers of my control widget. Since there’s a build-in soft shadow feature I can often live with a pseudo shadow that uses just the alpha channel of the pngs to create a shadow, a bit like the layer effect in photoshop. Sometimes though this method is not accurate enough and more realism is wanted. Especially when a knob is not only some simple cylinder-like object. In my GUI designer app I have the possibility to use up to 8 layers which means that the knob animation can be one of them and the rotating shadow could be another one just lying underneath.

So what I basically need is a sequence of pngs of my knob and its shadow and transparency all around. The shadow can be rendered into the knob animation or better could be a completely different shadow animation layer. Do you see any chance to render this kind of pictures? Btw. I am using TS 7.11.

Post by TomG // Aug 29, 2006, 11:58am

TomG
Total Posts: 3397
That's a really interesting project! If you want to share any screen grabs, it would be fun to have a look at what you've been creating :)


As for the solution, I am sure there will be many options. Compositing in tS clearly isn't a good one though.


My first thought is you mention you have layers in the application, so it sounds like you can render just the control (eg knob, slider) with no shadow as one layer. This would be easy, just ensure you have nothing in the background and render to 32 bit TGA (or PNG maybe, or PSD, you can always batch convert anyway using Photoshop or similar). This will give you the object, plus a channel that crops it out of the background for use in the layers.


The layer below that should then just be the shadow, and this is a trickier bit. tS will render an objects alpha to PNG, for instance, and the more transparent the object is, the more transparency is in the alpha channel in the PNG.


However, shadow catchers are reflectance shaders, and use Transmission and not Transparency, and Transmission is not written out to the alpha channel.


So my first suggestion is to use the Invisible shader, which will make your object invisible but leave it casting shadows (or you can paint the object fully transparent, but turn of transparent shadows in the light source, which will also make it invisible but create the shadow still).


Ensure the lighting will cause a grey scale shadow, and simply use the greyscale shadow as an alpha channel.


That would mean making the alpha channel in the image separately based on the intensity, but a batch process (macro in Photoshop for instance) should be able to do that for you (eg Select Color Range would generate a selection based on intensity, then you can make that into a layer mask or alpha channel).


So :


1. render object (eg knob) with no object behind it, and to 32 bit, to get solid masked version.


2. Then render with object made invisible but still casting shadows (eg Invisible http://www.tmgcgart.com/ShaderLab/html/shader_listing_3.htm ) and set up a plane with regular textures to catch the shadows (no need to use a catcher though) and set up the lighting to ensure the shadows range properly so that an unshadowed area is 1 (pure white) and get as dark as you want them to be (0 for completely solid, ie black, or greyscale for partial transparency).


3. Run a macro in batch that will create an alpha channel in the shadow PNG images, by using the intensity of the image.


4. Then use those results, with the object PNGs on the top layer, the shadows underneath.




Alternatively, maybe the code in the app can be changed so that a shadow layer can be added, where it reads the intensity itself and sets the blending itself (rather than use the alpha information in the image). That would cut out some steps, but may not be an option.


Probably other ideas out there too :)


HTH!

Tom

Post by miru // Aug 30, 2006, 11:16am

miru
Total Posts: 3
Thank you Tom, for your detailed explanation.

Finally I made it the way you described it. I rendered the knob first with nothing behind, which gives me a correct object with a its alpha channel.

Then I painted the knob completely transparent and rendered everything again, this time with a simple colored plane behind. (I didn’t know that an object can be transparent and still cast shadows, so that was very helpful.) It was a bit tricky to get a light setting hat is produced the
wanted shadow without having to much color shadings on the background but I made it.

Then I had to do some steps in of photoshop to extract the shadow, downsize it etc. but the result was ok. Fortunately one can record macros and batch-process them, otherwise this would really be a torture.

Still it costs some time to process all the frames and if there’s something not perfect you have to do it all again… . Wouldn’t it be a good idea to add such a feature to the render engine in TS? I read that poser can render objects on a transparent background, so technically there should be a solution ;-)

If you want to see some results of my creative work you can go to the Digidesign website and check out the GUIs I recently made for our virtual instruments Strike, Xpand! and Hybrid.

http://www.digidesign.com/index.cfm?navid=32&langid=100&itemid=4863

http://www.digidesign.com/index.cfm?navid=32&langid=100&itemid=4784

http://www.digidesign.com/index.cfm?navid=71&langid=100&itemid=4952

Hope you like it

regards

Post by Chester Desmond // Aug 30, 2006, 11:44am

Chester Desmond
Total Posts: 323
Nice job!..that's something I've always wanted to get into- skinning vsts - are you the graphics person for digidesign?

Post by TomG // Aug 30, 2006, 12:00pm

TomG
Total Posts: 3397
Those are awesome, very nicely done! I hope you are entering the "Most Interesting Caligari Project" with those? We'll be releasing more info on that soon, though it's open for submissions already if you want to get in early (or at least prepare what you'll send in).


You'll find the contest in our last newsletter :

http://www.caligari.com/news/news_july2006/newsletter.html


Of course this is a reminder to everyone about the contest, do get your entries sent in :)


Anyway, these look fantastic, I like the materials, and the designs, just the sort of look I like. Thanks for sharing!


And maybe this topic will uncover easier and quicker ways to get this end result too, as there are often several solutions to the same problem.


Thanks!

Tom
Awportals.com is a privately held community resource website dedicated to Active Worlds.
Copyright (c) Mark Randall 2006 - 2021. All Rights Reserved.
Awportals.com   ·   ProLibraries Live   ·   Twitter   ·   LinkedIn