User Interface

Font Style and Size

Mixing font styles and sizes will make the text appear confusing and unpolished, due to writing conventions and typographical norms.
Certain fonts can also appear childish and unprofessional if used in the wrong context.

Example:  The image to the right contains several issues: 

1. No style consistency, as each sentence uses a different color (gray, red, yellow, white, and blue) and effect (red glow, black shadow, black outline, no outline, gradient)

2. Typeface, color, and compression done to fit the UI makes "Missions and Subjugation" hard to read

3. Disproportionately large sentences, such as with the number 8451 and "Complete Subjugation"

4. Too many UI elements and details, making the screen look polluted and unprofessional (you can barely see the actual game scene).

Solution: Laws of UX is a good resource to consult. Overall, readability comes first — what's the point of having text if the user can't understand it?

Unnatural Leading

Leading is the space between two lines of text, and it can drastically affect readability.

Example: In the example to the right, you can see when the leading is too tight, causing the words to get cluttered and difficult to read. Too much leading is also bad, because it breaks the flow of the text, and the reader can't tell if the lines are all part of the same sentence.

Solution: Most design guides recommend leading to be between 120% and 145% of the font size. So for a font size of 10, leading should be from 12 (single space), up to 14.5 (double space).  

Lack of Font Size Hierarchy

Automatic font resizing don't solve problems, it creates problems. Text size and style (bold, semi-bold, etc.) are used to determine the hierarchy of the titles — as in, what is a category and what is a subcategory — and users are used to read font size and style as cues.

Example: An example of clear structure. The names of the sections, like "Special Offer" and "Daily Deals", have the same size, and the boxes clearly define what items the titles are referring to. The names of items and prices are also the same size, making them equals in hierarchy. However, if the size changes for every word, it would be harder to navigate the UI.

Solution: Turn off auto-resize and create a font formatting hierarchy. If the text is too big, a linguist can help fit it in the available space.