Slide 1
Slide 1 text
I com.
Slide 2
Slide 2 text
T nguage t fac
D Trayn
@ rayn
Slide 3
Slide 3 text
The web is being rebuilt around people.
The content is created by the people.
Websites are turning into web-apps.
A web-app is a gamble on content.
The people use the interface to do this.
Interfaces are the language of software.
Language influences behaviour
C.S. plays an integral part in app design
We need to think skills not roles
Slide 4
Slide 4 text
Web S A Turn g I o
Web A s
Slide 5
Slide 5 text
A bombs
Slide 6
Slide 6 text
“Five y rs from now,
’ be no such g
a webpage.”
- Jim B l n
Slide 7
Slide 7 text
W t A s?
Slide 8
Slide 8 text
F ums Netw ks
Loc n-a s
Pho -a s
So al sho g
FB a s
W t A s?
Slide 9
Slide 9 text
T Web Is Be g Rebuilt
Ar Peop
Paul Adams
@pa ay
Slide 10
Slide 10 text
No content
Slide 11
Slide 11 text
Build g a so al web a
a gamb c t t
Slide 12
Slide 12 text
T se guys bet peop w ld fi box.
Slide 13
Slide 13 text
T se guys bet peop w ld wr e “wa s”
Slide 14
Slide 14 text
T se guys bet peop w ld know w t a “Wave” w
Slide 15
Slide 15 text
T se guys bet peop w ld know w t a “Wave” w
Slide 16
Slide 16 text
T peop come ad
c t t
Slide 17
Slide 17 text
T c t t c
by peop
Slide 18
Slide 18 text
T age old prob m
Slide 19
Slide 19 text
Th do n’t m n ’s luck.
C t t c trols .
Slide 20
Slide 20 text
Y c trol 3 gs
Slide 21
Slide 21 text
Y c trol 3 gs
1. T UI
Slide 22
Slide 22 text
Y c trol 3 gs
1. T UI 2. T b nk s te
Slide 23
Slide 23 text
Y c trol 3 gs
1. T UI 2. T b nk s te
3.T C t t Defin n
Slide 24
Slide 24 text
1. Us I face Microcopy
Slide 25
Slide 25 text
L guage fl
be v ur
Slide 26
Slide 26 text
T Sapir Wh f T s L gu c R iv y
Slide 27
Slide 27 text
T UI fl
Ac s & R nships
Slide 28
Slide 28 text
INSERT INTO tweets NEW
TWEET VALUES ("11012314",
"destraynor", "Just ate
breakfast LOL!", "Dublin,
Ireland");
Tw ng - Not so sexy now, ?
Slide 29
Slide 29 text
T y c ld ve ca S , upd e, p t, y g
Slide 30
Slide 30 text
It’s not A e. Love. Ag e.
Slide 31
Slide 31 text
But No e “Lik ” a m s g c
Slide 32
Slide 32 text
Y sh ldn’t ‘like’ a s g s h
Slide 33
Slide 33 text
But y c +1 se gs.
Slide 34
Slide 34 text
Y get w t y k f ...
Slide 35
Slide 35 text
W t’s g?
Slide 36
Slide 36 text
W t’s y r m d?
Slide 37
Slide 37 text
It’s a same. It’s a diff t
Slide 38
Slide 38 text
Y get w t
y sign f .
Lik e
cu cy
In agram
Slide 39
Slide 39 text
Tw t ab t tw ts
Slide 40
Slide 40 text
Tw t ab t tw ts
Slide 41
Slide 41 text
W ds Infl e R nships
Slide 42
Slide 42 text
“L k we d ’t n d put a b , do we?”
Slide 43
Slide 43 text
I ve 281 fri ds Faceb k.
But I w ldn’t cr s road say hi 240 m
Slide 44
Slide 44 text
I’m okay w h “fo ow g” 459 peop
Slide 45
Slide 45 text
54 fri ds cl m k.
Slide 46
Slide 46 text
L k In ks difficult q n,
Thus, fri d n’t m n g .
Slide 47
Slide 47 text
2. T “B nk S te”
f new us s
Slide 48
Slide 48 text
I’ve z o fri ds,
W t s t gs do
peop wr e ?
Slide 49
Slide 49 text
El rly P ts Faceb k...
Slide 50
Slide 50 text
El rly P ts Faceb k...
Slide 51
Slide 51 text
Why sh ld I say y g?
No e se .
Slide 52
Slide 52 text
Talk rad .
DJ sets ne.
Ev y e se fo ows .
Slide 53
Slide 53 text
How did Y tube co ts get so m ic?
Slide 54
Slide 54 text
How did Y tube co ts get so m ic?
Slide 55
Slide 55 text
Yah ! Answ s. W id cy & ir y co i
Slide 56
Slide 56 text
T “hug” ck.
Slide 57
Slide 57 text
How did Qu a get so f mal?
Slide 58
Slide 58 text
How did Qu a get so f mal?
Slide 59
Slide 59 text
Get S fac k ps d cu n vil
Slide 60
Slide 60 text
No exc m n m ks.
Slide 61
Slide 61 text
No typ sh ng.
Slide 62
Slide 62 text
3. T C t t Defin n
Slide 63
Slide 63 text
Who s w t a view ?
Slide 64
Slide 64 text
Who s w t a view ?
Slide 65
Slide 65 text
A S views e bad.
Slide 66
Slide 66 text
Peop give low views g , but exp sive a s
Slide 67
Slide 67 text
A simp solu w ld be k bo .
QUal y ˒˒˒˒˒ Val : ˒˒˒ˑˑ
Slide 68
Slide 68 text
2 Bad Examp s
W n c t t go bad
Slide 69
Slide 69 text
Give y r fri d 3 l t s ov Wifi
Slide 70
Slide 70 text
G f tu . N ds a name...
Slide 71
Slide 71 text
Squi !
Y , I’m s us
Slide 72
Slide 72 text
No content
Slide 73
Slide 73 text
“I w t squi y a
pictu my kids. Y c
squi me back a vi o
y r vac n. T t's a
s tw e exp i ce.”
Slide 74
Slide 74 text
So, W t w t wr g ?
Slide 75
Slide 75 text
1. Bad s ds, bad samp c t t
Slide 76
Slide 76 text
2. Vag c cepts. “New wave” “D e”
Slide 77
Slide 77 text
Y s w t s?
Slide 78
Slide 78 text
Th gs-E i -To-U -TH -Wave
Slide 79
Slide 79 text
Peop wr e be “Lik ”.
Peop tw t be tw t .
Peop fo ow b s, c se numb s
Y get c t t y s ve.
So w t...
Slide 80
Slide 80 text
We’ve tabl d
w ds e imp t t
web a s.
Slide 81
Slide 81 text
Wireframe
Visual Design
Build
Q.A.
Release
“Submit”
“Submit”
T sw s c e mo l fects
C t t ’s “alright” surviv
Slide 82
Slide 82 text
Wireframe
Visual Design
Build
Q.A.
Release
OMG_REPLACE_ME
Share
T sw s c e mo l fects
C t t ’s obv usly sh , usua y caught.
Slide 83
Slide 83 text
Not always :)
Slide 84
Slide 84 text
T ro C t t
a sign
Slide 85
Slide 85 text
I com.
Slide 86
Slide 86 text
W t do we say sc w us s click
chive, but m sage w al ady chiv by
some e ir t m so y c ’t d b chive. It’s
not r , but same me didn’t , oh
y h s w h c c l g emails w l, now
I k ab t ...H . ”
A typical c t t q n
A typical q
Slide 87
Slide 87 text
Who?
Slide 88
Slide 88 text
Who?
New vs turn g
P mium vs f e
Adm vs gu r us
“ev y us ”
Slide 89
Slide 89 text
W t?
Slide 90
Slide 90 text
W t?
C nge y r se g
Upgra y r p n
Th c ’t be d e
Y d ’t ve p m s n
Slide 91
Slide 91 text
T e
Slide 92
Slide 92 text
T e
C ual & fri dly
Bus s gl h
Abu tly c
Cute & fu y
Slide 93
Slide 93 text
Time
Slide 94
Slide 94 text
Time
“On next log ”
“By email i t y”
On sc raight
away Dur g w k g h rs
ir me z e
Slide 95
Slide 95 text
How?
Slide 96
Slide 96 text
How?
By email?
By sc fl h m sage
Text a (space?)
By SMS
In ir c ds
Aud effect
Slide 97
Slide 97 text
Message for: Any user
To tell them: They don’t need to archive,
it’s already been done
So they: Stop trying, and move on
Displayed via: Flash box on app (60 char max)
When: After user tries to archive
already archived message
Tone: Clear, personal, like a work
colleague.
Microcopy framew k
Slide 98
Slide 98 text
Bad sw s
Slide 99
Slide 99 text
R : Duplic e
Archive
E m sage
al ady chiv
Y c ’t chive a
m sage A m sag
Th m sage s b n chiv
by y e y r co g s
Y c ’t chive a
m sage A m sag
Bump
Bad sw s
Slide 100
Slide 100 text
“David al ady chiv two
m ut ago”
Slide 101
Slide 101 text
Message for: Purchasing users
To tell them: Their order is enroute
So they: Know what’s up, and feel happy
Displayed via: Email
When: Immediately upon order
Tone: Fun. Make this user laugh at
their damn keyboard.
Microcopy framew k
Slide 102
Slide 102 text
“Thanks for your order with CD Baby!
Your CD has been gently taken from our CD Baby shelves with
sterilized contamination-free gloves and placed onto a satin pillow.
A team of 50 employees inspected your CD and polished it to make
sure it was in the best possible condition before mailing.
Our packing specialist from Japan lit a candle and a hush fell over
the crowd as he put your CD into the finest gold-lined box that
money can buy.
We all had a wonderful celebration afterwards and the whole party
marched down the street to the post office where the entire town of
Portland waved 'Bon Voyage!' to your package, on its way to you,
in our private CD Baby jet on this day, Wednesday, September
19th.
I hope you had a wonderful time shopping at CD Baby. We sure
did. Your picture is on our wall as 'Customer of the Year'. We're all
exhausted but can't wait for you to come back to
CDBABY.COM!!”
Slide 103
Slide 103 text
How P ic say k y .
Slide 104
Slide 104 text
How A L gus say k y . Badly.
Slide 105
Slide 105 text
C t t a s always
o tun y light y r
us s
Slide 106
Slide 106 text
No content
Slide 107
Slide 107 text
* C t t p ys a m sive ro us be v ur
* C t t begets c t t
* T w ds y put some g, be ac
a ship, fine y r a
* C t t e p ce y r a c sh e.
Wrap up, D
Slide 108
Slide 108 text
T nk y !
@ rayn
Slide 109
Slide 109 text
I com.