1. CS 4963: UI Design Interaction Design, Part 2

2. Today: • What is Interaction Design, anyways? • How do we do interaction design? • Fundamentals and Building Blocks • Heuristics and Patterns • Wrap up Agile UX • Deliverables and practices • Documentation

3. BUT FIRST

6. …so not a lot of images today.

7. agile ux

8. design 1 to 2 iterations ahead

9. hardening iteration

10. (From Budwig, Jeong, Kelkar.)

11. (not yet right.)

12. story team is important

13. (everyone is figuring it out)

14. most important is having overall vision

15. sketching and prototyping

16. sketching is brainstorming

17. prototypes are interactive

18. “I can always animate that interaction faster than you can code it.” —Chris Bernard, Microsoft UX Evangelist

19. sketching

20. thinking visually

21. low-fi vs. high-fi

22. sketching notations

23. doesn’t have to be on paper

24. video sketches

25. participatory design

26. design jams

27. prototyping

28. paper prototypes

29. (choose your own adventure)

30. code prototypes

31. ideally want to carry over things

32. styles and resources

33. animation (!!!)

34. tools

35. THERE ARE A LOT OF THEM

36. shootout of prototyping tools http://www.slideshare.net/suzeingram/spoilt-for-choice-which-prototyping-tool-is-right-for-you

37. shootout of prototyping tools shootout of prototyping tools http://www.slideshare.net/suzeingram/spoilt-for-choice-which-prototyping-tool-is-right-for-you

38. pick what’s appropriate to your project

39. I <3SketchFlow

40. processing.org& variants

41. if you’re making a web page, prototype in markup

42. jQuery, et al.ixedit

43. documentation

44. documentation is communication

45. think about the why

46. do what makes sense

47. old school: giant spec docs

48. each screen

49. detailed lists of assets on each screen

50. actions for every interactive element