I wasn’t able to find a tutorial on 3D text using font files with Blender on here, so here it goes.
3D text is a very common occurrence in games, both inside and outside of Roblox because 3D models often look significantly better than 2D text labels/images. For this reason, resources like ThreeDText 2 by XAXA are among the most popular Studio plugins of all time. So because these resources exist, you might be asking yourself what is the point of making a tutorial like this? The two biggest reasons are for control, and for performance. When you make your own meshes, you have the ability to control every vertex, the number of faces, the font, better control over paths, among many others. This is not to say ThreeDText isn’t a good resource; it is a good resource, however Roblox has many limitations which means text often doesn’t look as good/often is not as performant as it can be, and these limitations can be debilitating for the developer.
Anyway enough rambling, let’s move on.
Preface: Ensure you have a font file on hand. If you don’t have a font on hand, a good resource for fonts is Google Fonts, their fonts are all licensed under the Open Font License which permits usage of the font for both commercial and personal use. Regardless of how you obtain the font, ensure you have the rights to use it in your project. For this tutorial, I’ll be using the font “Handlee”.
Table of Contents
Legend:
R means Required
I means Independent, it can be combined with other Independent sections.
1 - Getting Started - Getting you set up for the tutorial. (R)
2 - The Basics - How to change basic text properties like text, font, and polycount. (R)
3 - Text Strokes - How to add a stroke to your text. (I)
4 - Making Text Follow a Curve (Path) - How to make your text follow a curve. (I)
4.1 - More Curves - How to find more curves. (I)
4 - Beveling - How to add a bevel to your text. (I)
Part 1: Getting Started
So this part is pretty easy. Install Blender from https://blender.org, then open it. You should be met with a blank file with a cube in the centre.
Delete this cube by left clicking it then pressing shift + X, then on the popup, click Delete. Now, the cube should be gone.
Now, press shift + A, a panel should pop up, click “Text”, it should add a blank text object. Alternatively, you can press the “Add” button in the top-left and then click “Text”.
You should end up with this:
Part 2: The Basics
So this part will go over how to change basic properties of your text object.
First, select the text object by left-clicking it, it should now be highlighted in orange like so:
Now, go to edit mode either by pressing tab, or going to the dropdown menu in the top-left and clicking “Edit Mode”.
You should now be in edit mode, assuming you’ve done everything right thus far, you should see a white box at the end of the label. This is the text cursor.
To start, we’re going to import a font. Click the Object Data Properties button which looks like a green A.
Your properties panel should look something like this now:
Navigate to the “font” tab and expand it.
Press the folder icon to the right of “Regular”, and navigate to your font file (should be a .otf, .ttf or similar file), then open it.
You should notice your text object’s font should now be the font you imported.
Now for this next step, we’re going to make the text actually three-dimensional instead of infinitely flat. To do this, go to the “Geometry” tab in the properties panel, and make the Extrude property higher, something like 0.05 should work. This can be changed in Studio so don’t worry about it too much.
The text should now be three-dimensional:
Now, you can change the text to whatever you would like using your keyboard.
Now, depending on the type of game you’re using this for, you might want a lower or higher polycount on your text. To do this, head to “Shape”, then change the Resolution Preview property:
Depending on your font’s thickness, it may look bad at very low resolutions. For me, a resolution preview of 3 is the lowest before the text is not presentable.
Smooth shading should be handled by Blender so if you’re satisfied with your text at this point, you can export. In the top-left, click file → export → Wavefront (.obj)
You should now be able to import it to Studio.
Part 3: Strokes
You may want to create a stroke for your text. Blender makes this pretty easy. To do this, navigate to the Geometry tab in the properties panel, then change the “Offset” property. Make this reasonably small. I used 0.02 metres and that gives me a decent result:
You can export this how you exported the text in the previous section, however don’t overwrite your previous file, the stroke should be its own file.
Part 4: Making Text Follow a Curve (Path)
It’s possible you want to make your text follow a path. In Blender, the equivalent of a path is probably a curve. Blender has multiple types of curves, you can choose your favourite one, they all should work.
Go back to object mode if you aren’t in it already. You can do this by pressing tab or by pressing the dropdown menu in the top-left.
Now, we’re going to add a curve. You can do this by pressing shift + A, then choosing the type of curve you would like to add.
In my opinion, the Path curve is the easiest curve to manipulate, however as I said above, any curve should work. When you click the curve to add it, a new line should show up. Depending on the type of curve you add, the line may or may not be straight.
To manipulate the curve, ensure the curve is selected (it should be highlighted in orange), then go to edit mode.
Your curve should now be yellow with some orange dots. Each of these orange dots are called control points, they are the points that the curve will follow more or less. To move them around, you can click one of the dots, then press G to go to movement mode. Once you select another control point, the other control points will turn black and the edge connecting the control points will turn orange, this is normal. If you want to snap to an axis, you can press X, Y, Z, or shift + any 2 axes to move freely between them, while being in movement mode. To stop moving the control point, just click on the viewport. To add another control point, you can press E to extrude, which adds another control point.
When you manipulate your curve, you will notice that there are two lines. One is rigid and orange, one is smooth and black. The smooth black one is the curve, which is the path that your text will follow. The orange rigid line is to help visualize the direction/order of each of the control points.
Now finally, to make the magic happen, go back to object mode, select your text object, then in the properties panel, go to the “Font” tab, expand the font tab, then look for the “Transform” tab which is under the font tab. Expand this if it isn’t already expanded. Now, you should see a property called “Text on Curve”. It should be empty at this point except for a square icon and an eyedropper icon.
Click the eyedropper, then click on the curve like so:
Your text should now snap to the curve. Depending on your text’s length, your text may be too small or too large. In my case, it’s too small. To make it span the full curve, we have to modify the Size property which is under “Transform”. It should be the property right below “Text on Curve”. We can also change the spacing. Scroll down to the Paragraph tab, expand it, then scroll down to “Spacing”. Then, modify the spacing properties to your liking.
If you want to change your text to adjust the spacing, go to edit mode, and you can now type along the curve.
Finally, depending on your type of curve, you may want your text to appear above or below the curve. To do this, head back to the Paragraph tab, head to the Alignment tab, then change the Vertical property to your liking. While here, you can change your text’s horizontal alignment as well.
Part 4.1: More curves
You might think that 5 types of curves is a small number, or you wish that there were more presets as it would take a long time to make complex shapes like a spiral. Luckily, Blender has many preinstalled add-ons. Among these add-ons are curve add-ons which add more types of curve presets.
To add add-ons, we can go to edit in the top-left, then navigate to “Preferences”.
On the left side of the preferences window, click “Add-Ons”.
Scroll down until you see add-ons whose names start with “Add curve”.
From here, enable them by clicking the box to the left of their names. They should be checked now, and you can close out of the preferences window, go back to object mode, press shift + A, go to “Curves”, and you should see more types of curves.
For my example, I’ll add an Archimedian spiral. Using it, we can get some crazy looking text with ease.
There are also more curves available online so I encourage you to use the internet if you want to broaden your knowledge of Blender in general as that would be out of the scope of this tutorial.
Part 5: Beveling
Bevels are used to make an object appear softer/more aesthetically pleasing. This applies to 3D modeling, and therefore this tutorial as well. If you don’t want rigid corners on your text and want it to appear softer, you can bevel your text in Blender.
For reference, here are three text objects, one with zero bevel, one with 0.01 metre bevel, and one with 0.025 metre bevel.
To do this, head to the Geometry tab in the properties panel, and expand the tab. Now, you should see another tab called “Bevel”. Expand the bevel tab, you should be met with three types of bevels: Round, Object, and Profile. We are going to be using Round.
Change the Depth property. A larger depth will make the text appear puffier, a smaller depth will make it appear sharper. Depending on your font, there may be issues with geometry at high depths so use this with caution.
You might notice that there is what appears to be a crease on the bevel with the highest depth. We can get rid of this by going to edit mode, selecting our text object, then right-clicking it. Now, navigate to the “Convert To” menu, then click “Mesh”. Do note that you cannot change what your text says once you convert it to a mesh.
Now, go to Edit Mode. In the top-left, click “Mesh”, then “Clean up”, then “Merge by distance”. This will work to varying degrees depending on the resolution preview but it generally should work.
End
That’s the end. If any parts were unclear or if you’d like me to add anything else to this tutorial, let me know. Bye!
