Talk given at Web 2.0 Expo Berlin: Twice the Speed and Half the Cost - Basics of Interaction Design for Fast-Paced Startups, by Gregor Hochmuth (www.dotgrex.com)

1. Twice the Speed
& Half the Cost
Interaction Design
for fast-paced Startups
Greg Hochmuth November 6, 2007
zoo-m.com Web 2.0 Expo Berlin

4. In the context of this talk,
“Design is about defining how your
users interact with your product,
based on your understanding of
who they are, why they use and
what they want to achieve.”

6. Misconceptions
– Cost
– Process
– Expertise

7. “Easier Habits”

8. “Easier Habits”
– Code it first,
design later

9. “Easier Habits”
– Feature creep

10. “Easier Habits”
Not
knowing
your users

11. Design is the difference between

12. Design is the difference between
&

13. Design is the difference between
&
&

14. Good Design
doesn’t have to mean “pretty”

15. Good Design
doesn’t have to mean “pretty”

16. Good Design
doesn’t have to mean “pretty”

17. ... and “pretty” is NOT
the same as good design.

18. Good Design, you say?
“I know it when I see it.”
-- Your boss

19. Good Design, you say?
“I know it when I see it.”

22. ... It’s when you don’t see it.

24. But you can’t make
a cake just by looking at a picture.

25. So, how do you
make good design?

26. #1

27. #1
KNOW

28. #1
YOUR

29. #1
USERS

30. > UCG
Users, Context, Goals.

31. • Who they are
• What they want to accomplish
• What context they are in
What constraints they face
• Who else is involved
What methods they use today
• What words do they use
• Ask Why 5 times

33. User
Research

34. “User
Research?
...You don’t
have time
for this.”
< Your VC

35. “Me, interview people?”
Your lead
developer>

36. the real benefits
• Avoids the “Elastic user”
• Help you answer design questions
• Bring everyone on the same page
• Create a shared understanding

37. When you talk to people
• There is a difference between
what people do and what people say
• Watch for “Post-Its”
• What do they use?
• People love to talk about themselves

41. #1. Know your users, know their goals
#2

42. “People don’t want features,
they want outcomes.”
-- Jason Fried, 37signals

43. #1. Know your users, know their goals
#2. Turn your features into stories

44. #1. Know your users, know their goals
#2. Turn your features into stories
#3

45. TEST

46. TEST
WHILE IT’S
CHEAP

47. Paper is cheap.
Code is expensive.
(just like dead documentation)

49. Paper to Product
• Tips for testing
– The less polished, the better
– The secret life of PowerPoint
– “Wizard of Oz” technique
– Don’t make people “pretend” to be someone else
• Resources
– www.paperprototyping.com/
– www.alistapart.com/articles/paperprototyping
– www.uie.com/articles/prototyping_tips/

50. Paper to Product
• Tips for testing
– The less polished, the better
– The secret life of PowerPoint
– “Wizard of Oz” technique
– Don’t make people “pretend” to be someone else

51. #1. Know your users, know their goals
#2. Turn your features into stories
#3. Test while it’s cheap

52. Summary
• Design for your users, not for yourself
• Know who your users are,
why they will use your product,
and what you’re helping them accomplish
• Maximize shared understanding

53. Get everyone
involved

54. Be visual &
Keep making stuff

55. Have Fun
together

57. Extra Goodies (not enough time during Expo Presentation)
DESIGN ISSUES THAT
GET OVERLOOKED TOO OFTEN

58. Web Readability

62. Writing for the Web
www.useit.com/papers/webwriting/

63. First Experiences
and Expectations

64. First Experiences & Expectations
The 5-second test

67. First Experiences & Expectations
The 5-second test
www.uie.com/articles/five_second_test/

68. First Experiences & Expectations
10 seconds before
[click!]
5 seconds after
30 seconds (2-3 pages)
5 minutes
...
1 week later
...
Talking to a friend

69. Do you have a story
for each of those moments?
Have you really thought about
the context of your users at that point?

71. Thanks.

72. Thanks.
Get in touch at
grex@cs.stanford.edu
Psst!
web2expo@mento.info

73. Photo Credits!
by * Beezy *
http://www.flickr.com/photos/53085837@N00/52666083
by e v i l
http://www.flickr.com/photos/91738385@N00/331663300
Collected using FlickrStorm:
www.zoo-m.com/flickr-storm/

74. Photo Credits!
by josef.stuefer
http://www.flickr.com/photos/20375052@N00/8173741
by Milovan
http://www.flickr.com/photos/ikero/382108642/
Collected using FlickrStorm:
www.zoo-m.com/flickr-storm/