Overview

Punctuation and grammar are vital for an optimal reading experience, and in turn, an optimal user experience. A simple comma in the wrong place can be the difference between a text making complete sense, or not making sense at all.

Capitalization

Unless otherwise specified for individual UI elements, use:

• title case for all user interface short texts (labels, headings, value help texts, and so on)
• sentence case for all messages and explanations

For full details, see about case.

Punctuation

Carefully consider what amount of punctuation will make the UI easy to read and to understand, but not interfere with the visual appeal or the usability. The provide information about using:

• Ampersands (&)
• Colons (:)
• Ellipsis (...)
• Periods (.)
• Quotation marks (")
• Slashes (/ or )
• Symbols (for example: %, #, <)

For full details, visit the section about Punctuation

• Exclamation marks (!) can be used to express enthusiasm, a strong command, or a warning. Use exclamation marks with care. Avoid them when the text is negative, like a warning or an error message. Use them when you want to convey enthusiasm, for example to congratulate the user for finishing a task.

Abbreviations

Limit the use of abbreviations as much as possible to avoid unnecessary abbreviations appearing on the desktop, where space is often sufficient. Test your screens on all three device types (smartphone, tablet, and desktop) to ensure that you see the labels live in each case. Optimize as required and as far as space allows.

See about Abbreviations. For fuller details, see - Abbreviations

Active and Passive Voice

Use active voice wherever you can. It makes the application sound direct and honest, and also helps users understand needs to take the action.

When to use the passive voice

• If you design a message with an apology, because something unexpected or bad has occurred on the system, use the passive voice so that it doesn't sound as though you are blaming the user.

• If you design a message to notify the user about a change of state, such as an update to the system or to the user's account, you can use the passive voice to emphasize the state more than the agent/system behind it.

Resources

, see here

Support

If you have any questions or feedback about this page, please contact our team. For further information and questions in regards to the Design System, please visit the DNA Design SharePoint.