Ingrid Towey Lorena Burcher_UX Writing Workshop_UX Y'all 2022

Transcript

1. The right words in the right place at the right time UX Writing Lorena Burcher Technical Editor Writing Coach Ingrid Towey, the WriteUX Principal Technical Editor Writing Coach 1
2. 2 Who we are Ingrid (in red) has been doing UX writing since her first tech writing job in the Dark Ages. She also performs in Commedia dell’Arte, Italian Renaissance improv. Lorena has a background in translation, research, and second language acquisition. She also loves to hike!
3. Why are you here? 3
4. 4 What is UX writing? • User eXperience (UX) writing is the practice of designing the words that people see and hear when they interact with software. • It’s about designing the conversation between the product and the user. • It can be the microcopy on the user interface, words in error messages, and even comments in a configuration file.
5. 5 How many of you have already done UX writing? Raise your hands.
6. What we’ll be doing today: 6 Examples of UX writing (good and not so good) Basic principles of UX writing Exercise 1. Rewrite error messages UX writing checklist Exercise 2. Redesign a tooltip-popover hybrid
7. CONFIDENTIAL designator V0000000 7 Examples of UX writing
8. 8 What do you think of this example of UX writing?
9. Positives and negatives of the angry unicorn Does humor ever really work? 9 What fails • The problem is obviously with GitHub, and not with you. • You can contact Support or check GitHub status. • Humor can lighten the mood. What works • You have no idea what the problem is or when it will be resolved. • Humor can piss people off.
10. 10 How about this one?
11. Positives and negatives of the weeping disk Does humor ever really work? 11 What fails • The message clearly outlines a number of problems that could be causing the error. • It gives you the option to return to the home page. What works • It gives you no next steps or options. • You have to guess what to do next. • Is this really the best image to have here?
12. 12 Thank you, Abigael Donahue, for this example!
13. 13 (After)
14. Why the new 404 page is so much better 14 • Explains the reason for the error • Compassionately suggests that you might be able to find the information on another page • Includes the search box (with the text “Search PatternFly”) • Includes links to other pages: Getting Started, Guidelines, Components, and Charts
15. 15 Error VPC limit exceeded. Clean unused VPCs or increase quota and try again. Insufficient quota available You need at least 1 available VPC to create your cluster. Check your quota in your AWS account and try again. REWRITE ORIGINAL Error message example Thank you, Allison Wolfe and Dayle Parker!
16. 16 Insufficient quota available You need at least 1 available VPC to create your cluster. Check your quota in your AWS account and try again. REWRITE Explanation of changes • The heading explains the problem more clearly. • It tells you what you need to fix to achieve your goal. • It tells where to go to check you quota. It doesn’t tell you how to increase VPCs or explain the acronym.
17. CONFIDENTIAL designator V0000000 17 Basic principles of UX writing
18. 18 1. Be customer-focused and action-oriented 2. Be clear and concise 3. Lead with the benefit 4. Be consistent 5. Be empathic, but don’t stop there. Tell them what to do. Basic principles of UX writing UX writing best practices: PatternFly.org, UX Content Collective
19. 19 • The fact that this is permanent is buried. • The explanatory text is excessive and repeats prompt. Before After Permanently delete dog.proto? Caches containing data that match this protobuf type won't be managed anymore. UX writing principles: confirmation message x Delete Cancel • Permanent is now the first word you see, so it’s more likely to be read. • Explanatory text doesn’t repeat prompt, so it’s more concise. • We now have passive voice, but the emphasis is on “caches”, not on “action”.
20. 20 • Ignore doesn’t have a clear opposite, so toggling the option on and off is tricky. • “Undo ignore cache” sounds like a double negative (which can be confusing to understand and may not be easy to translate). Can we think of a verb with a clear antonym instead? Before After UX writing principles: relabeling the menu x • Mute has a clear opposite: unmute. Mute cache Unmute cache
21. 21 • The phrase “Turn all” is confusing. • It isn’t clear when the caches are “Online” or “Offline”. Before After • It makes more sense to use a standard toggle switch that the user can move between “Online” and “Offline”. Online Offline UX writing principles: toggle switch
22. 22 Access workbook and slidedeck ▸ Scan the QR code for electronic copies of the workbook and slidedeck. Lorena Burcher, lburcher@redhat.com Ingrid Towey (The WriteUX), itowey@redhat.com
23. CONFIDENTIAL designator V0000000 23 Exercise 1. Rewrite error messages
24. 24 1. Say what happened in simple terms. 2. Explain what the customer must do to return to work. 3. Avoid blaming the user. 4. Make sure the user knows how severe the error is. 5. Keep the message close to where the problem occurred. Tips for writing error messages
25. 25 1. Open your workbook to Exercise 1. 2. Select one of the two error messages listed in Exercise 1 to rewrite. 3. Work with the attendee next to you. ･ Use the principles that we’ve discussed and demonstrated to rewrite that message. ･ Be ready to share your rewritten error message with the group. 4. If you have time, rewrite the other error message too. Exercise 1. Rewrite error messages Time: 5 minutes
26. 26 Invalid AWS credentials (authentication) Unexpected authentication error on our side Try again later. If the error is not resolved, contact Red Hat Support. REWRITE ORIGINAL Our rewrite. Error message 1 Thank you, Allison Wolfe and Dayle Parker!
27. 27 AWS credentials 'access_key_id' and 'secret_access_key' cannot be empty AWS credentials not provided Enter your AWS access key ID and secret access key and try again. REWRITE ORIGINAL Our rewrite. Error message 2 Thank you, Allison Wolfe and Dayle Parker!
28. CONFIDENTIAL designator V0000000 28 UX writing checklist
29. 29 1. Remember the customer, and focus on actions. 2. Lead with the benefit. 3. Be clear and concise. 4. Be consistent. 5. Be empathic, but don’t stop there. Tell them what to do. Basic principles of UX writing UX writing best practices: PatternFly.org, UX Content Collective
30. 30 UX Writing checklist ▸ Consistent ▸ Human ▸ Obvious ▸ Tested ▸ Customer-focused ▸ Goal-focused ▸ Concise ▸ Readable
31. CONFIDENTIAL designator V0000000 31 Exercise 2. Redesign the tooltip-popover hybrid
32. 32 1. Work with the same person as in the previous exercise, or do this after class. 2. Read the context, and study the original version of this UI. 3. Rewrite the text. 4. Redesign as much of the interface as you have time. You can move links and text. Add widgets or icons. 5. If you do not finish this in class, you can continue working on it afterwards. The final slide of our presentation contains a possible rewrite. Exercise 2. Redesign the tooltip-popover hybrid Time: 6 minutes
33. Takeaways: 33 ▸ The words on the UX are the conversation between the customer and the product. ▸ These words guide the customer. ▸ Writing is a skill just like design. ▸ A good UX needs both.
34. linkedin.com/company/red-hat youtube.com/user/RedHatVideos facebook.com/redhatinc twitter.com/RedHat 34 Red Hat is the world’s leading provider of enterprise open source software solutions. Award-winning support, training, and consulting services make Red Hat a trusted adviser to the Fortune 500. Thank you
35. 35 See the next slide for our rewrite of EXERCISE 2.
36. 36 • This is a tooltip/popover hybrid. The red bar indicates a problem. • Users need to hover over the bar to see that they can diagnose the problem: the functionality is hidden. Before After UX writing principles: popover or tooltip • The tooltip is now just a tooltip. • It is clear and concise. No wasted words. • Being able to diagnose the node is no longer hidden in the tooltip/popover. The customer can get to a solution quickly. • The warning icon is more accessible. Above threshold X