Valve's vector text rendering method

General Discussions
#1

Valve have a whole bunch of handy papers on their site, one in particular caught my eye Improved Alpha Tested Magnification. I know we’ve had discussions here before about various methods of doing scalable text, and this seems like a nice new approach.

Has anyone tried anything similar to this? It would require a proper GLSL shader to do anti-aliased text, but a simpler one than the previous approaches mentioned (which I’d find, but the forum search is broken). Plus I think you could fall back to just alpha testing for shader-less cards (although you’d get no antialiasing). Plus the various effects like outlines, glows and drop shadows would be really useful I think.

#2

And the original curve/vector rendering thread by Spasi is here: http://www.java-gaming.org/forums/index.php?topic=14778.0

Btw I don’t think I’ve seen him post recently, is he still around? ???

#3

Yeah, I’m still here. Haven’t had much to contribute lately, non-gaming related work has taken over. :frowning:

That’s an interesting technique tbh. Despite the disadvantages, the ease of implementation and the ability to use it on very old GPUs while maintaning very good quality, makes it a very good alternative to my approach.

#4

Yeah, I always prefer stuff that can work on older GPUs without too many changes - I’ve only got one pair of hands so I don’t like having to maintain separate rendering paths for different hardware.

I’m not sure how good the quality would be for smaller text compared to an unscaled bitmap font. I suspect the lack of antialiasing when using the alpha-test fallback would make it slightly worse (unless theres another non-GLSL fallback path I missed). It might be best to have regular bitmap fonts for small text, and use this method for larger text (say, anything over 16 or 24 pt).

#5

I’ve managed to hack together something which does the basic image processing, and the results are impressive.

This is the original, high resolution input image (300x300x1):

This produces the following low-res distance map (37x37)

And when drawn in game, with bilinear filtering and an alpha test of 0.5f, we get rather good quality output. This is drawn with a scale factor of 16, so we’re actually drawing it twice as big as the original input image, but with only one eighth of the memory.

I’m not sure what’s causing the artifacts at the bottom of the output - it might be that my preprocessing isn’t quite correct, or I should be using a higher resolution input. And the preprocessing is very slow, so I’m going to try and fix that first, then see what the results are with even higher input images.

#6

I can’t believe how good the results are from this:

It takes only a single 32x32 sprite on a single quad and a simple (~25 line) shader to render that. ;D

#7

That is pretty sweet, bordering on witchcraft. Who’d have thought there’s enough information in 32x32 pixels to recreate that fidelity? And in realtime? And with an easy fallback rendering path? And with easy outline/drop shadows?

Do I smell a nice little font library in the works?

#8

How did you fix the artifacts at the bottom?

#9

I switched to using a higher resolution input image (1024x1024 instead of 300x300), with a slightly larger amount of black around the edges of the shape and it went away. Given that I’m using a black and white image to approximate a vector shape I’m not surprised it needs a high res input for consistant results.

A very good question. I’m currently agonising over whether to write a proper font rendering library with this, but it’s something of a dilemma. The quality and flexibility for people with shader-capable cards is great, but for shader-less people theres no antialiasing, which means small fonts look a bit rubbish. Whereas my current font stuff using sprites for each character gives antialiased results which look good on shader-less cards but doesn’t scale well.

What kind of hardware do other people aim for at the moment? Pretty much all my current stuff works on GL1.1 so will work on anything, but frankly it’s getting to be an annoying restriction - especially since GLSL capable cards have been out for five years now (a long time in graphics hardware).

#10

Very interesting.
Would you mind posting a screenshot of smaller text rendered with this method?