Can you take 'screenshot' with transparent background?

When I do screenshots of my tools I just turn of anti-aliasing because the blurred edges won’t be cut correctly.
It will be uneven and miscolored if you try to cut it out with smooth edges. But it looks much better with antialiasing and I wonder if there’s any way of generating such an image with transparent background?

You could put a camera inside a model, name it ThumbnailCamera, then upload the model, wait up to 10 hours for image to approve and THEN copy the image generated.

But is there a hack way of getting this image without having to upload and wait for the image to be approved?

5 Likes

I take the image really close to the camera so it’s like 1200p. Then I cut background and such & downscale to 200p or so and it hides most if not all of the artifacts.

5 Likes

If you have Photoshop you could search up a greenscreen tutorial and use that (with a green-screened screenshot of course).

Not sure how great it’ll look, but I don’t think it’ll look bad.

how about just making a quick render of the model in blender with transparent background?
FH

it would be cool if roblox added a feature like that though, not sure if a quicker way to do it exists atm

3 Likes

Cubic scaling… URGH

When it comes to scaling, that’s horrible. It will take forever to open everything in blender and render it, let-alone upload it to Roblox.

@EmeraldSlash I have tried that with Paint.NET and there are always noticeable artifacts. I really wish it were that simple :frowning:

I do it in photoshop / illustrator and it works well for me. Maybe try that?

It’s actually not as complicated as you might think, you can do it using alpha masks. Here’s an example of how I would do it.

Here’s a scene that I have, it’s fairly simple. I am going to extract the observation tower from it.

I start by removing all objects that I do not want to appear in my scene so that just the observation tower is left.

Then I add a white skybox to my scene which will serve as the transparent section of the mask.

After that, I disable global shadows, set the ambient to 0, 0, 0 and the brightness to 0. The black section will remain visible in my image.

Then using the following plugin in Paint.NET I can apply the mask to the original image.

Which then results in the following image.

You can often achieve better results by reducing your alpha mask slightly (to remove artifacts).

36 Likes

I suppose it’s time consuming but the result is often well worth it.

1 Like

This is actually genius - thank you!

2 Likes

I give up on my search. Urgh!

At some point last year I swear I remember seeing @ScriptOn complain about chromakey’ing assets and cropping them for decals. Someone posted a Python script to automate this process in photoshop and I used it a lot until losing my data in a power surge. Perhaps someone else can find it?

It was some time around this twitter post.

I made a feature request for this: Take Screenshots In-Game and Display Them In-Game

If they added a whitelist of items to render in those screenshots, you could take screenshots of anything with transparent backgrounds with no hassle.

Green screen is the worst method I know. You’d always have green things left, or mess around with the threshold, but eventually eat away innocent Pixels.

This one is a better method. Can you take 'screenshot' with transparent background? - #8 by woot3

Same way in the Source Engine for Source Filmmaker scenes.

 

The more clearer but restricted way, is to use ViewportFrame and a Protected Method called ViewportFrame:CaptureSnapshotAsync

You’d first have to do something to Studio to access that method. I am not satisfied with the Viewport Method though.

This was the output:

 

Has no white lines
image

But it has pixels around it that I am unhappy with, and there’s no better Lighting. You can increase the image and all that, but compared to Studio’s actual viewport, it’s not so great.

 

CaptureSnapshotAsync creates a snapshot of the selected Viewport and creates a rbxtemp:// Temporary Asset, but that function itself only returns the String to the Asset.

It doesn’t return a File class, so I had to figure out another way to export this Binary Content.

 

To do that, I created a Dummy Part and a Decal with the temporary Asset ID, and then I exported it as a .obj which will give me the image of the Decal.

There’s white outlines around the Viewport Frame, because I removed the BackgroundColor of the Viewport Frame, the white outlines don’t seem to get captured by the Snapshot function, it seems to be some other visual bug that has existed for ages.

This here is the dummy part I used to export the image.

 

The best method is ThumbnailGenerator. It surpresses the Lighting’s Sky and can even define a Alpha, then uses G3D to output an image. That’s actually how Thumbnails apparently work. Unfortunately this Service is not built-in into Studio…

1 Like