Presented on Microcopy in STC India Annual Conference, 2017. Slide deck #stcindia2017

1. Microcopy -
Tiny Words, Huge Impact!
SANGEETA RAGHU-PUNNADI
STC INDIA ANNUAL CONFERENCE 2017
08-DEC-2017

2. Agenda
• What is Microcopy?
• History of Microcopy
• Why is Microcopy Important?
• How to Write Good Microcopy?
• Let’s Start with Microcopy
• How to Implement Microcopy?

3. What is Microcopy?
• Small chunks of text that helps user perform a task
• Provides just-in-time clear instructions
• Microcopy is almost everywhere:
◦ Instructions on the user interface
◦ Confirmation messages
◦ Error messages
◦ Form fields
◦ Buttons and menus

4. History of Microcopy
• Small bits of copies on the interface
• Joshua Porter, introduced the term
“Microcopy”
• Checkout form for e-commerce project
• Billing address errors had transactions failing
Don’t be deceived by the size of microcopy. It can make or break an
interface.

5. Examples of Good Microcopy

7. Why is Microcopy Important?
Better User Experience Human Interaction
Builds Trust
Better UI Interaction
Increases Conversions Delights the User

8. How to Write Good Microcopy?
• Check the Voice and Tone of your Organization
• Keep it simple, may not be short at times
• Clear instructions.
Must answer questions, such as:
◦ What to do next?
◦ Result of click on UI?
◦ Is task complete?
◦ Why the error?
• Human touch

9. Let’s Start with Microcopy
• Microcopy lives everywhere!
• Session covers:
◦ Sign up form for Newsletter
◦ Error messages
◦ Buttons
◦ 404-Page not found

10. Sign Up Form for Newsletter
• User Emotion
• Challenges:
◦ Fear of spam
◦ Why sign up?
◦ Timing of sign up message?
• Tweaks:
◦ Interesting title and value for user
◦ Reassure no spams
◦ Frequency of newsletter
◦ Social proof
◦ Label of sign in button must also be eye catcher!
◦ Time the message

12. Error Messages
• User Emotion
• Challenges:
◦ User is annoyed!
◦ Unclear, half information
• Tweaks:
◦ What went wrong?
◦ Why?
◦ What to do next?

13. Examples of Bad Error Messages

14. How to Write Good Error Messages?
• Never blame the user
• Apologize
• Message for humans
• Technical jargons a big NO!
• Remove ambiguity
• Constructive resolution
• Tone light-hearted
Best way to avoid error messages is to avoid the error… HOW??
Proper guidance using Microcopy wherever possible 

15. Examples of Good Error Messages

17. Buttons
• User Emotion
• Challenges:
◦ Get user to click the button
◦ Generic button labels, Submit, Send, Register, Download
• Tweaks:
◦ Value instead action
◦ Button labels and Call-to-Action (CTA)
• Request a free quote today!
• Become a Member!
◦ Simple and personal labels

19. 404-Page Not Found
• User emotion
• Challenges:
◦ Dead end!
◦ Page does not exist
◦ User typed incorrect URL
• Tweaks:
◦ Explain what happened. 404 is just a number!
◦ Apologize
◦ Link to important pages: Home, Contact Page, 2-3 important links on your site
◦ Contact details of Customer Support

22. How to Implement Microcopy?
• Get buy in from all stakeholders: PO, PM, UX, Dev, L10N
• Analyze Usability testing
• Add relevant Microcopy
• Do A/B testing
• Become part of core group
Delight in small details!

23. Christopher Murphy and Nicklas Persson in their book The Craft of Words,
Part Two: Microcopy describe Microcopy as:
“The craft of words at a micro level, considering how words can satisfy a
functional requirement by aiding and improving design interactions,
enhancing interfaces for both function and delight, and helping a user on
their journey.”

25. *All images used in this presentation were sourced from the world wide web and used only for an educational purpose.