writing for better user interfaces (home office)

78
Writing for better user interfaces Beth Aitman @baitman 17th October 2016

Upload: beth-aitman

Post on 14-Apr-2017

62 views

Category:

Software


5 download

TRANSCRIPT

Writing for better user interfaces

Beth Aitman @baitman

17th October 2016

In this talk

- Intro- Why does writing in UIs matter?- Types of writing:

- Naming things

- Adding extra information

Intro - UI writing - Naming - Help - Summary

About me

- I’m a technical writer- Embedded in software development teams

Intro - UI writing - Naming - Help - Summary

Technical writing is evolving

- Used to be “write us a manual”

Intro - UI writing - Naming - Help - Summary

Technical writing is evolving

- Used to be “write us a manual”- Becoming “write help for the UI”

Intro - UI writing - Naming - Help - Summary

Technical writing is evolving

The goal: “help users understand and use UIs”

Intro - UI writing - Naming - Help - Summary

Technical writing is evolving

My goal: “make UIs that are easy to understand and use”

Intro - UI writing - Naming - Help - Summary

Why do the words in UIs matter?

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Why do the words matter?

On a screen, you use words to find out what things are.

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Why do the words matter?

Without physical cues, you need new ways of explaining.

Intro - UI writing - Naming - Help - Summary

https://signalvnoise.com/posts/3404-reminder-design-is-still-about-words

Intro - UI writing - Naming - Help - Summary

Words make UIs meaningful

Intro - UI writing - Naming - Help - Summary

Thinking about words helps you make better UIs

Intro - UI writing - Naming - Help - Summary

Thinking about writing

Writing makes you ask good questions.

Intro - UI writing - Naming - Help - Summary

Thinking about writing

Questions about concepts:

- What’s this for again?- Does this concept make sense? - What does the user know about it already?- Can we make it simpler?

Intro - UI writing - Naming - Help - Summary

Thinking about writing

Questions about workflow:

- Could this workflow be simpler? - Can we do work instead of the user?- What happens when it goes wrong? - Can we avoid hitting errors?

Intro - UI writing - Naming - Help - Summary

Writing to make UIs better

It’s not just about writing well. It’s about making good UIs.

Intro - UI writing - Naming - Help - Summary

Types of UI writing

Broadly, there are two:

1. Names of things2. Extra help and information

Intro - UI writing - Naming - Help - Summary

1. Naming things (‘microcopy’)

Intro - UI writing - Naming - Help - Summary

2. Extra help and information

Intro - UI writing - Naming - Help - Summary

2. Extra help and information

Intro - UI writing - Naming - Help - Summary

First, naming things

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Skim-reading

Labels and buttons are the words that people are most likely to register.

Intro - UI writing - Naming - Help - Summary

Naming things is hard!

Intro - UI writing - Naming - Help - Summary

Three strategies for naming things

1. Think from the user perspective2. Use terminology they can understand3. Experiment with phrasing

Intro - UI writing - Naming - Help - Summary

1. Think from the user perspective

Name things from the outside of the UI.

What it does, not how it works.

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

2. Use terminology that users can understand

What do users call it?

What will they understand?

Do we need to name it at all?

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

3. Experiment with the phrasing

Intro - UI writing - Naming - Help - Summary

3. Experiment with the phrasing

Try explaining it in a sentence.

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

If it’s hard to name something - ask WHY

Intro - UI writing - Naming - Help - Summary

Do as much in the naming as you can...

Intro - UI writing - Naming - Help - Summary

Do as much in the naming as you can...

Intro - UI writing - Naming - Help - Summary

… and recognise when naming isn’t enough.

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Help and extra information

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

What information to include

What do users need to know to complete their task?

Intro - UI writing - Naming - Help - Summary

What information to include

What do users need to know to complete their task?

Look at it from both sides:

- What information can’t they do without?- What can we cut out?

Intro - UI writing - Naming - Help - Summary

Can we solve this better?

vs

Intro - UI writing - Naming - Help - Summary

What information to include

Can we make it so they need less information?

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Don’t show all the information you have

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Show help in the right place, at the right time

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Keep it structured and easy to read

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Intro - UI writing - Naming - Help - Summary

Summing up: naming things

Intro - UI writing - Naming - Help - Summary

1. Name from the user perspective2. Find the right terminology for your users3. Experiment with phrasing

Summing up: help and information

Intro - UI writing - Naming - Help - Summary

1. Work out what information users need2. If you can, make things simpler3. Keep it minimal4. Show it in the right place and time

Summing up: make better user interfaces

Intro - UI writing - Naming - Help - Summary

1. Always question what you’re writing2. Simpler things > good explanations3. Keep fighting the good fight!

Thanks for listening!Any questions?

Get in touchby email [email protected]

or twitter @baitman