Version 3.0.6

Voice & Tone

Follow these guidelines to create consistent voice and tone across all of our products. Being consistent with voice and tone helps us to achieve the Goals & Principles of ProgressUI: Human, Adaptive, Useful, Consistent, Fast, and Trustworthy.

  • Human: Empathize with your user. What do they need to know and how might they be feeling right now?
  • Adaptive: Consider the complexity of your users’ day-to-day lives. Where and when this will be read?
  • Useful: Help people find the information they need quickly and easily. Guide them through the process.
  • Consistent: Create a familiar voice and vocabulary. Use consistent tone and language.
  • Fast: Use plain language and simple sentences. Choose clarity over cleverness.
  • Trustworthy: Talk like a person and tell the truth. Use positive language and concrete examples.

Jump to: Active Voice | Formatting | Components | Payment Processing Validation | Vocabulary

Active voice focuses on the user and feels much more conversational.

The subject performs the action in active voice. In passive voice, the subject receives the action.

  • Subject + action + object
  • The subject, "you", is implied if the sentence begins with the verb. When in doubt, cut directly to the verb to give clear directions.
Do:
Select a payment method.
How would you like to pay?
Don't:
The preferred payment method must be selected.
Which payment method would you like to use?

Don't write what you wouldn't say out loud. Keep things personal, concise, and conversational.

Do:
Check your inbox for an email from EveryAction.
Don't:
For verification purposes, an email will be sent to the email address you provided.

Focus on why a feature is important to the user, rather than how they'll use it. This works especially well when writing marketing materials and when onboarding users.

Do:
Sign up for a seamless login experience across our product suite.
Don't:
Registration will allow you to quickly log into our product suite.

Use the pronoun “you” to refer to users. Don’t use “I” or “my” unless the user is agreeing to specific terms.

Do:
Change your email address in your account settings.
I agree to the terms and conditions.
Don't:
Change your email address in My Account Settings.
You agree to the terms and conditions.

Avoid using "we" unless a real person is carrying out the action.

Do:
Set your preferences to customize your account.
Don't:
We'll customize your account based on your selected preferences.

Consistent content creates a trustworthy voice. Inconsistent content can discredit your authority and create confusing experiences for the user.

Use title case for page, panel, and modal titles. Capitalise the first letter of every word except particles, prepositions and conjunctions.

Use sentence case when writing lists, paragraphs and messages. Capitalize the first letter for the first word in each sentence.

  • Title case for page, panel, and modal titles.
  • Sentence case for page content in paragraphs, lists, and messages.
  • Don't capitalize random words in the middle of sentences.
  • Always capitalize proper nouns, including names of individuals, places, and organizations

Do not capitalize:

  • Articles (a, an, the)
  • Prepositions of three or fewer letters (at, by, for, in, nor, of, on, to, up)
  • Most conjunctions of three or fewer letters (as, and, or, but, so, yet)
Do:
Create a List
Build a list of contacts
Don't:
Create A List
Build a list of Contacts

Use lowercase when writing out an email address or website URL.

  • janesmith@gmail.com
  • everyaction.com

Avoid using contractions for any information being translated for international audiences.

Use the oxford comma (also known as the serial comma) in sentences. There should be a comma after every list item (unless you’re using a bulleted or numbered list).

Do:
First name, last name, and email address
Don't:
First name, last name and email address

Do not use ampersands (&) unless it is part of a company or brand name, or you're representing "and" in a button. In all other cases, spell out the word “and.”

Do:
Search across all contacts and organizations.
Ben & Jerry's
If it's a button: Save & Continue
Don't:
Search across all contacts & organizations.
Ben and Jerry's
If it's a button: Save and Continue

Avoid exclamation marks. Use them only for really exciting, unique events.

Do:
You launched your first campaign!
Don't:
You created a new user!

When in doubt, don't bold. Bold should be reserved for content like email addresses that may require immediate action if it is incorrect. It should not be used for object names (contacts, emails, codes, etc.)

Do:
"Summer 2017 Arctic Awareness Fund" was published.
An email will be sent to janesmith@gmail.com with instructions.
Don't:
Summer 2017 Arctic Awareness Fund was published.
An email will be sent to janesmith@gmail.com with instructions.

Use quotation marks to indicate an object's name within a sentence.

Do:
"Contribution #268382" was saved.
Don't:
Contribution #268382 was saved.

Use the numeral when including a numeric count in a sentence.

  • Don't spell out the numerical value
Do:
7 contacts were updated.
You have received 5 contributions today.
This contact is in the 99th percentile for engagement.
Don't:
Seven contacts were updated.
Five new contributions today.
This contact is in the ninety-ninth percentile for engagement.

Numbers over 1,000 should include a comma. They may be abbreviated if space in the app is limited, however a dotted underline and tooltip that shows the full number is recommended for accuracy. Only show one decimal place in numbers.

  • 876
  • 2,456
  • 15,836,826
  • 2.5K
  • 15.8M

Include two decimal points for all non-whole values of currency. Currency may also be abbreviated (using K, M, and B) if the value exceeds $999.99.

  • $50
  • $88.32
  • $975.50
  • $13.7K
  • $175.2M

Use percentages in progress bars and data tables.

  • Progress bars: Use the whole number, never rounded up
  • Data tables, charts, stat boards, etc.: Use one decimal point, unless the percentage is a whole number

If used in a progress bar:

Do:
99%
Don't:
99.99% or 100%

If used in a data table, chart, stat board, etc:

Do:
99.9%
Don't:
99% or 99.99%

Spell out the day of the week and the month. Abbreviate only if space is an issue in the app.

  • January 24, 2017
  • Saturday, January 24
  • Sat, Jan 24

For months, abbreviate Jan, Feb, Aug, Sept, Nov, and Dec, but not March, April, May, June, or July.

Natural language is great for timelines and status that indicate both specific and approximate dates.

  • Today
  • Yesterday
  • 3 days ago
  • 4 months ago
  • 1 year ago

Only use numerical dates for data displayed within a table or within a date input. In general, this format is not recommended for international users who may format their dates differently.

Note: For the best experience, dates should be automatically formatted to match the user's locale and follow their local date format standards, like "DD/MM/YYYY", rather than "MM/DD/YYYY".

Input placeholders like "MM/DD/YYYY" can alleviate confusion.

Do not use "0" for single-digit months or days.

  • 1/24/17
  • 8/3/17
  • 12/22/17

Use the 12-hour clock and lowercase am or pm. Do not inlcude a space between the time and am or pm. Use a hyphen between times to indicate a time period.

  • 7:00am
  • 10:23pm
  • 7:00am-10:30pm

If indicating a time zone is necessary (EDT is implied), use the time zone’s abbreviation and write it after am or pm.

Note: Our data may not currently support needing a time zone displayed. In some cases, time zone is implied by the object (like an event's location).

  • 7:00am PT

Date and time combinations can use natural language for added friendliness.

  • Today at 1:00pm
  • Yesterday at 2:33pm

Format phone numbers without spaces between numbers. Use a country code if your user is in another country. Don’t use brackets, spaces, periods, or plus signs.

Note: Date inputs may also show additional formatting during phone number entry.

  • 555-123-4567
  • 1-555-123-4567

For the best experience, international numbers should be automatically formatted to match international phone number standards, which differ from US standards.

Use the following formats when displaying the name of contacts and users.

  • Alphabetized Data (Lists, tables, input dropdowns): Smith, Jane Abigail
  • Page Title: Jane Abigail Smith
  • Envelope Names: Jane A. Smith
  • User Names (Created by): Smith, Jane
  • Short Format User Names (If space is limited): Smith, J

Always use the full common name and official name of an organization.

Refer to Alerts for documentation on styling and usage.

Alerts inform the user of something that may need their attention. These are different than input messages, which belong to a specific object on the page. Alerts are meant to inform at a higher level in the app.

  • Be specific. Help the person understand what has occured if there is a problem and what that problem is.
  • Stay positive. When an error is caused by something the user has done, don’t criticize or blame them.
  • Be helpful. Provide a solution that the user can act on immediately
  • Avoid technical jargon. A user with little or no technical background should be able to understand what’s going on.

Use blue info alerts to inform users.

  • What happened and why is it important?
  • Whenever you can, link to additional content or help documentation to allow the user to learn more.
Do:
A new feature is available: Contact Look Up. Finding a contact is now always within reach. Learn more
Don't:
Contact Look Up was released to fix the process of finding a contact with Quick Look Up. It's the new search bar located in the header of the app.

Use green success alerts to report success.

  • Objects with unique names use ""{Object_name}" was {action}."
  • Objects without unique names use ""{Object_type} {object_name or id}" was {action}."
  • Multiple objects use "X {Object_type} were {action}."
Do:
"Fundraising Newsletter" was sent.
"Contribution #267162" was saved.
7 contacts were updated.
Don't:
Success! Email was sent.
Successfully saved.
Contacts were updated.

Use orange warning alerts to warn users.

  • Be clear and direct about potential consequences.
  • Begin with a verb to keep the focus on the user taking (or not taking) action.
Do:
Deleting this target will remove it as a recipient from all other forms.
Don't:
Your forms won't show this target anymore if you delete it.

Use red error alerts to alert users of an error that must be resolved before they can continue.

  • Begin with a verb to quickly inform the user of the required action to resolve the issue.
  • Don't blame the user for doing something wrong.
Do:
Select at least one target.
Don't:
You didn't select any targets. At least one advocacy target must be selected.

Refer to Buttons for documentation on styling and usage.

Keep text active and to the point.

  • Buttons should always contain actions. Use a verb that communicates the action you want the person to carry out
  • The language should be clear and concise.
  • Use an ellipsis icon to indicate that more followup actions will occur (Save As...)
  • It’s OK to use an ampersand (&) in button copy.
  • Use proper vocabulary for your buttons.

Make sure that each page or view has only one primary button as your suggested action. All other buttons should use the secondary button styling - within a button group if there is more than one secondary action available to the user.

Refer to Checkboxes & Radios for documentation on styling and usage.

For checkbox and radio button text, use sentence case and only end in punctuation if it is a complete sentence.

Refer to Input Tips & Messages for documentation on styling and usage.

Input messages are intended to give the user more information on how to use a specific input field, either before the field was used, or after content was entered.

  • Be helpful, clear, and concise with your instructions
  • Stay positive and avoid blaming the user for mistakes
  • Start input message with a verb if the user must take a followup action to resolve an issue
Do:
3 to 50 characters
Include at least one number or symbol (like !@#$%^)
{Field Name} is required
Don't:
Must be between 3 and 50 characters
You didn't include a special character
This is a required field

There are five types of input messages.

Tooltips add clarity to inputs by providing brief helper text that is shown on hover.

Default messages are placed below an input. They are ideal for information that must be shown to the user to ensure proper usage, like a character limit.

  • 3 to 50 characters
  • Recipients will not see this

Warning messages are placed below an input and should react to the entered value. They do not prevent the user from proceeding, but warn against actions that may have moderate to severe consequences/

  • This name is already in use. You may want to create a more unique source code.

Error messages are placed below an input and should also react to the entered value. The message prevents the users from proceeding until they adjust the value. They are most commonly used for required field validation.

  • First Name is required
  • Last Name is required

Placeholders are shown inside an input field. They are best used to hint at appropriate or suggested content, but will disappear once the input is in use.

Always communicate why a contribution did not process successfully. In some cases, you must avoid complete specificity to prevent unnecessary concern or more significantly, credit card fraud.

You have entered incorrect credit card information. Please check this information and try again.Dismiss Alert

Potential Causes & Validation Message

Do not include the bolded cause in the validation message.

  • Incorrect CVV: You have entered incorrect credit card information. Please check this information and try again.
  • Incorrect Billing Address: You have entered incorrect billing address information. Please check this information and try again.
  • Card Expired: You have entered incorrect credit card information. Please check this information and try again.
  • Card Declined: There was a problem processing your payment. Please contact your bank for more information.
  • Duplicate Charge: Your payment has not been processed because a payment with identical information was submitted very recently. Please wait one minute if you would like to try again.
  • Suspected Fraud: There was an issue processing your payment. Please contact us for assistance.
  • Unknown: There was a problem processing your payment. Please try again and contact us for assistance if the problem continues.

Add: when the action will add an item to a list or to a group of existing objects

Back: when the action will direct the user to a previous page or view, but will not discard any changes made. In some cases, the user may be prompted to either save or discard changes before being able to continue to the previous screen.

Cancel: when the action will close the current view and discard any changes made

Create: when the action will produce a new item

Compose: when talking about a message (e.g. body of an email).

Customize: when talking about settings or information that does not relate to a message being delivered to a recipient.

Delete: when the action will permanently delete an item

Personalize: when talking about a message or settings being delivered to a recipient.

Remove: when the action will take an item away from its current position or location but won’t delete it permanently

The following are examples of vocabulary that we suggest using:

Do:
Next
Finish
Edit
Enter
Was, Were
Hide, Show
Publish
Select, Deselect
Don't:
Continue
Complete, Done
Change, Modify, Update
Type
Has Been, Have Been
Close, Collapse, Open, Expand
Post
Check, Uncheck, Choose

When referring to our products, use EveryAction 8 not EveryAction8 or EA8. When referring to our entire products use the following guidelines:

Do:
CRM, Software, Platform, Features, Unified, Cloud
Don't:
Tools, Set of tools, Set of products

Search Results

Powered by