Simonschreibt.

I didn’t embed the video directly to avoid any tracking from Google and complications with the DSGVO.

Alpha1-Materials only support 1 Bit color depth for transparency which means you can either see a pixel or you can not. You can NOT have half-transparent pixels like with Materials/Shaders supporting 8 Bit color depth (Alpha8):

So Alpha1 stuff is boring? Not at all! OK, most often you’ll see it in cases like here where a tile-able Alpha1-texture of netting wire is mapped on some polygons.

Source: Fallout 4

Looks good until you see it from narrow angles where you can notice the actual flatness.

Source: Fallout 4

We Germans call this “Maschen-Draht-Zaun” and there was a very popular song about such a fence which accourding to Wikipedia sold on CD approx. 800.000 times!

For today I collected five creative use cases for Alpha1! If you don’t think so or know even more awesome stuff, let me know!

With a second layer in your shader/model you can add crisp detail like here on this Mirelurk:

Source: Fallout 4

Or add detail to my beloved stone edges which I wrote about in the past:

Source: Fallout 3

And here is a nice example of a layer on top of the geometry which creates some extra motion (I don’t know exactly how it’s done but it looks at least “Alpha1-ish”):

From what I saw they use a texture for both: the base geometry and the moving layer on top (which might be an extra geometry OR both could be be mixed in one shader):

Source: Fallout 4

Interesting: The alpha channel of that texture gets “threshold-ed” (more about this later) and defines which parts of the texture are visible regarding the moving layer. I did a small test with a modified alpha channel like this…

Source: Fallout 4

…and this is the result:

You can clearly see that only a small portion of my smooth “blobs” in the alpha channel are actually used. Zooming in you can clearly see hard edges which let me think of a hard Alpha1 cutout:

Source: Fallout 4

Like I said: I don’t know if it’s two geometries or just one shader, but here you can see the separate layers:

We’ve some basic trade-offs in game art when it comes to detail:

Source: Fallout 4

• Left: Modelling all detail costs a lot polygons but looks great
• Middle: Saving polygons is good for the performance but makes stuff look angled
• Right: Using Alpha1-Planes adds great details – until you look from a wrong angle

But by combining standard geometry with alpha-planes it’s possible to hide some problem zones. I really like the broken planks on these houses which add a great amount of details:

Source: Fallout 4

Unfortunately you can see the “trick” pretty clear by looking at them from above:

Source: Fallout 4

But it’s still interesting that they stack planes over planes and somehow avoid any z-Fighting:

My guess is that they have priorities assigned to the different materials so that the renderer knows what comes first.

Some artists might not know, but the BMP file format supports an alpha channel!

Now an example which I like even more. Do you see what’s going on here?

Source: Fallout 4

They use Alpha1-Planes to make the holes look round but in addition add some low-poly geometry to give the object thickness.

Yes, you can see low-poly edges at the backside but the general impression is great in my eyes.

At a closer look you’ll notice that in most games barrels aren’t perfectly round. This holds true for Fallout 4 (look at the center of the barrel) but what’s that? The front looks very round!

Source: Fallout 4

They hide the 14-poly-cylinder-angularity with a plane containing a round alpha1-shape. Might not be breathtaking but at least I saw something like this the first time.

Also interesting: They don’t cap the ends like you usually would expect. They use Alpha1-planes which saves some polygons and since all parts use Alpha1-materials (the walls have holes) there’s only one material/shader necessary.

Source: Fallout 4

I’m not sure if this creates too much overdraw or if you can early discard the fragments for the “invisible” pixels but at least it’s an interesting approach.

You may think: If we can only show or don’t show a pixel with an Alpha1-Shader then there shouldn’t be a need for grey values! That’s not true because of two reasons.

First let’s look at the alpha channels below which “should” give the same results:

From distance they result in very similar outcome:

But at a closer look you can see a great difference in quality:

The reason is the texture filtering which happens on the graphic card. Both textures get up-scaled and filtered when you see them big on your screen:

Then a threshold is used to define which of the grey values will be “completely white” and which “totally black”. As you see, the texture with Anti-Aliasing/grey values is better “smoothed” during the filter process and finally results in a rounder Alpha1 mask:

That’s why grey values can help even if the texture is only used for “binary” Alpha1.

The second reason is even more interesting because you can use the threshold for creating great effects if you have grey values in your alpha channel!

For example in Firewatch they use the threshold to make trees in the distance have less details (I strongly recommend to watch the whole talk!):

Source: The Art of Firewatch (GDC 2015)

Here’s another stunning example! This is my texture from earlier and you can see what happens when I manually change the threshold value:

And here you see a particle system doing exactly that (with a different texture). It spawns an particle and over its lifetime the threshold is increased:

Isn’t that amazing?? I l❤ve it! Below you can see an example where I think (I don’t know it for sure) they used similar stuff on the slime and blood:

Let’s get to my favorite. It’s not #1 because of spectacular effects – it’s the other way around: It’s very subtle and I waited a long time to see a solution to this problem and expected it coming from tesselation, parallax occlusion mapping or other fancy techniques.

If you have a delicate structure like this…

Source: Batman: Arkham City

…you can’t avoid that it looks flat when you look at it from the side. If you would try to do the Fallout-Trick by adding some low-poly geometry you would need to spend a lot polygons because of all the fine detail!

But why does the railing in Batman doesn’t look flat?

Source: Batman: Arkham City

It’s not a crazy shader or complex math. It’s very simple:

It’s just two planes with a small offset and the perspective does the rest!! It’s like with many of these tricks: If you know them they don’t seem very spectacular anymore but I never thought about such a simple solution!

Yes, it has problems when the planes have too much space or the angle gets too narrow…

Source: Batman: Arkham City

…but when you play the game as you should and just walk by, it works perfect! I really like this subtle addition to detail which shows the care of the artists working on the Batman games. Well done! :,)

Thank you for reading until the end! I hope you liked the article and if you know other cool Alpha1-tricks or suggestions feel free to get in touch with me.

Have a nice day!

Update 1

The guys from Alkemi have a great post about how they used some thresholding in their game Drifting Lands. Also their way how they create the textures at first place is very interesting.

Read all of it here: A Game of Tricks III – Particles fun (part1)

Source: Alkemi

Update 2

I had a (kind of) funny time when watching a friend playing Wizardry 8 because we saw this and thought: “Oh look, a crate!”:

Source: Wizardry 8

But when we approached it we were wondering: “Why does the crate has 5 sides?”

Source: Wizardry 8

After two seconds of silence it hit us: “Ohh…it’s supposed to be a barrel!”

Maybe it was only funny in that situation but it’s kind of interesting that in on other areas of the game they have barrels with even seven sides! Maybe because they’re used in-door?

Source: Wizardry 8

This goes to Nuee: Thank you soooo much for taking the screenshot for me! :) (To the others: I don’t own the game and had trouble finding screenshots showing the barrel from near distance)

Update 3

Nicolae recorded this HD video to demonstrate the cool Batman-Railings a little bit better:

Source: Batman: Arkham City