Open DS

Voice and tone

Five questions every design system answers about voice and tone. These are Accessible first’s answers, and each one points back to the reasons that chose it.

View all 5 voice and tone tokens ↓

The reasons this scheme answers from

  • R1Content and dataForms and tasks, one idea at a time
  • R2Human factorsLow effort to understand, they see it fresh each time
  • R3People and work contextEveryone, including people with disabilities, AAA
  • R4BrandCalm and clear, quiet
  • R5OutcomesCompletion without errors, a task that fails

Question 1

Which kinds of copy does it need?

  • Labels and messages
  • Labels, messages and help (chosen)
  • Labels, messages and articles
  • Labels, messages and headlines

Why Accessible first picks it: Hints and help text carry people through each step.

becauseR1

action“Continue” · “Go back” · “Delete” · “Try again” · “Start a new application”

Question 2

How many tones does it use?

  • One (chosen)
  • One per moment
  • One per brand

Why Accessible first picks it: One plain tone everywhere; no surprises.

becauseR2

content action5

Question 3

How is the voice defined?

  • Rules and a word list (chosen)
  • Principles and examples
  • A shared core, brand tone on top

Why Accessible first picks it: A word list of common words, with terms to avoid.

becauseR3

  • Rules and a word list

These tokens are the decisions themselves; no primitive sits under them.

Question 4

How does it sound?

  • Terse
  • Plain and direct (chosen)
  • Conversational
  • Playful

Why Accessible first picks it: Every sentence is easy to read on the first try.

becauseR3R4

  • action
    commit
    Continue
    cancel
    Go back
    destroy
    Delete
    retry
    Try again
    empty-action
    Start a new application

Question 5

Where do the words matter most?

  • Errors and empty states
  • Articles and guides
  • Form steps and errors (chosen)
  • Headlines and buttons

Why Accessible first picks it: Words decide whether a form gets finished.

becauseR5

  • button
  • input
  • overlay
  • table

When to use

  • A button labelUse: A common verb that says what happens next. Not: "Submit" or "Proceed". Common words are understood by the most people.“Continue”
  • The words of an errorUse: Say what is wrong, where, and exactly how to fix it. Not: "Invalid input". People must be able to fix the error without help.“Enter your date of birth. For example, 27 3 1980.”
  • A success messageUse: Confirm what happened and what comes next. Not: A confirmation with no next step. People need to know the task is finished and what happens now.“We have your application. We will email you within 5 working days.”
  • An empty stateUse: Explain what will appear here and how to start. Not: A blank page. A blank page leaves people unsure if something failed.“You have no saved applications. Start a new one below.”
  • A confirmation questionUse: Say what will happen in plain words, and offer a way back. Not: A double negative. Plain words prevent a choice people did not mean.“Do you want to cancel your application? Your answers will be deleted.”
  • A first visitUse: Say how many steps there are and how long it takes. Not: Marketing copy. Knowing the length lowers effort and anxiety.“This takes about 10 minutes. There are 4 steps.”

All voice and tone tokens

5 tokens · each decision and the primitive it points to

  • Decisions · 5content.action.commitContinuecontent.action.cancelGo backcontent.action.destroyDeletecontent.action.retryTry againcontent.action.empty-actionStart a new application

Decisions reference primitives, so changing one primitive updates every decision and component that uses it.

Voice and tone in Accessible first: plain and direct. Every sentence is easy to read on the first try. Words decide whether a form gets finished.