As presented at @media Ajax in London on 19th November 2007. So we spent years learning our craft - specialising - reading the CSS specs in bed, hardwiring the Photoshop keyboard shortcuts into our brains, working up a usability test subject patter and playing with sticky notes. Then along came Ajax. Until that point we could safely silo ourselves, locked away in our niche specialities. But producing good _applications_ requires more than that. Yes, we need our specialist skills but without a thorough understanding of both ends of the Ajax equation the result will be an unholy mess. Interface designer Mike Stenhouse will discuss how his working life has changed, what we need to know to produce good applications for the modern web and how many times he's thrown his toys out of his pram and whined "But I'm a bloody designer!"

1. But I’m a Bloody
Designer!
Mike Stenhouse / Trampoline Systems / Donotremove1

2. Specialisation
2

3. 18/02/2005
3

4. 18/02/2005
4

5. ✤ Standards-based presentation using XHTML and
CSS
✤ Dynamic display and interaction using the
Document Object Model
✤ Data interchange and manipulation using XML and
XSLT
✤ Asynchronous data retrieval using XMLHttpRequest
✤ JavaScript binding everything together
5

6. ✤ 1996 iFrame Remoting
✤ 1998 Microsoft Remote Scripting
✤ 1999 Microsoft Office 2000 Web Access
✤ 2002 Flash 4 Remoting
6

7. Sexy new ameworks
7

8. Javascript renaissance
8

9. 9

10. 10

11. 11

12. 12

13. 13

14. 14

15. 15

16. 16

17. 17

18. 18

19. 19

20. 20

21. 21

22. 22

23. 23

24. 24

25. 25

26. Danger, Will Robinson!
26

27. 27

28. 28

29. Linear process
29

30. “Perl, PHP, ASP, .NET, HTML, CSS, RSS, ATOM,
JavaScript, Flash, Photoshop, Illustrator,
graphic user interface design as well as
interaction design. The applicant must have at
least five years practical experience, and a
computer science degree is a plus.”
molly.com
30

31. ✤ User experience ✤ Web designer
designer
✤ Web product designer
✤ User interface designer
✤ Web interface
✤ Web interface designer developer
✤ Web standards ✤ Web standards
designer developer
✤ Usability consultant ✤ Designer
✤ Accessibility consultant ✤ Rails developer
31

32. “Photoshop, Usability, Accessibility,
Information Architecture, Interaction Design,
User Experience, HTML, CSS, Javascript, Ajax,
PHP, Ruby, Rails, Patterns, Databases. Good
communication skills essential.”
Mike-a-like
32

33. “If you think you understand the problem then
you clearly haven’t thought about it enough.”
Craig Mcmillan
33

34. System aware designers
34

35. “There are only two hard things in computer
science: cache invalidation and naming
things.”
Tim Bray quoting Phil Karlton
35

36. “Many people falsely assume that interface
design can mask any ugly complexities of the
underlying business. [...] You can put lipstick
on a pig, but at the end of the day, it’s still a
pig.”
Garrett Dimon / garrettdimon.com
36

37. “There was a clear and strategic requirement
from the heads of design in [these 11 top global
brands] to recruit and train designers who
demonstrate multi-disciplinary working,
business acumen and strategic thinking.”
designcouncil.org.uk
37

38. “Twin shooting materials – moulding different
plastics together or co-moulding plastic to metal
gives us a range of functional and formal
opportunities that really didn’t exist before. The
iPod is made from twin-shot plastic with no
fasteners and no battery doors enabling us to
create a design which was dense completely
sealed.”
Jonathan Ive / designmuseum.org
38

39. “We invested $50,000 of our company’s money
into a fund consisting of 10 companies we felt
did a great a job at user experience. [...] In the
one year period of our test, our UX investment
philosophy trounced the markets.”
Jon Lax / uxmag.com
39

40. Interaction aware
developers
40

41. “The easiest way to make a bad interface in
your OSS project is to ignore it. Bad interfaces
are the natural state of software: You’ll get one
unless you work hard to avoid it.”
Jono DiCarlo / humanized.com
41

42. “Each developer is assigned to maintain their
own features and respond to bug reports from
users.”
Marc Hedlund / radar.oreilly.com
42

43. 43

44. Collaboration
44

45. “Designers learn empathy by spending time in
the lives and environments of real customers.”
adaptivepath.com
45

46. Agile
46

47. ✤ Individuals and interactions over processes and
tools
✤ Working software over comprehensive
documentation
✤ Customer collaboration over contract negotiation
✤ Responding to change over following a plan
47

48. Pairing
48

49. Design
49

50. Development
50

51. Features
51

52. Test driven development
52

53. Pairing on testing
53

57. Behaviour driven
development
57

58. “What should this do?”
wikipedia.org/wiki/Behavior_driven_development
58

61. “You can tell people how it feels but everyone
needs their own epiphany.”
Matt Biddulph
61

62. “People that don't, you don't have to – it's not
going to make a bad DJ good – but it'll make a
good DJ better.”
Josh Davis
62

63. But I’m a Bloody
Designer!
Mike Stenhouse / Trampoline Systems / Donotremove
63

64. ✤ http://flickr.com/photos/kola1965/98669672/
✤ http://flickr.com/photos/mylesnoton/741240199/
✤ http://flickr.com/photos/peterme/85327653/
✤ http://flickr.com/photos/kidneybingos/379625556/
✤ http://flickr.com/photos/st_morpheus/1188884587/
✤ http://flickr.com/photos/emr9801/746788982/
✤ http://flickr.com/photos/jgilbert/40662088/
✤ http://flickr.com/photos/sookie/36356334/
✤ http://flickr.com/photos/mhaithaca/150442221/
✤ http://flickr.com/photos/vrogy/514733529/
✤ http://flickr.com/photos/jefflippold/504295340/
✤ http://flickr.com/photos/auntiep/348330632/
✤ http://flickr.com/photos/mn_francis/69934792/
✤ http://flickr.com/photos/nickfarnhill/415649633/
64

65. ✤ http://www.adaptivepath.com/ideas/essays/archives/000385.php
✤ http://www.molly.com/2006/11/17/creativity-jam-session-write-your-own-web-dev-
job-advert/
✤ http://garrettdimon.com/archives/2007/10/3/the_hidden_interface/
✤ http://www.designcouncil.org.uk/en/About-Design/managingdesign/Management-
challenges/Skills/
✤ http://www.rttsweb.com/outsourcing/statistics/
✤ http://www.designmuseum.org/design/jonathan-ive
✤ http://www.uxmag.com/strategy/327/investing-in-ux
✤ http://humanized.com/weblog/2007/10/05/make_oss_humane/
✤ http://radar.oreilly.com/archives/2006/02/web_development_20.html
✤ http://agilemanifesto.org/
✤ http://www.adaptivepath.com/ideas/essays/archives/000858.php
✤ http://wikipedia.org/wiki/Behavior_driven_development
65