Slide 1

Slide 1 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Writing is designing Words and the user experience

Slide 2

Slide 2 text

I’m Michael. I’m a Senior UX Architect at Allstate focused on Conversation Design. I use he/him pronouns.

Slide 3

Slide 3 text

Thank you these folks for making tonight happen: Cate Kompare Kin + Carta Jen O'Brien Kelsey Peters

Slide 4

Slide 4 text

A special thank you to everyone in this photo:

Slide 5

Slide 5 text

writingisdesigning.com • Get your copy of the book • Subscribe to our monthly newsletter • Find out where we’re speaking/teaching STAY IN TOUCH:

Slide 6

Slide 6 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Writing is designing Words and the user experience

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle For showing your customers why this type of work is important. Thanks, Amazon

Slide 9

Slide 9 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle What are the right words for this BUTTON ?

Slide 10

Slide 10 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Writing is about fitting words together. Designing is about solving problems for your users.

Slide 11

Slide 11 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle To find the right words, writing and design need to team up in your brain and work together.

Slide 12

Slide 12 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle I work on digital products and physical goods, so I’m deeply involved in the design process. But I also want to call out early that my process is the design process. I don’t write fiction or short stories; I use language to solve problems—whether that’s behind the scenes or in the product itself. I use words as material. " Nicole Fenton Co-Author, Nicely Said Source: http://nicolefenton.com/words-as-material/

Slide 13

Slide 13 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Words are everywhere Errors are opportunities Writing is designing

Slide 14

Slide 14 text

So. Many. Words. How digital products rely on language

Slide 15

Slide 15 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle

Slide 16

Slide 16 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle

Slide 17

Slide 17 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle

Slide 18

Slide 18 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle If you really want to get familiar with a company’s value proposition, try fitting it across the top of four screenshots in the app store. App store

Slide 19

Slide 19 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Do it again, but make it unique from the app store stuff while encouraging account creation. Onboarding

Slide 20

Slide 20 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Log In, Sign In, Register, Create Account, Get Started, Sign Up, Connect, Username, User ID, Password, Passphrase, Recover, Reset, Email, Email Address Access

Slide 21

Slide 21 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Whoops, Sorry, Oops…, We broke something, Just a moment, Please wait, There was a problem, Something’s Wrong, Invalid, Incorrect, Don’t Worry Errors

Slide 22

Slide 22 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Account, Profile, Settings, My Account, Your Profile, Your Settings, Personal Details, Personal Information, Credit Cards, Payment Information, Payment Methods, Preferences Administration

Slide 23

Slide 23 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Cart, Shopping Basket, Items, Payment, Renewal, Subscription, Recurring, Repeating, Pro-Rated, Discount, Initial Payment, Checkout, Buy, Complete Purchase, Burger Me! Buying stuff

Slide 24

Slide 24 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle • SMS notifications • Push notifications • Email notifications • Confirmation emails • Account recovery emails • Email validation emails (emails about emails) • Re-engagement emails • Release notes (bug fixes and performance improvements) • Help content • Terms and conditions • Privacy policy • Contact forms • Contact form confirmation screens and emails And that's just the obvious stuff...

Slide 25

Slide 25 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle So if words are such an important part of design, why do we often think of design in terms of visual tools?

Slide 26

Slide 26 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Should I use Sketch, Figma, or Adobe XD to design this interface?

Slide 27

Slide 27 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Don't mistake making a deliverable with making a difference.

Slide 28

Slide 28 text

Errors & Stress Cases What to do when things go wrong

Slide 29

Slide 29 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle What's an error?

Slide 30

Slide 30 text

9/14/1915 BIRTHDATE Please check the birthdate and try again.

Slide 31

Slide 31 text

What are your users doing? • A highly stressed parent trying to find the right medicine for their sick child. • A newly engaged couple trying to figure out how to request a marriage license. • A student try to look up their recent test scores. • A driver who was just involved in a car accident trying to schedule and pay for repairs.

Slide 32

Slide 32 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Each error represents a moment where the needs of your users conflict with the needs of your system. Error are opportunities.

Slide 33

Slide 33 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Where you find sustained success driven by recommendations, you find badass users. Smarter, more skillful, more powerful users. Users who know more and can do more in a way that’s personally meaningful. " Kathy Sierra Author, Badass: Making Users Awesome

Slide 34

Slide 34 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Writing error messages: 1. Avoid 2. Explain 3. Resolve

Slide 35

Slide 35 text

Best error ever? Source: https://twitter.com/tobiassjosten/status/448239841679929344?s=21

Slide 36

Slide 36 text

2. Define 3. Develop 4. Deliver Source: https://www.designcouncil.org.uk/news-opinion/design-process-what-double-diamond The Double Diamond 1. Discover

Slide 37

Slide 37 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle In all creative processes a number of possible ideas are created (‘divergent thinking’) before refining and narrowing down to the best idea (‘convergent thinking’), and this can be represented by a diamond shape. But the Double Diamond indicates that this happens twice – once to confirm the problem definition and once to create the solution. One of the greatest mistakes is to omit the left-hand diamond and end up solving the wrong problem. " The U.K. Design Council Creators, The Double Diamond

Slide 38

Slide 38 text

2. Define 3. Develop 4. Deliver 1. Discover Source: https://www.designcouncil.org.uk/news-opinion/design-process-what-double-diamond The Double Diamond

Slide 39

Slide 39 text

Best error ever: Source: https://twitter.com/tobiassjosten/status/448239841679929344?s=21

Slide 40

Slide 40 text

Scenario: Check deposits through an app

Slide 41

Slide 41 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Writing error messages: 1. Avoid 2. Explain 3. Resolve

Slide 42

Slide 42 text

Avoid The "Next" button isn't active until the user enters the amount and takes photos of the check. • The "Deposit amount" field is visually prominent • The app teaches its users what to do by progressively activating UI

Slide 43

Slide 43 text

Avoid However, something like this can only take you so far. • If a user enters an amount then deletes it, you still need to show a message. • Be wary of accessibility concerns as well—disabling UI can cause issues for visually impaired users.

Slide 44

Slide 44 text

Explain Tells the user quickly and clearly what went wrong. • Doesn't tell users what the limit is • Doesn't serve users who want to know more about the deposit limit • When unsure, test.

Slide 45

Slide 45 text

Resolve Tell the user what to do next. Help them finish their task.

Slide 46

Slide 46 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Error messages Activity

Slide 47

Slide 47 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Your team is designing and building a sign-up flow for an online insurance company. The law says that account holders must be 18 years of age or older, and you've been asked to handle the error state for when users are younger than 18. Scenario Activity 1. Write down ideas for avoiding, explaining, or resolving the error. 2. Write a draft of your error message.

Slide 48

Slide 48 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle How did it go? Discussion

Slide 49

Slide 49 text

Writing is designing Find the words for the people you serve

Slide 50

Slide 50 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Your writing should be.... 1. Usable 2. Useful 3. Responsible

Slide 51

Slide 51 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Your writing should be.... 1. Usable 2. Useful 3. Responsible

Slide 52

Slide 52 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle A link that takes you to the app's search feature is way more usable than trying to explain where the search icon is. Help users do stuff

Slide 53

Slide 53 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Figure out if people can use the words you've written.

Slide 54

Slide 54 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Sarah Richards, author of Content Design, points out that if the words you write for something aren’t accessible to everyone, you’ve made a design choice that prevents people from using that thing. Source: https://www.confabevents.com/videos/accessibility-is-usability

Slide 55

Slide 55 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Source: https://www.researchgate.net/publication/33994535_Toward_a_social- cognitive_psychology_of_speech_technology_electronic_resource_affective_responses_to_spe ech-based_e-service In a study with 821 participants, customer service behavior was found to be one of the four most important usability factors out of 76 possibilities. Melanie Polkosky, PhD Toward a Social-Cognitive Psychology of Speech Technology: Affective Responses to Speech-Based e-Service "Customer Service Behavior included items that were related to the friendliness and politeness of the system, its speaking pace, and its use of familiar terms."

Slide 56

Slide 56 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Human communication is the most important gift we have, whether it’s through speech or writing. I really do think that human beings are worth fighting for, especially as technology overtakes more and more of what it means to be human. " Melanie Polkosky, PhD Author, Uncovering Truffles: The Scarcity and Value of Women in STEM

Slide 57

Slide 57 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Your writing should be.... 1. Usable 2. Useful 3. Responsible

Slide 58

Slide 58 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle The team responsible for this reservation system is using writing and design to force people into the loyalty program and email lists when they're just trying to book a room. Do what users want

Slide 59

Slide 59 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Creating legal agreements that use plain language so people can actually understand what they're agreeing to? Very useful. Explain yourself

Slide 60

Slide 60 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Writers need to understand a product's purpose and their users' needs to create useful experiences.

Slide 61

Slide 61 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle I feel like I always need the full context of what I’m solving for, so it’s best for my work when I’m able to be in environments where I can get it. If you’re joining a project at the very end and there’s low tolerance for questions, it’s a sign your role as writer hasn’t been well positioned or isn’t well understood. " Katie Lower Designer and Writer

Slide 62

Slide 62 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Your writing should be.... 1. Usable 2. Useful 3. Responsible

Slide 63

Slide 63 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle An accidental tap could make you seem like a complete jerk to someone who just lost their job. Harmless?

Slide 64

Slide 64 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle We know that words can really hurt people or help them in their personal lives. We can say really reassuring words to people, and it has this huge impact, and we can say hurtful words, and it can have a years-long impact, but we don’t really treat the words we write in interfaces that way. " Natalie Yee UX Designer

Slide 65

Slide 65 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Think about a "News Feed".

Slide 66

Slide 66 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle News is the feedback mechanism of our society; we vote based on the things we learn in the news. When we take a concept like that and we subvert it for commercial use, that’s something that should give you pause. " Jorge Arango Author, Living in Information

Slide 67

Slide 67 text

@writingisdesign | ©2020 Michael J. Metts and Andy Welfle Interfaces depend on language Words are everywhere Avoid, explain, and resolve Errors are opportunities Usable, useful, and responsible Writing is designing

Slide 68

Slide 68 text

Thanks! Time for some Q&A

Slide 69

Slide 69 text

Books are available tonight for $30. Stickers and words of affirmation are also available.

Slide 70

Slide 70 text

Thank you to the fine folks at Adobe Design: Jamie Myrold, VP of Design Shawn Cheris, Director of Centralized Design Bailey Sharrocks for planning this event Rob Gianino and the Design Enrichments team Cassarie Soungpanya and the DesignOps team

Slide 71

Slide 71 text

Thank you to the Adobe Design Content Strategy team: Amy Adkins Bria Alexander Brandon Bussolini Beth Anne Kinnaird Jess Sattell Sarah Smart Karissa Urry Marisa Williams

Slide 72

Slide 72 text

Thank you to everyone who helped make this book a reality: Rosenfeld Media: Lou Rosenfeld Marta Justak Adeline Crites-Moore Technical Reviewers: Jonathon Colman Andrea Drugay Ryan Farrell Scott Kubie Chelsea Larsson Rachel McConnell Kathryn Strauss Sophie Tahran Susan Thome Natalie Yee Contributors and Blurbists: Sara Wachter-Boettcher Jonathon Colman Andrea Drugay Erika Hall Kristina Halvorson Sarah Richards Matt Shearon And many more! Interviewees: Hillary Accarizzi Jorge Arango Alicia Dougherty-Wold Michaela Hackner Lauren Lucchese Katie Lower Matt May Anna Pickard Ada Powers Melanie Polkowsky Jasmine Probst John Saito

Slide 73

Slide 73 text

A special thank you to everyone in this photo:

Slide 74

Slide 74 text

WritingIsDesigning.com • Get your copy of the book • Subscribe to our monthly newsletter • Find out where we’re speaking/teaching STAY IN TOUCH: