TextMesh Pro TextMeshPro text anti-aliasing from a distance (in VR)

I am using TextMeshPro Text components (the ones without a canvas) to render text in VR (Vive/Rift; Forward rendering with 4xAA).

I noticed that close up the text looks perfect, however the farther I move the camera away the more I am seeing what I think are aliasing artifacts. In particular, there is more aliasing compared to rendering a UI Canvas Image (with Mip maps enabled). It does not matter how I scale the rect transform compared to the font size.

In this video, you can see the effect in motion (as happens when standing still with a VR headset like the Vive). The top 4 are TextMeshPro components with various scaling sizes (1, 0.1, 0.01, 0.001). The top three have the default Roboto-Bold SDF asset; the last is with a custom Roboto-Bold font with SDF32 selected (looks worse). The bottom two are Unity UI canvas images (world space), the upper is with an image with Mip maps generated (looks great), the lower without Mip maps (looks way worse).

Is there any chance of changing the appearance of the TextMeshPro components to the likeness of second-to-bottom Unity image? I am not trying to get the text to be readable, and the closeup view is already fine, I am merely talking about the banding "sizzling" that appears when moving further away.

Thanks!

 

In order for SDF to render correctly, the scaling needs to be uniform. When trying to render text that is small, you should enabled Extra Padding in the text object inspector panel.

Mip mapping should never be enabled on SDF.

Test with uniform scaling and with Extra Padding and let me know what happens. Since I can't see much from the video in terms of setting or anything, I might need a Repro of a scene / project where you are observing such behavior so I can check it on my end.

 

Hey @Stephan_B, thanks. Scaling is uniform in one of the texts, and extra padding is enabled. I don't know how to enable mip mapping for the text, so it is probably disabled. ;-)

Here is a demo project which requires the Vive. To test, add TextMesh Pro for 2017.1, start the "Test" scene and look, with the Vive on, into the direction of the two texts. The upper is TextMesh Pro and shows the aliasing, the lower is an image for comparison for how I thought it should look like.

 

Thank you for providing the Repro project.

I'll try to take a look over the next few days if not over the weekend. I do have an HTC Vive setup for testing.

 

I had a chance to look at the repro you provided and here are my observations.

When comparing a text object (TMP) at 6 point size which even if we were not looking through a VR device, would be hard to read. Through a VR device, this makes using such small point size even more problematic.

Having said that, comparing the top text object vs. the bottom image from photoshop, you can actually read to TMP text whereas you can't read the text on the image. The image is also using mip-mapping which blurs the whole thing where although moving laterally doesn't show temporal aliasing, it is just a blur of grey pixels.

If you disable the mip-mapping on the image, then the text (image) is still not really readable but you have significant temporal aliasing where again the TMP text object looks much better.

Here is a link to some pretty horrible video footage using your example scene and content. Top text is TMP (6pts size) and bottom is Photoshop image. First is TMP (unmodified) with PSD no mip-mapping, then cuts to TMP (softness added in material) with same PSD and last PSD with mip-mapping.

Like I said horrible looking stuff as trying to render text at 6 point size in VR is just a bad idea regardless of how you try to render it. The TMP text in my opinion still looks better but then again, at 6 point size it is all bad. You could add softness to the TMP object to suppress potential aliasing but this text won't be readable anyway.

Personally, I would simply fade the text away when it gets too small and cannot be read anymore. You could even implement a fading script where depending on distance to viewer, the text fades out smoothly.

Signed Distance Field text are readable size in VR typically looks much better than bitmap text which ends up with temporal aliasing. Provide the text is large enough, you should be able to get great results but like I said, at 6 point size there isn't much that can be done.

 

Hi @Stephan_B,

thanks for your answer; however I feel maybe we are talking past each other. I'll try to explain better.

First, since your post sounds rather defensive, sorry if I sounded like TextMesh Pro was a bad asset. It was not my intention to suggest that TextMesh Pro text looks any worse in VR than Unity standard text; in fact, as you point out, it looks way better both close-up and at a distance. It is also clear to me that at a certain distance, any text will no longer be readable.

What I was after is the fact that both Unity and TextMeshPro text displays visible "shimmering" (which I think is aliasing) when viewed from a distance and which makes it stands out in VR compared to other game objects which do not show this effect (this includes geometry as well as mip-mapped images). TextMesh Pro text looks better than Unity's, but still displays this effect. The "shimmering", in my opinion, looks worse than having the text more blurred out from a distance (i.e. in the last part of your video). I was using the mip-mapped image as an example of what I think the text should look like when further away, because these images do not show the "shimmering" when moving the VR camera.

I would not call small-point text a "bad idea" in VR in general, for two reasons. First, the issue is viewing distance: Close-up, all text including very small point text looks perfect. At a certain proportional distance to the text, the same "shimmerring" occurs. Second, there are - to my mind - valid use cases for small-point font in games including VR. In our game, we have a computer monitor with which the user can interact, which displays text. The (TextMesh Pro) text looks absolutely perfect close-up. However, it should also be visible (not readable; only visible) to the user when viewed across the room and it should not stand out with "shimmering".

Now I see there are a couple of options for reducing/removing "shimmering" when viewed from a distance:

1. Do not use dynamic text at all but pre-rendered mip-mapped images => works, but isn't dynamic and doesn't look as nice close-up
2. Fade out the text in the distance, as you suggested, but this looks weird in-game because the user should see from a distance that there *is* some text there and not nothing (empty screen).
3. At a certain distance, replace text with mip-mapped image. This works if the text is mostly static, but doesn't, again, work if it is dynamic.
4. Have some kind of anti-aliasing/blurring on top of or built into TextMesh Pro at distance (The smoothing option doesn't seem to affect it).

Whether option 4 is feasable or not, and how, was my original question; sorry if I did not make that clear. If you're saying it can't be done I can stop looking and will go with option 3 which is not as good but should work.

Philip

 

Try reducing the Scale X and Y in the debug section of the Material Inspector to see if that might help when the text is at a distance.

 

Ah, I see what you're getting at. This makes the text more blocky which in turn reduces aliasing due to having fewer edges - this looks better, but doesn't prevent aliasing in general. Also, unless I am mistaken, Scale X and Y is a global setting, i.e. for all texts, so adjusting automatically at a distance is not possible if you have multiple texts at different distances.

I think I'll have to go with auto-generated mip-mapped images. Thanks for your help!