UI text guidelines
While Alexa is a voice-forward experience, there may be times you need to display UI text to educate customers, describe an error, or a new setting. This section will help you write clear, consistent text for buttons, links, error messages, and other elements of interaction design. Clear, friendly, conversational text helps customers immerse themselves in their experience.
For guiding principles, we recommend:
- Use natural, conversational language that speaks directly to customers. We talk to customers in their own words, never assuming they understand how our site works and never making them learn terminology or behavior. We avoid coining new terms or creating feature names when a description would suffice.
- Create specific, self-explanatory labels. Headings, buttons, links, and other labels should be specific enough that customers can understand the UI and make decisions instantly, without having to pause or read instructions. Customers tend to focus on actionable control labels, not instructional text, so these labels need to speak for themselves.
- Cut any word that doesn't serve a purpose. We don't waste customers' time with messages like "There's a problem accessing Alexa," we just tell them what the problem is. Don't add extra text in order to make something more discoverable. If there's a danger that customers won't notice the message, then it may be a design problem, not a text problem.
- Structure text so it's understood at a glance while driving. We use bullets, white space, and bold font to break blocks of text into bite-sized chunks.
(Recommended) Use contractions.
Contractions are direct, concise, and conversational.
Do
that's, we've, you're, didn't
Don't
that is, we have, you are, did not
(Recommended) Use numerals instead of words for numbers.
For UI, write “1, 2, 3” not “one, two, three” – even at the beginning of sentences. Eyetracking studies show that numerals are more scannable and eye-catching than written numbers.
Exceptions: "hundreds," "thousands," "millions."
(Recommended) Use active voice.
Use the active voice in most cases: focus on who is performing the action, not the object being acted upon.
Exception: It's OK to use passive voice in error messages to avoid blaming the customer. For example: “The product name that was entered is not valid. Please try again.”
Do
You're about to delete this item.
Don't
This item is about to be deleted.
(Required) Use text wrapping, ellipses, or other methods when text does not fit.
Should the string exceed the maximum width allocated for that line, the screen must be designed in such a way that the string rolls to a new line.
Punctuation
Don't over-punctuate. Add punctuation only when not doing so would be unclear, ungrammatical, or inconsistent. Unnecessary punctuation creates clutter.
(Recommended) Generally, avoid quotes in UI text.
When you have to use quotes, opt for straight quotes, not curly (aka, "smart") quotes, as the latter will break when translated; sorry, typography fans.
(Recommended) Add a serial comma before the final conjunction when writing a series of items of a sentence.
(Recommended) Use exclamation marks sparingly.
An exclamation point might be the right way to celebrate something with the customer, such as a particularly celebratory thank-you message or notification. But use sparingly, reserving them for occasions when the customer might actually be excited.
(Recommended) Avoid using parentheses, dashes, and semicolons in UI text.
-
If you find yourself adding parenthetical information to UI text, find a way to give the parenthetical information its own sentence or omit it altogether.
-
Semicolons are awesome; don't use them in UI text. If you have something complex to say, find a way to break it into shorter sentences.
-
Some of our European encoding sets don't include em and en dashes, so these can result in translation catastrophes.
(Recommended) Use natural speech, see list table below:
Use | Do not use |
---|---|
Sign in | Login or log in |
Purchase if used as a noun. Buy if used as a verb. |
Bought or paid for |
See | Show, view, or display |
Choose | Select |
Last updated: Nov 25, 2023