Describing Design

1. make it better Describing Designs Traditional Design Speciﬁcations vs. Prototyping

2. make it better Who’s this guy? tweet @skotcarruthdescribing designs prepared for san francisco ux designers • Web design and development since 1996 • Founded Philosophie in 2008 • Worked on 200+ web/mobile projects • UXD Instructor, UXDi Curriculum Fellow @ GA • New to San Francisco!

3. make it better When I was a boy… tweet @skotcarruth prepared for san francisco ux designers describing designs

4. make it better tweet @skotcarruth prepared for san francisco ux designers Web Designer describing designs

5. make it better Now we have specialization • User Researcher • Information Architect • Interaction Designer • UI Designer • Visual/Graphic Designer • Motion Designer tweet @skotcarruth prepared for san francisco ux designers describing designs

6. make it better Now we have specialization • User Researcher • Information Architect • Interaction Designer • UI Designer • Visual/Graphic Designer • Motion Designer tweet @skotcarruth prepared for san francisco ux designers • Content Strategist • Business Analyst • Product Manager • Front-end Developer • Back-end Developer • DevOps describing designs

7. make it better tweet @skotcarruth prepared for san francisco ux designers How do you coordinate with all of these people? describing designs

8. make it better The Spec tweet @skotcarruth prepared for san francisco ux designers describing designs

9. make it better Documentation tweet @skotcarruth prepared for san francisco ux designers describing designs

10. make it better Each role has its deliverables • User Researcher • Information Architect • Interaction Designer • UI Designer • Visual/Graphic Designer • Motion Designer tweet @skotcarruth prepared for san francisco ux designers describing designs

11. make it better User Research tweet @skotcarruth prepared for san francisco ux designers describing designs

12. make it better Information Architecture tweet @skotcarruth prepared for san francisco ux designers describing designs

13. make it better Interaction Design tweet @skotcarruth prepared for san francisco ux designers describing designs

14. make it better UI Design tweet @skotcarruth prepared for san francisco ux designers describing designs

15. make it better Visual Design tweet @skotcarruth prepared for san francisco ux designers describing designs

16. make it better Motion Design tweet @skotcarruth prepared for san francisco ux designers describing designs

17. make it better Motion Design tweet @skotcarruth prepared for san francisco ux designers describing designs

22. make it better Traditional specs can work well when: • There are many specialists on the team • There is ample time to create them • They are done well • Development is outsourced or remote • Work is done in a waterfall fashion • The scope doesn’t change much tweet @skotcarruth prepared for san francisco ux designers describing designs

23. make it better But they also suck. • TL;DR • Time-intensive • Hard to keep up-to-date • What about testing? tweet @skotcarruth prepared for san francisco ux designers describing designs

24. make it better tweet @skotcarruth prepared for san francisco ux designers describing designs

25. make it better tweet @skotcarruth prepared for san francisco ux designers 1) Communicate describing designs

26. make it better tweet @skotcarruth prepared for san francisco ux designers 1) Communicate 2) Test describing designs

27. make it better The Prototype tweet @skotcarruth prepared for san francisco ux designers describing designs

28. make it better It’s about mindset tweet @skotcarruth prepared for san francisco ux designers 1) Communicate 2) Test describing designs

29. make it better tweet @skotcarruth What you make depends on what you want to learn. prepared for san francisco ux designers describing designs

30. make it better tweet @skotcarruth prepared for san francisco ux designers http://www.cennydd.com/writing/why-i-dont-wireframe-much describing designs

31. make it better tweet @skotcarruth prepared for san francisco ux designers http://www.cennydd.com/writing/why-i-dont-wireframe-much describing designs

32. make it better Types of Prototypes tweet @skotcarruth prepared for san francisco ux designers Low Visual Fidelity Low Functional Fidelity High Functional Fidelity High Visual Fidelity Paper Prototypes Wireframes Comps Proof of concept Working Software Static front-end describing designs

33. make it better Types of Prototypes tweet @skotcarruth prepared for san francisco ux designers Low Visual Fidelity Low Functional Fidelity High Functional Fidelity High Visual Fidelity Paper Prototypes Wireframes Comps Proof of concept Static front-end Working Software describing designs

34. make it better Prototype on Paper (POP) tweet @skotcarruth prepared for san francisco ux designers describing designs

35. make it better Prototype on Paper (POP) tweet @skotcarruth prepared for san francisco ux designers describing designs

36. make it better InVision tweet @skotcarruth prepared for san francisco ux designers describing designs

37. make it better Framer.js tweet @skotcarruth prepared for san francisco ux designers describing designs

38. make it better Framer.js tweet @skotcarruth prepared for san francisco ux designers describing designs

39. make it better Prototypes are more powerful… • A picture’s worth 1000 words • Easier to test with • Easier than ever to create • More fun tweet @skotcarruth prepared for san francisco ux designers describing designs

40. make it better tweet @skotcarruth But don’t forget: there’s no magic bullet. prepared for san francisco ux designers describing designs

41. make it better tweet @skotcarruth prepared for san francisco ux designers 1) Communicate 2) Test describing designs

42. make it better Questions? tweet @skotcarruth prepared for san francisco ux designers describing designs skot@philosophie.is

Describing Design

Skot Carruth

Describing Design