How to use custom fonts?

I’ve came up with several ways to use custom fonts for my game, however I am unable to decide which method is the best to use.

Whole Word Decals
This is a method where I upload a phrase of a word as a decal. The downside is in the event that the decal fails to load, the text won’t be visible.

Individual Letter Decals
This is a method where I upload every letter in a font as a decal. Downside is if one decal fails to load, the word will be incomplete.

Meshes or CSG
This is a method where I create meshes or unions of letters or phrases. The downside is I have to keep on positioning dozens of parts whenever the camera moves (performance heavy)

If there are other ways that are better than the ones I’ve thought of, I’d be happy to know them :slight_smile:

I actually read about font libraries? I’m not sure what these are, but they are modules that theoretically contain fonts? I’m currently on my phone so I can’t test it There are several modules that I found but I wouldn’t know which is the most desirable.

4 Likes

Won’t lie to all of them have their pros and cons.

If you want to use custom fonts you should ask yourself first:

  • Is my game going to be translated into other languages later on?
  • Is the font clear enough to have my decal passing the moderation approval process?
  • Is the font’s copyright allowing me to use the font for the game?

And based on that you should pick which you want to go.

I’d love to help you with this one although I never really heard of those.

2 Likes

I would do a version of this, but instead of uploading each character individually, use a sprite sheet containing each character. Then you would slice them based on the character. This is a pretty popular method and it eliminates the problem with the word not being complete. Unfortunately, you still have to wait for the one decal to load.

image
An example of a font sprite sheet.

There are many modules though that allow you to insert a sprite sheet and allow you to make dynamic custom fonts. These may be the font libraries you have heard about. There are many in the catalog for you to dissect if you so please.

Pros
  1. It requires only one image
  2. It is dynamic, so you can use localization or edit the text if you need
  3. Custom characters
Cons
  1. You have to wait for the sprite sheet image to load
  2. Slicing images is pretty risky for different sized screens
  3. Requires some programming knowledge usually
  4. You can’t really preview the text unless you specifically add that
8 Likes

Instead of using Decals you could use ImageLabels on SurfaceGui’s.

Pros:

  • The images don’t stretch depending on the part size. Meaning that it will look a lot nicer.
  • You will find it easier to position each individual letter as the image doesn’t stretch to the size of the part.
  • It will be easier to update and maintain the fonts because you don’t have to keep creating new images if you resize the part. Also you don’t have to make the image just fir that certain parts size.

Cons:

  • As said in the OP if you use an image of the whole word you will find it hard to translate it.
  • For both decals and ImageLabels if you use individual letters, if you translate it, the word may look a bit off or may not fit the part as it may be a bigger word.

Meshes or CSG:
I would make meshes in Blender as you will find it quicker to make them. Also you will find the meshes will look a lot nicer. If you use roblox unions it will take a lot longer to make them and you will find it hard to make the curves on the letters.

3 Likes

I personally use the spritesheet method outlined above, but I’d like to add: I make sure to fall back to Roblox letters for characters not in the spritrsheet. This means I use a square text label with the character inside rather than an image label. This means that for common Latin letters (abcdefg…) you see the nice font via image labels, and for other letters (e.g. Devanagari) you see the fallback Unicode-compliant font that Roblox provides. This will help you support Unicode better with a custom font system.

2 Likes