Bitmap-Font Maker

[Raizor]

Great. Thanks for the detailed info Hellfire, much appreciated.

[Kirl]

Looks like a great little tool! 

[Pot Noodle]

Nice one Hellfire, I will have a play later. 

[Voltage]

Nice work Hellfire, karma++ 

I've used this tool before, and I'll use it again.

To get some better precision I do a re-vectorization of the anti-aliased bitmap using marching squares.
Otherwise (when working with whole pixel distances only) you would need to increase the rendering size drastically (which makes the search incredibly slow).

Any chance I could get an explanation like I was 5?

Another question regarding the shader that would be used to draw these distance field fonts.  It would look up a texel, and it would know how far from the font it is by this lookup.... but what to do with that info?  Do I draw here or not?

[hellfire]

To get some better precision I do a re-vectorization of the anti-aliased bitmap using marching squares.

Any chance I could get an explanation like I was 5?

Sure.
The marching squares reconstructs the subpixel edge (blue) from the surrounding 2x2 pixels (red):

This way the distance (orange) to the edge is much more precise; in contrast to using whole pixel positions only where the distance between two neighbouring pixels can naturally be only 1 or sqrt(2).
The only way to get a reasonable precision without subpixel-precision is to increase the resolution but that makes it extremely slow.

Another question regarding the shader that would be used to draw these distance field fonts.  It would look up a texel, and it would know how far from the font it is by this lookup.... but what to do with that info?  Do I draw here or not?

When fetching a texel from the distance-map a value >=192 is "inside" the character and <192 is "outside".
So in the easiest case you can just enable alpha-testing and drop all outside texels (that's compeltely un-antialiased, though).
Inside a shader you could do all sorts of color-ramping near the boundary to simulate anti-aliasing, glow, shadows, etc.

At the moment I'm not quite sure if the threshold of 192 makes much sense.
I just figured that font-characters are usually rather thin and there's probably more information outside than inside...

edit: the threshold value changed from 192 to 128 in the current version.

[Voltage]

After reading that a couple (read 4) times, it clicked. \o/

So, for each pixel in char block, get distance from this pixel centre to the calculated subpixel surface.  Adjust and clamp tween 0 and 1, and store. Right?

Thanks for the explanation hellfire.

Regarding all this effort though, couldn't you just blur the original 2 bit texture and use that?  I'll attempt to answer that myself.

[Voltage]

heh. Cause blur and distance are different functions.  Distance affects the surrounding pixels but leaves the original font pixels untouched.  Blur doesn't.

As you were people.

[hellfire]

get distance from this pixel centre to the calculated subpixel surface.  Adjust and clamp tween 0 and 1, and store. Right?

Pretty much, yes. The distance of an outside pixel is positive and the distance of an inside pixel is negative.
That's mapped to 0..255 where 128 represents a distance of 0.0, so it's right on the edge.

couldn't you just blur the original 2 bit texture and use that?

Yeah, when looking at the output of the distance-transform it just looks kinda blurred and actually it's not such a bad approximation.
It doesn't preserve hard corners, though - everything gets soft and round.
And, as you already noticed, it affects the threshold to the interior part.

[hellfire]

Fixed a bug in the distance calculation, another one in the character positioning and moved the interior threshold to 128 (0.5) because it's nicer to handle.
Link (in post #1) updated.

[Rbz]

Nice!
I'm going to test it later.