In the UI interface, why is the IOS system used to capitalize the first letter of each letter, while Google likes the first letter to be capitalized? Such small differences can actually make a very big difference, which can affect the readability of information, the difficulty of understanding and usability, and even affect people’s perception of your brand. Today’s interesting translation will take you in-depth understanding of the advantages and disadvantages of these two modes.
As shown in the figure below, can you point out the difference between the above two prompt messages? In fact, the only difference is that the information on the left has more capital letters than the information on the right. Uppercase O, lowercase o. Who cares?
We will explore something interesting step by step, but first, let us start with the background knowledge of capital letters.
1. Title Mode Vs Sentence Mode
Nowadays, in most applications and websites, there are two ways to use capital letters:
- Title mode: Capitalize the first place of each letter.
- Sentence pattern: Capitalize the first letter in a sentence.
If you are an Apple user, you will notice that there are many uses of the former in their products. This is because Apple’s design guidelines recommend the design of title mode for many user interface elements, such as prompt titles, menu options, and buttons.
And if you are a Google user, you will find that the second method is mainly used in their products. This is because Google’s design guidelines recommend using sentence mode in all design scenarios.
No matter which team you are in, I hope you have ideas when using heading or sentence patterns. Let us take a closer look at each mode next.
2. What are the advantages of the title mode?
First, let’s see why you would consider using title mode.
1. More symmetrical and neat
Some people think that the design with the first capital of each word looks better because it is more symmetrical and neater. As long as your phrases are short enough, you can see that the title pattern can indeed create a very good visual rhythm:
Sometimes, this symmetrical beauty alone is enough to make the designer choose the title mode without hesitation.
2. More visual prominence
“Visual prominence” is just a fancy saying, intended to express that the headline pattern can stand out from a large amount of information. Using capital letters in a bunch of letters is like raising your hands in a crowd to highlight the part of your headline. The title mode is especially useful when you cannot correct the font style. It helps you distinguish the title text from the body information.
Notice, is the heading on the left more prominent than the heading on the right? The more prominent this contrast, the more likely users are to read it.
3. More solemn and formal
Headline mode often makes users feel solemn and formal. Websites such as The New York Times and USA.gov mainly use headline mode to create a professional and solemn user experience.
Using headline mode is like putting a suit on your words. For some brands, it may hope to convey the focus of business through its text messages. For example, if the business you are dealing with emphasizes security, the headline model is more likely to deliver a professional and reliable business model than the sentence model.
Imagine you are a company executive. Which version above feels more professional?
3. What are the advantages of sentence patterns?
Next, let us see why you would want to use sentence patterns in your products.
1. Easy to read
The main reason for using sentence mode is that the text information in this mode is easy to read, especially when the text is relatively long. Can you imagine how difficult it would be to always read text headings that use heading mode?
This is why I am reluctant to read the following message that complies with Apple’s design guidelines.
2. Easy to limit
According to Sue Factor, Google’s first UX author, one of the main reasons why Google decided to use sentence mode is that it can interpret text information more easily for designers and engineers to understand. In a product interface, we are not always clearly aware of what is included in the title described in the text. Is a label or tab name a title? What about a setting checkbox? Or a confirmation message?
The most important thing is that there are actually many possible ways to design the title mode. Should prepositions such as “from” or “through” be capitalized? What about articles like “the” or “an”? Although you can rely on a design code, the exact design code may be different. The following are the design guidelines for the title mode in Apple:
Just imagine, if there are many people designing information for your product at the same time, then once the title mode is adopted, designers will easily forget the above rules. Therefore, you can avoid this confusion by using sentence patterns globally. The sentence pattern has only one way, so it is difficult to make mistakes.
3. More friendly
Just as the headline mode looks solemn and formal, the sentence mode tends to look more casual and friendly. I am a designer of Dropbox, and we use sentence mode because we want our brand to convey natural and accessible feelings to users. We believe that it is the voice that our products deliver to the outside world that distinguishes us from our competitors, and the design using sentence patterns is an effective way for us to maintain this voice.
4. It is easier to distinguish proper nouns
Finally, the sentence pattern makes it easier for us to distinguish professional nouns. Professional nouns are words that are often capitalized, such as New York City or Microsoft.
Nowadays, many companies incorporate their product characteristics or description information into product naming, instead of whimsical product naming methods like “Spark” and “Fantastical”. If you use the title mode on all the buttons in the product, it is difficult to distinguish whether there is any text that represents a professional term, which affects the usability of the product.
4. Are there other situations?
In fact, headline mode and sentence mode are just two of the most popular design patterns applied to capital letters, not all of them.
example 1
In Windows Phone 8, Microsoft used a lot of lowercase letters in the interface design, and even applied them to titles and buttons.
Example 2
GIPHY, this website uses capital letters everywhere, which makes sense for them, because the meme text is usually all capitals.
5. Choose and design a suitable model for your own products
Both headline mode and sentence mode have their own advantages. No matter which model you prefer, make sure you make an informed decision that will benefit your brand. The worst thing is that your design does not follow any standards at all, which eventually leads to a lack of consistency. At this time, it is very painful to correct it.
Once your users notice this design inconsistency, they will quickly lose their trust in your brand.
