Rendering Models With Transparency

For the current project I am working on, I need image icons for each pet in the game. I previously was trying to use ViewportFrames, but since they do not properly render Neon, I cannot use them. Now, I need to find a way to photograph/render every pet in the game while maintaining proper transparency with a transparent background. I cannot use 3D modeling software to do this, as that would not properly render the Neon effect.

Initially, I was thinking about doing a sort of “green screen” and then turning green to alpha (transparency). But, if the pet has any green, the final image would have incorrect transparency. I cannot think of any other strategy for generating a render, so how should I go about doing this? Is there a better way?

Here is an example of one of the pets:
image

3 Likes

Is it not possible to recreate the “neon” effect? I’d imagine Blender and Cinema4D are advanced enough to try to get what you want.

You can use another neon colour. Blue is commonly used if green isn’t an option.

The way Roblox handles Neon with the bloom is fairly unique, and this still would not allow for us to include particles in the renders.

Some of the pets in our game have rainbow textures on them, so it sadly isn’t that simple.

I know Bubble Gum Simulator has been able to pull this off, so there has got to be a way to do this:
image

1 Like

The bubble gum simulator doesn’t look like it uses ViewportFrame, the rendering is way too nice for a ViewportFrame.

Based on the post ViewportFrame release, it has been mentioned that neon does still render on the lowest quality.

The only workaround I can think of are to add blurry layer to recreate the neon effect, or if you still want to use “green screen”, but changed to blue or red, as long as it’s contrast to the object. The limitation is that it will have hard time to properly render your cute rainbow creature.

1 Like

Neon in a ViewportFrame versus Neon in the Workspace look very different:
image
This is mainly due to Neon not carrying the “LightEmission” property when rendered in ViewportFrames.

Odds are this is the only way to do what I am wanting. ;(

Question:

Answer:

To my understanding, you need an image transparent, although the sprite itself to not be transparent. So, render it without transparency and maybe create a new mesh with transparency?

Question:

Answer:

Take everything one step at a time. Photograph it with/without transparency and render it in the game with/without transparency (whatever your goal is).


Other info:

It may be because of the fact it was imported as .fbx, because you may need .obj to texture this.
.obj comes in handy in some situations because .fbx is for textures, editing the model is easier with .obj.
Maybe insert the decal/texture onto the object, and then try to go neon with it.

After some testing, I came up with a solution! I needed to take 3 separate photos, each with a different component color and a background color being the component color’s inverse:

R Screenshot_1 G Screenshot_2 B Screenshot_3

I then loaded each photo into GIMP (image processing software) and converted the inverse color to alpha:

Screenshot_4 > Screenshot_5

At this point, it was just a matter of setting up the merge mode to be “Addition” for each layer and merging them all together! Here was the result:

Untitled

Thanks for the help guys!

3 Likes

Happy to help, I’m always here if you need something if you have a weird problem like this.

1 Like