Skip main navigation
We use cookies to give you a better experience, if that’s ok you can close this message and carry on browsing. For more info read our cookies policy.
We use cookies to give you a better experience. Carry on browsing if you're happy with this, or read our cookies policy for more information.

Pattern Library
Microcopy

Text is prevalent throughout the FutureLearn platform, and using text consistently and clearly is a critical component of UI design.

Labelling & capitalisation

Labels for interface elements should be clear and easy to understand. We try to be as specific as possible in any element that require the user to make a choice, such as radio buttons, checkboxes, and push buttons. We always aim for short, concise labels, whilst never sacrificing the clarity of the explanation with a shorter label.

We capitalise interface labels in sentence style. Sentence style means that the first word is capitalised, and the rest of the words are lowercase, unless they are proper nouns or proper adjectives.

Examples of correct capitalisation in labels:

  • Mark as complete (not ‘Mark as Complete’)
  • Sign in (not ‘Sign In’)
  • Join this course (not ‘Join This Course’)

The title case, where every word is capitalised, is not generally used for interface labelling but it is used in other elements, such as course titles. The use of title case is documented in more detail in a separate ‘Tone and Style’ guide, used by everyone who creates content for the courses.

Abbreviations

Abbreviations can save space in a user interface, but they can be confusing if users don’t know what they mean. It is therefore important that we use abbreviations consistently. Here is a list of abbreviations used throughout the FutureLearn platform (Source: Oxford English Dictionary).

  • Day of the week: Mon, Tue, Wed, Thu, Fri
  • Months: Jan, Feb, Mar, Sep, Oct, Nov, Dec
  • Time units: min (minute), mins (minutes), hr (hour), hrs (hours)

Where there is not enough space to show even the abbreviation (e.g. on small screens) they may be abbreviated to 'm' for minutes and 'h' for hours as on the Comments block on smaller screens.

Dates

Long date

This is the preferred date format to use on the platform:

28 April 2017

Date.today.to_s(:futurelearn_long_date)

Date

When the long date takes up too much space this format that abbreviates the month may be used:

28 Apr 2017

Date.today.to_s(:futurelearn_date)

Short Date

When there is a small amount of space this format that omits the year may be used. This must only be used when there is no ambiguity as to which year the date refers to.

28 Apr

Date.today.to_s(:futurelearn_short_date)

Guidelines for writing feedback messages

Don’t use redundant words

Avoid using words that add no value to the message, such as “something happened successfully.” Don’t overuse “please”. Aim to be direct and to the point.

Use contractions

Use shortened version of words or word groups, to sound less formal, e.g. “We’ve” rather than “we have”, “thanks” rather than “thank you.”

Avoid passive voice

Say “We couldn’t change your password” rather than “Your password could not be changed.” Passive voice makes us sound robotic.

Don’t sound robotic...

Aim to sound human and avoid messages such as “This session has been terminated.”

...But avoid an overly jokey, light-hearted tone

Stay true to FutureLearn’s personality. Generally we wouldn’t say something along the lines of "Woohoo! You’re a rock star!”.

When something goes wrong, take responsibility...

Say “We couldn’t [do something]”, rather than “You failed” e.g. “We couldn’t sign you in.”

But when there’s a success, give credit to the learner

Say “You’ve done it,” e.g. “You’ve changed your email address,” rather than “We’ve changed your email address.”

Use full-stops and commas correctly

Remember to put full stops at the end of every message. Don’t link separate sentences with commas – use a full stop or a dash, e.g. “We couldn’t change your password. Check below and try again.”

Tell people what to do if something goes wrong

It’s always best to prevent errors from happening. But if an error must be displayed, try to suggest, when possible, what people can do to correct it.

Yours vs Mine

There’s been a lot of debate about Yours vs Mine in UI design and copywriting recently, for example here and here.

The consensus is that we should see UI as a medium to hold a dialog with the user. This means that when we are “talking” to the user we should say “You,” e.g. Your Courses, Your Progress, etc. But when the user is “talking” to us, “I” or “Me” is more appropriate, e.g. “Email me when I have a new follower.”