improve the silence: creating effective interface language

166
Improve the Silence Creating Effective Interface Language

Upload: erika-hall

Post on 27-Jan-2015

107 views

Category:

Design


0 download

DESCRIPTION

Slides from a workshop on interface language. Also, Louis CK is the best interface writer out there.

TRANSCRIPT

Page 1: Improve the Silence: Creating Effective Interface Language

Improve the SilenceCreating Effective Interface Language

Page 2: Improve the Silence: Creating Effective Interface Language

Our Agenda

Part 1Intro to Interface LanguageDon’t Call it MicrocopyRole and VoiceWords and Pictures

Break

Part 2RecapitulationThe Functions of WordsWorking Across DevicesTrainwrecksConclusion

Page 3: Improve the Silence: Creating Effective Interface Language

Text

Page 4: Improve the Silence: Creating Effective Interface Language

Introduction

Page 5: Improve the Silence: Creating Effective Interface Language

Orality knits persons together into community.

Walter Ong, 1982

Page 6: Improve the Silence: Creating Effective Interface Language

Oral Culture LiteracySecondary

Orality

Page 7: Improve the Silence: Creating Effective Interface Language

“Tell me, O muse, of that ingenious hero who travelled far and wide after he had sacked the famous town of Troy.”

Page 8: Improve the Silence: Creating Effective Interface Language

“MY DEAR AND HONORED FRIEND: I have often been desirous of writing to thee, but could not be reconciled to the thought that the letter might fall into the hands of the British, lest some printer or busy-body should publish some part of the contents, and give our friend pain, and myself censure.

Page 9: Improve the Silence: Creating Effective Interface Language
Page 10: Improve the Silence: Creating Effective Interface Language

Secondary orality is post-literate.

Page 11: Improve the Silence: Creating Effective Interface Language

Secondary orality allows allows for the preservation of information as texts.

Page 12: Improve the Silence: Creating Effective Interface Language

Secondary orality allows for instantaneous feedback.

Page 13: Improve the Silence: Creating Effective Interface Language

Secondary orality facilitates the development of community.

Page 14: Improve the Silence: Creating Effective Interface Language
Page 15: Improve the Silence: Creating Effective Interface Language
Page 16: Improve the Silence: Creating Effective Interface Language

“Tell me, O muse, of that ingenious hero who travelled far and wideafter he had sacked the famous town of Troy.”

“MY DEAR AND HONORED FRIEND: I have often been desirous of writing to thee, but could not be reconciled to the thought that the letter might fall into the hands of the British, lest some printer or busy-body should publish some part of the contents, and give our friend pain, and myself censure.

“Darth Badger Don’t Care.”

Page 17: Improve the Silence: Creating Effective Interface Language

“Tell me, O muse, of that ingenious hero who travelled far and wideafter he had sacked the famous town of Troy.”

“MY DEAR AND HONORED FRIEND: I have often been desirous of writing to thee, but could not be reconciled to the thought that the letter might fall into the hands of the British, lest some printer or busy-body should publish some part of the contents, and give our friend pain, and myself censure.

“Sign up now.”

Page 18: Improve the Silence: Creating Effective Interface Language

We aren’t writing, we are speaking in text

Page 19: Improve the Silence: Creating Effective Interface Language

An interface is a conversation.

Page 20: Improve the Silence: Creating Effective Interface Language

An interface is a conversation that

takes place between a person and a

machine.

Page 21: Improve the Silence: Creating Effective Interface Language

You are the soul of that machine.

Page 22: Improve the Silence: Creating Effective Interface Language

Text

Page 23: Improve the Silence: Creating Effective Interface Language
Page 24: Improve the Silence: Creating Effective Interface Language
Page 25: Improve the Silence: Creating Effective Interface Language
Page 26: Improve the Silence: Creating Effective Interface Language

Don’t Call it Microcopy

Page 27: Improve the Silence: Creating Effective Interface Language
Page 28: Improve the Silence: Creating Effective Interface Language
Page 29: Improve the Silence: Creating Effective Interface Language

Let’s get small: App.net post: 256 charsTwitter card summary text: 200 charsFacebook og:description text: 160 charsGoogle page description: 155 charsTweet: 140 charsTweet with link: 116 charsSubject line in iOS Mail.app: 45 chars

Jeff Eaton | LullaBot

Page 30: Improve the Silence: Creating Effective Interface Language

Role and Voice

Page 31: Improve the Silence: Creating Effective Interface Language

What role?

Page 32: Improve the Silence: Creating Effective Interface Language
Page 33: Improve the Silence: Creating Effective Interface Language
Page 34: Improve the Silence: Creating Effective Interface Language
Page 35: Improve the Silence: Creating Effective Interface Language
Page 36: Improve the Silence: Creating Effective Interface Language
Page 37: Improve the Silence: Creating Effective Interface Language
Page 38: Improve the Silence: Creating Effective Interface Language
Page 39: Improve the Silence: Creating Effective Interface Language
Page 40: Improve the Silence: Creating Effective Interface Language

Everything follows from the role

Page 41: Improve the Silence: Creating Effective Interface Language
Page 42: Improve the Silence: Creating Effective Interface Language
Page 43: Improve the Silence: Creating Effective Interface Language
Page 44: Improve the Silence: Creating Effective Interface Language

Your vs My

Page 45: Improve the Silence: Creating Effective Interface Language
Page 46: Improve the Silence: Creating Effective Interface Language
Page 47: Improve the Silence: Creating Effective Interface Language
Page 48: Improve the Silence: Creating Effective Interface Language
Page 49: Improve the Silence: Creating Effective Interface Language
Page 50: Improve the Silence: Creating Effective Interface Language
Page 51: Improve the Silence: Creating Effective Interface Language

Authentic

Engaging

Specific

Appropriate

Polite

Page 52: Improve the Silence: Creating Effective Interface Language
Page 53: Improve the Silence: Creating Effective Interface Language

How Would You Fix It?

Page 54: Improve the Silence: Creating Effective Interface Language

Words and Pictures

Page 55: Improve the Silence: Creating Effective Interface Language
Page 56: Improve the Silence: Creating Effective Interface Language

When to use a word?When to use a

picture?

Page 57: Improve the Silence: Creating Effective Interface Language
Page 58: Improve the Silence: Creating Effective Interface Language
Page 59: Improve the Silence: Creating Effective Interface Language
Page 60: Improve the Silence: Creating Effective Interface Language
Page 61: Improve the Silence: Creating Effective Interface Language
Page 62: Improve the Silence: Creating Effective Interface Language

Type a WordTouch a Word

Touch a Picture

Page 63: Improve the Silence: Creating Effective Interface Language

Words Images BothSpecific

Translatable

Accessible

Sharable

Compact

Decorative

Precise

Understandable

Ambiguous

Illustrative

Monotonous

Chunky

Brandable

Editable

Page 64: Improve the Silence: Creating Effective Interface Language

Short words are best and the old words when short are best of all.”

— Winston Churchill

Page 65: Improve the Silence: Creating Effective Interface Language

Take a Break

Page 66: Improve the Silence: Creating Effective Interface Language

Improve the SilenceCreating Effective Interface Language

(Continued)

Page 67: Improve the Silence: Creating Effective Interface Language

So far...Language is an interface

Interfaces are conversationsUnderstand the role

Use verbal and visual cues

Page 68: Improve the Silence: Creating Effective Interface Language

Part 2The Functions of LanguageWorking Across DevicesTrainwrecksConclusion

Page 69: Improve the Silence: Creating Effective Interface Language

The Function of Language

Page 70: Improve the Silence: Creating Effective Interface Language

SalutationOrientation

ActionInstruction

Service

Page 71: Improve the Silence: Creating Effective Interface Language

Salutation

Page 72: Improve the Silence: Creating Effective Interface Language
Page 73: Improve the Silence: Creating Effective Interface Language
Page 74: Improve the Silence: Creating Effective Interface Language
Page 75: Improve the Silence: Creating Effective Interface Language
Page 76: Improve the Silence: Creating Effective Interface Language
Page 77: Improve the Silence: Creating Effective Interface Language

Orientation & Navigation

Page 78: Improve the Silence: Creating Effective Interface Language
Page 79: Improve the Silence: Creating Effective Interface Language
Page 80: Improve the Silence: Creating Effective Interface Language
Page 81: Improve the Silence: Creating Effective Interface Language
Page 82: Improve the Silence: Creating Effective Interface Language
Page 83: Improve the Silence: Creating Effective Interface Language
Page 84: Improve the Silence: Creating Effective Interface Language
Page 85: Improve the Silence: Creating Effective Interface Language

Action

Page 86: Improve the Silence: Creating Effective Interface Language
Page 87: Improve the Silence: Creating Effective Interface Language
Page 88: Improve the Silence: Creating Effective Interface Language
Page 89: Improve the Silence: Creating Effective Interface Language
Page 90: Improve the Silence: Creating Effective Interface Language
Page 91: Improve the Silence: Creating Effective Interface Language
Page 92: Improve the Silence: Creating Effective Interface Language
Page 93: Improve the Silence: Creating Effective Interface Language
Page 94: Improve the Silence: Creating Effective Interface Language

Instruction

Page 95: Improve the Silence: Creating Effective Interface Language
Page 96: Improve the Silence: Creating Effective Interface Language
Page 97: Improve the Silence: Creating Effective Interface Language
Page 98: Improve the Silence: Creating Effective Interface Language
Page 99: Improve the Silence: Creating Effective Interface Language
Page 100: Improve the Silence: Creating Effective Interface Language
Page 101: Improve the Silence: Creating Effective Interface Language
Page 102: Improve the Silence: Creating Effective Interface Language
Page 103: Improve the Silence: Creating Effective Interface Language

Service

Page 104: Improve the Silence: Creating Effective Interface Language
Page 105: Improve the Silence: Creating Effective Interface Language
Page 106: Improve the Silence: Creating Effective Interface Language
Page 107: Improve the Silence: Creating Effective Interface Language
Page 108: Improve the Silence: Creating Effective Interface Language
Page 109: Improve the Silence: Creating Effective Interface Language
Page 110: Improve the Silence: Creating Effective Interface Language
Page 111: Improve the Silence: Creating Effective Interface Language

Nouns are information architectureVerbs are interaction design

Page 112: Improve the Silence: Creating Effective Interface Language

Devices and Contexts

Page 113: Improve the Silence: Creating Effective Interface Language
Page 114: Improve the Silence: Creating Effective Interface Language
Page 115: Improve the Silence: Creating Effective Interface Language
Page 116: Improve the Silence: Creating Effective Interface Language
Page 117: Improve the Silence: Creating Effective Interface Language
Page 118: Improve the Silence: Creating Effective Interface Language
Page 119: Improve the Silence: Creating Effective Interface Language
Page 120: Improve the Silence: Creating Effective Interface Language
Page 121: Improve the Silence: Creating Effective Interface Language
Page 122: Improve the Silence: Creating Effective Interface Language
Page 123: Improve the Silence: Creating Effective Interface Language
Page 124: Improve the Silence: Creating Effective Interface Language
Page 125: Improve the Silence: Creating Effective Interface Language
Page 126: Improve the Silence: Creating Effective Interface Language
Page 127: Improve the Silence: Creating Effective Interface Language

Trainwrecks

Page 128: Improve the Silence: Creating Effective Interface Language

8 Kinds of Bad Oblivious

InconsistentPresumptuous

UnnaturalVague

Passive(Too) Clever

Rude

Page 129: Improve the Silence: Creating Effective Interface Language

Oblivious

Page 130: Improve the Silence: Creating Effective Interface Language
Page 131: Improve the Silence: Creating Effective Interface Language
Page 132: Improve the Silence: Creating Effective Interface Language
Page 133: Improve the Silence: Creating Effective Interface Language
Page 134: Improve the Silence: Creating Effective Interface Language
Page 135: Improve the Silence: Creating Effective Interface Language
Page 136: Improve the Silence: Creating Effective Interface Language

Inconsistent

Page 137: Improve the Silence: Creating Effective Interface Language
Page 138: Improve the Silence: Creating Effective Interface Language
Page 139: Improve the Silence: Creating Effective Interface Language
Page 140: Improve the Silence: Creating Effective Interface Language
Page 141: Improve the Silence: Creating Effective Interface Language

Don’t be presumptuous.

Page 142: Improve the Silence: Creating Effective Interface Language
Page 143: Improve the Silence: Creating Effective Interface Language
Page 144: Improve the Silence: Creating Effective Interface Language
Page 145: Improve the Silence: Creating Effective Interface Language

Unnatural

Page 146: Improve the Silence: Creating Effective Interface Language
Page 147: Improve the Silence: Creating Effective Interface Language
Page 148: Improve the Silence: Creating Effective Interface Language

Vague/Passive

Page 149: Improve the Silence: Creating Effective Interface Language
Page 150: Improve the Silence: Creating Effective Interface Language
Page 151: Improve the Silence: Creating Effective Interface Language
Page 152: Improve the Silence: Creating Effective Interface Language
Page 153: Improve the Silence: Creating Effective Interface Language
Page 154: Improve the Silence: Creating Effective Interface Language

Don’t be too clever.

Page 155: Improve the Silence: Creating Effective Interface Language
Page 156: Improve the Silence: Creating Effective Interface Language
Page 157: Improve the Silence: Creating Effective Interface Language
Page 158: Improve the Silence: Creating Effective Interface Language
Page 159: Improve the Silence: Creating Effective Interface Language

Rude

Page 160: Improve the Silence: Creating Effective Interface Language
Page 161: Improve the Silence: Creating Effective Interface Language
Page 162: Improve the Silence: Creating Effective Interface Language
Page 163: Improve the Silence: Creating Effective Interface Language

Conclusion

Page 164: Improve the Silence: Creating Effective Interface Language

Interface is a ConversationSometimes Words, Sometimes PicturesThink Big System, Not Tiny CopyKnow Your RoleBe Polite Above All

Page 165: Improve the Silence: Creating Effective Interface Language

Text

Page 166: Improve the Silence: Creating Effective Interface Language

Thanks!