Copywriting for UX

Понравилась презентация – покажи это...

Слайд 0

Copywriting for UX Talisa Chang | @talisa

Слайд 1

What people ask designers: Can you make this look better?

Слайд 2

What people ask copywriters: Can you make this sound better?

Слайд 3

What they mean in both cases: Can you make this experience intuitive and compelling for the person who will be using it?

Слайд 4

My background Hats I’ve worn: • UX Designer • UX Researcher • Copywriter • Product Marketing Manager • Brand Consultant • Brand Manager • Digital Strategist • Content Strategist • Reporter • “Talisa-fier” • “All of the words” +

Слайд 5

Like design, copy is more than the sum of its parts words. Brand Desirability Usability Utility

Слайд 6

Considers the user Just like good UX, good copy… Who’s reading this? What background knowledge do they have? What are their goals? What are their pain points?

Слайд 7

Considers the context Just like good UX, good copy… Where are they physically? What device are they using? Are they in a rush? Have they been to this page/screen before? How often?

Слайд 8

Just like good UX, good copy… Considers the flow What did they do before this? What can they do next?

Слайд 9

Just like good UX, good copy… Considers the business goals Ideally, what would we like them to do?

Слайд 10

Just like good UX, good copy… Considers the brand How do we want the overall experience to feel?

Слайд 11

Where do all the words go?

Слайд 12

Where do all the words go? • Interfaces • Landing pages • Emails • Navbars • Empty states • Blog posts • Drop downs • Onboarding • App store descriptions • Form fields • Coach marks • Social media posts • Tool tips • Confirmation pages • Social media ads • Error messages • Support articles • Press releases • Loading screens • Product videos • Style guides • Settings pages • Call scripts • etc.

Слайд 13

Wait, so who is supposed to make/write all this stuff?

Слайд 14

If you are lucky… A few people whose explicit job is to write it (content strategists, copywriters, email marketers, etc.) … who have created and/or are following guidelines for how to write it … and are in constant communication with designers, engineers, support, marketing, sales, etc. … to ensure there is a consistent, cohesive narrative to the experience

Слайд 15

But at a lot of places, it’s... ● ● ● ● Designers, kind of Someone from marketing, sometimes Whoever is the best speller on the team Whoever happened to bump the fidelity from lorem ipsum → real words ● Whoever realized copy was needed somewhere and put it there as they were making it (probably a developer)

Слайд 16

How to write thoughtful copy

Слайд 17

Good copy reduces ambiguity ● It’s specific ● It’s readable at all viewport widths ● It’s concise ● It’s contextual ● It’s consistent ● It labels objects clearly ● It speaks in plain language (no jargon)

Слайд 18

Good copy puts the audience first ● Considers the context and flow (use personas, user journeys, and user flows) ● Considers goals and motivations ● Offers actionable information ● Explains why, not just what ● Is translation-friendly

Слайд 19

Good copy is well-researched ● Research conventions ● Ask your subject matter experts ● Ask your community members ● Put it in your (early) prototypes ● Put it in your usability tests ● Test it in emails ● Card sort it ● A/B test it

Слайд 20

Good copy is well-researched ● Research conventions ● Ask your subject matter experts ● Ask your community members ● Put it in your (early) prototypes ● Put it in your usability tests ● Card sort it ● A/B test it ● Test messaging with email

Слайд 21

PSA: No one reads on the internet.

Слайд 22

So make it count.

Слайд 23

Especially when…

Слайд 24

...the stakes are high ● ● ● ● ● ● ● ● ● CTAs Navigation Instructions Errors Important forms and documents Customer support Privacy concerns Things that cost money Any situation where users are willing to read

Слайд 25

… the stakes are low ● ● ● ● Loading screens App store update copy Non-critical notifications Any place you can push the brand voice without risking clarity

Слайд 26

Extra words or explanatory text can’t “fix” poor UX. But copy can help make good UX even better.

Слайд 27

How copy gets created

Слайд 28

With spreadsheets and google docs Email Spreadsheet Onboarding flow Hi {Name}, Your call for Wednesday January 4th at 12pm is confirmed! Please [review your welcome packet] before hand and be sure to be at your computer. [Review the packet] Looking forward to speaking with you, Support Team Google doc with body copy

Слайд 29

Using spreadsheets Basic Process ● Designer or product manager creates a content spreadsheet in google docs ● Add columns for states, errors, tooltips, versions, etc. ● Copywriter and various stakeholders can fill out Benefits ● Allows you to organize a lot of copy ● Flexible: can link out to other docs if necessary, colorcode columns, merge sections, etc. ● Engineers can see all states, errors, tooltips, etc even if they’re not represented in the design ● Same commenting features as all google docs

Слайд 30

Using InVision comments Basic Process ● Designers upload wires to InVision via Dropbox ● Copywriters use comment feature to suggest copy ● Designers update copy and re-sync via Dropbox Benefits ● Copy edits can be placed directly onto the design ● Commenting feature allows for questions, feedback, etc. (participants get email notifications) ● Easy to share with stakeholders for review; no account needed to view or comment ● Already set up to test prototype with user ● No different versions of marked up pdfs floating around

Слайд 31

Using Google docs Basic Process ● Put screenshots of designs that need new copy into a google doc (and label them/explain where they are in the flow) ● Write/suggest new copy underneath ● Protip: highlight the actual interface/UI copy in a separate color Benefits ● Quick and dirty ● Plenty of room to add additional copy (states, errors, etc) ● Team members can easily comment, suggest edits, see revision history, etc

Слайд 32

Notes on process ● As soon as you know you need words, start thinking about how and when they’ll be created and finalized. As a designer, it’s your job to care about copy ● Don’t wait for a finished mock up. Let copy start anywhere, with anyone. (The sooner, the better) ● Get organized. Make simple checklists, schedules/deadlines, and spreadsheets as needed. ● Involve product managers to help keep things organized, but *stay close to the process*

Слайд 33

Notes on process, cont ● Requests to the person writing copy should always include context (full screenshots and/or screen flows, word counts, goals, translation deadlines, etc) ● Allow time for revisions, especially if the initial copy lives outside of the design in a doc ● Consider the brand. Work with your marketing team. ● Consider the implications. Work with your customer support team. ● Consider the flow and functionality. Work with your engineers/designers/product owners. ● No waterfalling! Pair copywriters with designers throughout the process.

Слайд 34

Brand, style, and content guides

Слайд 35

Brand Positioning The result of business and brand research, stakeholder interviews, workshops, etc. Could be used internally or externally. Could be created by an in-house marketing team or by an agency. Could be robust and polished, or brief and in a google doc. May include: brand pillars, mission/vision statements, about us copy, key messaging, naming and lexicon, etc. brand.quantcast.com

Слайд 36

Content Guides The result of collaboration between marketing, product, and other stakeholders Can serve as a guide across teams (sales, customer support, etc) Should be actionable and include specific examples, do’s and don’ ts May include: voice and tone, grammar rules, capitalization rules, naming and glossaries, do’ s and don’ts, etc.

Слайд 37

MailChimp: The Content & Copy Pros | http://voiceandtone.com | http://styleguide.mailchimp.com

Слайд 38

18F: Made for the federal government; a great starting point for you | https://pages.18f.gov/content-guide/

Слайд 39

Product + Marketing = Product Marketing ● The glue between product and marketing ● Sometimes a dedicated role or team, sometimes just a process ● Helps ensure the story of your product or feature is told externally (blog posts, press outreach, support faqs, app store copy, etc) ● Helps ensure the story is reflected in the product (interfaces, error messages, notifications, etc) ● May entail: launch checklists and copy processes, messaging docs, brand positioning, market research, new naming, email or blog copy, social media strategy, pr plans, app store copy

Слайд 40

I need a copywriter. Can I hire you?

Слайд 41

Just like good UX, good copy is not just a role you can hire for and be done with.

Слайд 42

How to get started at upping the copy game at your organization:

Слайд 43

1. Figure out what you need. Content strategy? Style guidelines? Consistent naming and language? Taxonomy/lexicon? A unified voice and tone? Brand positioning/messaging? Interface copy? Landing pages? Translations and localized copy? Onboarding emails? Transactional emails? Lifecycle emails?

Слайд 44

2. Figure out how (or by whom) it’s getting done today and what the biggest priorities and gaps are. It’s probably a combination of people in marketing or product. At a minimum, it’s whoever is writing the copy now, and/or whoever is signing off on it.

Слайд 45

3. Make a commitment to make copy part your design process and start asap. This may require upfront work (developing guidelines, messaging, etc). It will also mean making changes to how things currently get shipped. It won’t happen overnight. But you’ll be very happy you did it.

Слайд 46

4. Hire accordingly and keep iterating. Don’t hire until you have a sense for what you need. Don’t hire until you’re ready to make some changes to your processes.

Слайд 47

Talisa Chang is an interdisciplinary product and UX consultant. Find her on Twitter, Linkedin, Medium, or her website.

Слайд 48