How to fix SDF artifacts
The Geometry Generator (used for non-raster SDF, PseudoSDF, MSDF and MSDFA), its very fast and produces a high quality SDF asset, But it relies on the font to be well constructed.
This is the case for most TrueTypeFonts, but there are some that contains errors like
Most of the time this errors are validated by the font library and corrected when possible, which make those font render correctly even when they have errors. However, the Geometry Generator speeds the SDF generation (which normally is quite time consuming) by assuming the font is valid (which most of the time they are) and creating the distances based on the explicit paths in the font.
These errors will generate some wrong characters and artifacts (Missing or Inverted sections, Uneven curves, etc)
There are free softwares that fix this font errors and will export a new TrueTypeFont that generates the characters without errors.
An example is the FontForge which is free and can fix the errors by using the menu (Elements\Validation\Find Problems)
The Safest format is the Raster SDF
Alternatively, you can use the Raster Based Generator by switching the generation method to "Raster SDF". This format uses the normal font libraries to do the rendering, so the errors are corrected automatically.
In future versions I plan on revising the Geometry Generator to automatically correct this error. However, given that this generator works for almost all fonts, I also want to use it to create a Dynamic Font that could do the generation at runtime instead of pregenerate the textures. So, speed is something really important for this generator. Nonetheless, if you prefer having a more robust MSDF generator instead of Dynamic Fonts, please cast your vote in the SmartEdge Trello page, it will help me decide what direction to follow based on what you need.
Quality with Size and Spreading
Signal Distance Field can use small textures and still render the characters with high quality disregarding of their size on screen. However, there is a limit to how small the texture can be and how it is generated.
When rendering lots of characters for the font (e.g. Arabic Character Set or the Basic + Extended ASCII) even when the texture is 512x512, the number of pixels for each character could become quite small. Even more if the Spreading is a big factor.
Spreading is the number of pixels around the character where the Distance Field is generated. The SDF Font Maker and SDF Image Maker shows that number as a 0..1 factor of the character size. Therefore a 10x10 character with spreading of 0.5, becomes a 5x5 character extended to 10x10.
Because of this, the higher the Spreading, the less quality the character can use. But higher spreading are needed to generate a bigger glow or wider outlines. So, choosing the spreading is always a trade off between quality and memory.
This next image shows a font with a big Spreading that produces low quality borders were some sections join because of the lack of precision.
Next is the same font, but with either a bigger texture size (e.g. 1024x1024 instead of 512x512) or an smaller Spreading (e.g. 0.2 instead of 0.4)
For most cases its advised to use 1024x1024 fonts with Spreading between 0.1 and 0.3. Although fonts with thousands of characters (e.g. Chinese) should use 2048x2048 with smaller Spreading.
Also, notice that tools like I2 Localization can be used to find exactly what characters are used in your game and generate fonts with only those, which normally reduces the number quite sustantially (i.e. not all ASCII symbols are used in your game, nor all Chinese characters!)
In Summary
Created with the Personal Edition of HelpNDoc: Easily create iPhone documentation