Gamasutra: The Art & Business of Making Gamesspacer
View All     RSS
September 30, 2014
arrowPress Releases
September 30, 2014
PR Newswire
View All





If you enjoy reading this site, you might also want to check out these UBM Tech sites:


 
Lovers in a Dangerous Spacetime 2.5D Rendering Challenges
by Jamie Tucker on 02/04/14 12:08:00 pm   Featured Blogs

The following blog post, unless otherwise noted, was written by a member of Gamasutra’s community.
The thoughts and opinions expressed are those of the writer and not Gamasutra or its parent company.

 

gif_jellymaya

Following up on Matt's last devlog, I'm going to wrap up our character creation process by discussing how we are rendering the characters in Lovers in a Dangerous Spacetime. Warning: It's very Unity-y.

When creating the assets in Maya, we typically use multiple quads that are each skinned to the animated rig. If we were to import this model directly into Unity, we would get just that – each quad would have it's own Skinned Mesh Renderer and would account for 1 draw call individually. With this method, we would be looking at between 20 - 40 draw calls per character on screen. Additionally, for our game we needed to be able to use the Unity callback OnBecameVisible/OnBecameInVisible, which uses the GameObject's Mesh Renderer to test camera visibility. Since a character would be made of many meshes, there was no single mesh we could use the callback to check on.

Our solution was simple. In Maya, we would combine all the quads into a single mesh and that would solve all of our problems.

diffuse
Here is the JellyBomber with the default Transparent/Diffuse shader.

As you can see, that is not exactly the result we wanted. Unity isn't properly Z-sorting on the vertices within the mesh, so quads are being drawn on top of each other in the wrong order. But lo! Unity provides another shader just for this: Transparent/Cutout/Diffuse. 

cutout

Unfortunately, this also fails to give us the desired look because it cuts off anything that doesn't have an alpha value higher than the cutoff value. A major contributing factor to the look of our game is the bloom around each object. We accomplish this by 'baking' it into our textures in Photoshop, so we don't want our shader's discarding the semi-transparent bloom.

bloom
Dat bloom!

What we need is a multi-pass shader that combines both of these qualities to properly render our single mesh characters. We want the first pass to sort the geometry, and the second pass to render the bloom. I made a little shader that accomplishes this, which you can get here.

shader

shader-code

It is a very basic vertex-lit shader I implemented using just shaderlab syntax.
In the first pass, "Alphatest Greater [_Cutoff]" only renders pixels with an alpha value greater than the Alpha Cutoff (which can be set between 0 - 0.9). This covers our opaque pixels, and Z-sorts them properly.
In the second pass, we set "ZWrite Off" as well as set "ZTest Less".
These settings make sure that the transparent bloom isn't culled by any other transparent quad in the mesh by preventing them from being written to the Z-buffer. Finally we set "Blend SrcAlpha OneMinusSrcAlpha" which is what makes the texture transparent.

jelly_adjustment
Adjusting the Alpha cutoff amount

Now we are finally able to achieve the look that we want for our characters using a single mesh.

2pass

Caveats:
This is just the way we are rendering our models, it may not make sense for you, and if you know a better way, we'd love it if you shared it below.
This shader uses Alphatest, which is very not-optimized when used on iOS/Android hardware, for some complicated reasons (I think it has something to do with the Tiled Rendering Pipeline). However, since we're focusing on PC/Mac, this shader does the job for our game.

Updated:
Thanks to Joel below for the suggestion, and @trialbyfun on twitter for pointing us to this, but you can in fact control the indexes of the vertices and how the quads will sort by selecting and combining the geometry in Maya from back to front. This will work for some of our geometry but our more complex characters have animations that move in the Z-axis which means that they still need this shader to dynamically sort.
Thanks for the help!

Additional reading:
Unity Shader reference

Original Post:
http://www.asteroidbase.com/devlog/6-2-5d-rendering-challenges/


Related Jobs

Cryptic Studios
Cryptic Studios — Los Gatos, California, United States
[09.30.14]

Senior Client Engineer
Arkane Studios
Arkane Studios — Austin, Texas, United States
[09.30.14]

Lead Technical Engineer
Avalanche Studios
Avalanche Studios — New York, New York, United States
[09.30.14]

Technical Artist
Jintronix
Jintronix — Montreal, Quebec, Canada
[09.30.14]

Game Developer at fast-growing healthcare technology startup






Comments


Ian Morrison
profile image
That's a clever trick to get around transparent sorting issues! I remember doing something similar in UDK, where we'd put alpha-cutoff duplicate geometry behind transparent meshes to set the Z values before the transparent stuff was rendered, but this is a much nicer approach!

Thanks for sharing!

Joel Bitar
profile image
If you've got always-screen-facing objects like that and you want to simply alpha blend without getting into any shader stuff, just make sure the polygon indexes in the combined mesh are in the "correct" order to be rendered back to front.

For instance in maya if you combine a number of planes it will build the new mesh in the same order you selected the planes. So just select them back-to-front and then combine.

Jamie Tucker
profile image
Thanks Joel, someone else sent us that tidbit via Twitter, but it won't quite work for all of our characters since we are also animating in the Z-plane, changing the order of quads dynamically.

But we will combine them better from now on for things that don't need to have complex animations, so we can save the gpu work.

Willy Hwang
profile image
Thank you! That is super-helpful for what I'm working on now.

It's funny, when I google search for [maya combine meshes back to front z sort] the first three results are related to this article. Google-famous!


none
 
Comment: