Thin instance multi-channel signed distance field fonts

For each character, the texture is selected from the font atlas (like sprites) for each plane. The vertexes of the plane (the rectangle) are also manipulated so the character is the correct dimensions. I’ve generated font atlases and suitable json for the font metrics https://github.com/Butterwell/mtsdf-fonts, https://playground.babylonjs.com/#H6UIFZ#8

8 Likes

Ohhhhh this is wonderful !!! Adding @thomlucc, @PirateJC and @Cedric who was looking into font rendering for babylon native.

This is great. Thanks for sharing it!

Hey @Butterwell do you think you could add a Doc page on the babylonjs documentation website ? This is a really cool tech ppl could definitely be interested in reusing.

@sebavan Will do.

2 Likes

You are the best !!!

@sebavan I just had a lovely romp through the documentation, and I’m at a loss as to where to the insert the doc page. Under Advanced Topics / Shaders?

Lets summon @PirateJC our doc master to double check where this would best fit :slight_smile:

1 Like

@Butterwell this is super awesome! Really excited to have you write up some documentation about this!

I’m actually wondering if it might be best to have it’s own new category…maybe Advanced Topics / Fonts?

What would you think about that idea?

If you like it, I’ll get the structure set up for you and then you can build out the page with your content. Sound good?

1 Like

Sure, that works for me.

Hey. I’ve not stopped thinking about this. I’m not going to document this because it turns out that multi-channel signed distance field fonts, as is, aren’t as fidelitous as I’d like: artifacts show up when scaled large and artifacts when shrinking and expanding from the outline are even more extreme. I’m writing this note now because I think I’m near competing (it feels within days, but I suspect it’s a month out) a method that generates acceptable results. You could consider the method inspired by, but distinctly different than, Glyphy.

5 Likes

Can not wait to see the result :slight_smile: