The Language of Interfaces

Supporting blog posts
http://blog.intercom.io/writing-an-interface/
http://contrast.ie/blog/the-language-of-interfaces/

A presentation discussing the role of content in interfaces, what it influences, and why it is so important.

Transcript

1. I com.
2. T nguage t fac D Trayn @ rayn
3. 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
4. Web S A Turn g I o Web A s
5. A bombs
6. “Five y rs from now, ’ be no such g a webpage.” - Jim B l n
7. W t A s?
8. F ums Netw ks Loc n-a s Pho -a s So al sho g FB a s W t A s?
9. T Web Is Be g Rebuilt Ar Peop Paul Adams @pa ay
11. Build g a so al web a a gamb c t t
12. T se guys bet peop w ld fi box.
13. T se guys bet peop w ld wr e “wa s”
14. T se guys bet peop w ld know w t a “Wave” w
15. T se guys bet peop w ld know w t a “Wave” w
16. T peop come ad c t t
17. T c t t c by peop
18. T age old prob m
19. Th do n’t m n ’s luck. C t t c trols .
20. Y c trol 3 gs
21. Y c trol 3 gs 1. T UI
22. Y c trol 3 gs 1. T UI 2. T b nk s te
23. Y c trol 3 gs 1. T UI 2. T b nk s te 3.T C t t Defin n
24. 1. Us I face Microcopy
25. L guage fl be v ur
26. T Sapir Wh f T s L gu c R iv y
27. T UI fl Ac s & R nships
28. INSERT INTO tweets NEW TWEET VALUES ("11012314", "destraynor", "Just ate breakfast LOL!", "Dublin, Ireland"); Tw ng - Not so sexy now, ?
29. T y c ld ve ca S , upd e, p t, y g
30. It’s not A e. Love. Ag e.
31. But No e “Lik ” a m s g c
32. Y sh ldn’t ‘like’ a s g s h
33. But y c +1 se gs.
34. Y get w t y k f ...
35. W t’s g?
36. W t’s y r m d?
37. It’s a same. It’s a diff t
38. Y get w t y sign f . Lik e cu cy In agram
39. Tw t ab t tw ts
40. Tw t ab t tw ts
41. W ds Infl e R nships
42. “L k we d ’t n d put a b , do we?”
43. I ve 281 fri ds Faceb k. But I w ldn’t cr s road say hi 240 m
44. I’m okay w h “fo ow g” 459 peop
45. 54 fri ds cl m k.
46. L k In ks difficult q n, Thus, fri d n’t m n g .
47. 2. T “B nk S te” f new us s
48. I’ve z o fri ds, W t s t gs do peop wr e ?
49. El rly P ts Faceb k...
50. El rly P ts Faceb k...
51. Why sh ld I say y g? No e se .
52. Talk rad . DJ sets ne. Ev y e se fo ows .
53. How did Y tube co ts get so m ic?
54. How did Y tube co ts get so m ic?
55. Yah ! Answ s. W id cy & ir y co i
56. T “hug” ck.
57. How did Qu a get so f mal?
58. How did Qu a get so f mal?
59. Get S fac k ps d cu n vil
60. No exc m n m ks.
61. No typ sh ng.
62. 3. T C t t Defin n
63. Who s w t a view ?
64. Who s w t a view ?
65. A S views e bad.
66. Peop give low views g , but exp sive a s
67. A simp solu w ld be k bo . QUal y ˒˒˒˒˒ Val : ˒˒˒ˑˑ
68. 2 Bad Examp s W n c t t go bad
69. Give y r fri d 3 l t s ov Wifi
70. G f tu . N ds a name...
71. Squi ! Y , I’m s us
73. “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.”
74. So, W t w t wr g ?
75. 1. Bad s ds, bad samp c t t
76. 2. Vag c cepts. “New wave” “D e”
77. Y s w t s?
78. Th gs-E i -To-U -TH -Wave
79. 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...
80. We’ve tabl d w ds e imp t t web a s.
81. Wireframe Visual Design Build Q.A. Release “Submit” “Submit” T sw s c e mo l fects C t t ’s “alright” surviv
82. 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.
83. Not always :)
84. T ro C t t a sign
85. I com.
86. 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
87. Who?
88. Who? New vs turn g P mium vs f e Adm vs gu r us “ev y us ”
89. W t?
90. 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
91. T e
92. T e C ual & fri dly Bus s gl h Abu tly c Cute & fu y
93. Time
94. Time “On next log ” “By email i t y” On sc raight away Dur g w k g h rs ir me z e
95. How?
96. How? By email? By sc fl h m sage Text a (space?) By SMS In ir c ds Aud effect
97. 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
98. Bad sw s
99. 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
100. “David al ady chiv two m ut ago”
101. 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
102. “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!!”
103. How P ic say k y .
104. How A L gus say k y . Badly.
105. C t t a s always o tun y light y r us s
107. * 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
108. T nk y ! @ rayn
109. I com.