Crying Suns VFX #3 — The Glass Before The Void
This is the third entry in the series around the visual effects of our narrative roguelite game Crying Suns and, as the game is released on Nintendo Switch, how we designed them. You can read the first two parts here and here.
In the second part, we discussed space in all its glory. Now is the time to talk about what prevents you, the player, the Admiral of the Fleet, from being sucked out of your command center and drifting into the vastness for eternity: that thin and fragile sheet of glass before the void.
Invisible Yet So Important
It is so thin that you almost can’t see it. But without it, you’re dead. How to represent something so vital but at the same time something you should not see, something that should not prevent you from contemplating the beauty of space?
The answer is not trivial and once more the balance between art direction and realism has to be subtle. However, in this case we will have some help from our diegetic user interface. Indeed, the glass panel holds most of the UI, as some kind of massive head-up display. While preparing your next move in the command center, your controls are drawn between your characters and the rest of the game world.
The user interface is not always visible though, notably while traveling from one planet or system to another. And in those occurrences, the glass panel has to remain perceptible. We decided to gift it with some physical yet stylized properties of real glass: glare and reflection.
The Importance of Light
Just as for the “space haze”, we relied on light to make our glass panel shine. First stop: the glare.
Even if it serves as a display for our user interface, the glass panel is not a typical screen and, as light comes through, we could not produce a glare effect similar to the one you can experience with your own computer monitor. However, stars have an important place in our game and we ended up with a half-halo half-glare effect that helps grounding the glass panel and understanding the actual movement in space during interplanetary travels.
This is basically a screen-space effect relative to the position of the current star. The further away from the screen-space position of the star (simulating a grazing light), the grayer the glass becomes. And as we only consider the center of the star, with its light radiating around it, the effect produces a round shape on the glass panel. The rest consists of a subtle mix of gradient interpolations and careful blending.
A Reflection on Life
To create a mirror, you need a sheet of glass and some reflecting coating (generally some kind of silver nitrate compound) on the back. But in the end, it is the combination of all those elements that creates the perfect inverted illusions. The glass in itself is partially reflective. And it is especially true with bright light sources, like the many stars of Crying Suns.
As light bounces off the characters, it also bounces off the glass panel, revealing subtle silhouettes of the inhabitants of the command center. Obviously, all of this matches the animation of the characters and it grounds the glass panel into the world. However, as there is no “back face” assets (or front face actually) for our characters, the silhouettes are only approximated color shapes.
This effect requires a preparatory render pass in order to get the shape of the characters in a render texture, that is then slightly scaled-down and injected in the glass shader to produce the actual stylized reflection. In the next part of the series, we will discuss the other steps we apply to the characters in order to emphasize the influence of the stars on the command center.
Shader Time
Here is the multi-pass shader used to produce the glass panel (without the user interface which is renderer in another pass):
