Adding a new font for MeshWriter

While looking for the ways to use 3D text on BJS, I found MeshWriter, which is a great extension. Now I am curious how I could add a new font. I guess I need to create a new js file like this.

I think I kinda understand how it is constructed, but could anyone help me understand how to create one? I see parameters such as sC, hC, fullPath, shapeCmds, holeCmds , xMin, xMax, yMin, yMax, width… Any help would be appreciated!

Maybe this is how it’s done? GitHub - gero3/facetype.js: typeface.js generator

@drburton it looks like you created this extension, can you share how you generated those font files?

1 Like

Thanks @trevordev, it looks promising!

Just tried facetype.js and found it returned similar entries as below, y data is missing though:

     "o":"m 653 230 l 271 230 ... l 319 368 z "

I will keep looking into this, let me know if you have another chance to find some more info. Thanks!!

Hi @TheLeftover, I was able to find you were the original creator of MeshWriter. Could you give any insights on this? Thanks!!

Well, I will certainly confess to being the author.

Adding a new font is pretty hard. Sorry.
There are several reasons for this:
~ fonts have quirks
~ Babylon has quirks
~ I only did a couple fonts and so couldn’t justify automation

Here is the creation process. I load a font into opentype.js glyph inspector. This spews out the glyphs in a code that is vaguely similar to SVG. With some tuning, they can be fit into MeshWriter’s purely proprietary language for specifying glyphs.

Each glyph was a manual thing. I do each one at a time. Automating that was gonna be slow going, so I just created a couple font packages. You are the first outsider who ever asked me about it.

What font?
How many glyphs? (full alphabet? letters and numbers? you get the idea)

1 Like

Oh. I encode the more stable glyphs. This saves me about 40% of the size. Allows me to ship all the fonts in a package less than 100K. That is an optional detail. The main software works with either encoded or decoded.

There IS a function to do the encoding/decoding, obviously. I think both directions are in the main code module.

If you go to Comic Sans font file and look at lowercase “j” you will see all versions. The output from the glyph inspector (sortof), the unencoded MeshWriter format and the encoded MeshWriter format.

1 Like

@TheLeftover thanks for clarifying all. No worries, actually, I expected it might be tricky to do a new one. At least now I understand what hurdles you’ve been through :wink:

Answering your question, it is a custom font that are not released for public. I would use about 10 glyphs, which I could create manually, or just convert them to meshes.

But I am also interested in using 3D characters in 3D environments in general. I’m a graphic designer who is interested in typography in 3D environments, and constantly (slowly tbh) looking for ways to utilize it more easily in 3D. One of the great typography tools that I know in 3d environment is Text Mesh Pro for Unity3D and I think your MeshWriter has a great potential as well. As far as I know, designers are not happy with the fact that typography is pretty quirky in 3D, and I see a lot of rooms for improvement in general.

Thanks for your great plugin. I hope I could contribute in the future too.

1 Like

Unreleased fonts, eh? Wow.

I learned a ton about fonts, curves and SVG with this little project. In the Webdings file there are only two glyphs, variations on an SVG shape that I wanted to use in Babylon. They came from a public SVG images somewhere. Just like a latter-day 3D Wingdings. Connecting the dots, I am!

I saw from that how one could convert some SVG paths to 3D meshes. But investing in that automation would also have been very challenging. I didn’t get the “market response” except from my dear friend @Wingnut, so I kinda left it where you found it.

Thanks for the interest and the discussion. Please do stay in touch.


Will surely do. Cheers!

Back again. Someone else asked about modifying font files. I would be delighted to support someone’s project with MeshWriter. I don’t mean it to be a closed box but I found that adding fonts was hard. I only did three font-families and two svg symbols but every one had its own challenges.

I will update the readme with more detail on how I did it.

It makes a big difference whether one wants to create a few symbols (a la WingDings), full coverage of a new font-family or just add glyphs to an existing font.

I am here to help if this would be a valuable thing for your project.


Hi guys. Somebody should probably further-investigate @Necips discovered link-to Easy3Dpost.

Notice the 7 visits at my playground link, and not one LIKE for Wingy… for testing the font-making, exporting the font/scene, storing the file on his github site, and making the playground demo? Can ya “feel the love”? heh.

It’s a great link/discovery, @Necips. Just ignore the lack of petting from others. :slight_smile:

I think we need to steal this method… of font-extruding. It looks like we can extrude MANY fonts… without the hand-editing hassles. We need to go code-robbing. heh. (with perms, of course)


@Wingnut @Necips Thanks for the great reference. I quickly dug into the code and found they used pretty similar data format to what @TheLeftover did. For instance:

      "o":"m 653 230 ... l 319 368 z "
  "familyName":"Roboto Medium",
  "original_font_information":{ ... },

One of the actual JSON file they use can be found here:

I couldn’t find what they actually used to create this JSON, but it’s nice to see there are people who actually have made this far.

1 Like

First, I would like to point out that I gave Wingy huge strokes for making all of the playgrounds. I am thinking that they have expired by now. (The strokes, not the playgrounds.)

Second, I have started my novella on making working fonts. You can see the latest here. (Stop reading where it says “Boogety”.) meshwriter/fonts at master · briantbutton/meshwriter · GitHub. I will plod along forward on this page. It will presently make its way over to the Babylon official page too.


Awesome. Let me know if there is anything I can help with. At least, I can be an audience of your gig!

1 Like

Hey Samba…

you know the band performs in the nude:smiley:

Worse than that, the entire band… is farm live-stock. NAKED farm animals! Gross.

1 Like

lol i should admit i love that gross.

Hey @samba !

I am getting back to more documentation of font creation. Since you expressed interest:

Are you thinking of co-opting a font file, as I did with most letters? Or creating free-form glyphs? If it is the latter (and you have continued interest) then I will have a couple follow-on questions.

Sorry for being so slow.

1 Like

Hey @TheLeftover,

Thanks for your hard work on this issue. Please don’t apologize as you are donating your own time to help others.

Regarding the topic, I would be more interested in co-opting font files. Just out of curiosity though, what would be your additional questions for free-form glyphs?

Font files seem to follow reasonably narrow conventions. For example they all use absolute coordinates (so far). Relative coordinates can be supported, with pain. My WebGL glyphs came from an open source SVG image which used relative coordinates. Yuck!

A couple questions about your font source.
~ Is it secret?
~ If it gets supported, do you want to fold that into the meshwriter package?

More soon.

Update to whomever is listening. I advanced the documentation a bit. While doing so, I got into the details. I am going to take to run at automating this. Or automating it more.

I will start with Comic Sans. It has been started but is very arduous. More soon.