Sketching Matters (Both Mark Kraemer & Myself)

The complete presentation from "Sketching Matters," both @Kraemer and @paulgoode bits, from November 10th, 2011 at the Refresh Dallas meet up.

First half, Paul. Second half, Mark. Follow up, YOU.

Transcript

2. Paul Hello.
3. 3 years 3 years 21 months tired tired last place
7. art critic artist BS
9. sketching listening
10. #speed #accuracy #structured #fuzzy #attitude #transparent
11. Joshua Kahn Product Line Mgr at Best Buy Sketching provides a baseline of understanding. In the room we'll have a designer, a front end dev, back end dev, project, and product (me) people plus possibly a client or two. At the idea stage you have words in the air. The problem with words in the air is that everyone attaches their own picture of what those words look like. The sketch, especially if it's viewable by everyone, grounds the discussion and immediately reveals gaps in reality or gaps between everyone's interpretation of the concept. It helps me a great deal personally, since I'm not a developer, I can go down trails that are more based on "computer magic" than the actual capability of the tech. A sketch allows developers to course correct me. In short, the tangibility of sketches gets the group more quickly and accurately to the thing. Sketching provides a baseline of understanding. #speed #accuracy #structured #fuzzy #attitude #transparent Nov 2011
12. During meetings and standups and brainstorming sessions I sketch on white boards and paper to make sure that I'm on the same page with people about planned interactions or interfaces. I also like to print out interfaces we've already designed and then cover parts of them with post-its and draw what should be there instead. As you can see, the visual design for Google Search isn't too complex, so I can move pretty quickly from a sketch to a relatively high-fidelity mock. In other cases I might 'sketch' with snagit or photoshop (really rough work) and then an engineer will make a working prototype based on that rough. For my current project I'm in a room with the entire team, so my sketches and mocks are up on the walls and we can all stand up and look at the board and discuss the flow of the interface and the interactions that take place. It's nice because standing up is informal, but it is also important that when you present sketches you have a recorder who can get all of the feedback for the meeting. Abi Jones Designer at Google I should note that not everyone at Google is a sketcher. I'm just not very fast with Photoshop, so I like to draw things first. #speed #accuracy #structured #fuzzy #attitude #transparent Nov 2011
13. Edward Cossette UX Mgr at Kalkomey Enterprises Sketching is where everyone found common ground and made the project workable. We created a small, immersive educational game to educate students interested in aspects of successful deer hunting. The initial concept fit into a single sketch. More sketches were made, those turned to wireframes, wireframes and documentation informed the illustrator, content and game design. As for the team, each person worked remote, with limited availability, and sketching was the keystone in communicating. Sketching served as balance between a verbose and academic education designer, prone to 3500- word emails, and a programmer, prone to single-line emails. The game design started with a single sketch. #speed #accuracy #structured #fuzzy #attitude #transparent Nov 2011 http://www.hunter-ed.com/ Shoot or Don’t Shoot
14. Communicate that you understand. Big ideas. Capture and do something with it. Be bold and sketch.
15. Communicate that you understand.
16. Draw the nouns. Communicate that you understand.
17. Draw the nouns. Communicate that you understand.
18. Sketch environments. Communicate that you understand.
19. Introduce actions and desires. Communicate that you understand.
20. Introduce actions and desires. Communicate that you understand.
21. Propose a story. Communicate that you understand.
22. Grasp the problem. Communicate that you understand.
23. Grasp the problem. Communicate that you understand.
24. Make it painful. Communicate that you understand.
25. Make it painful. Communicate that you understand.
26. Show a structured understanding. Communicate that you understand.
27. Show a structured understanding. Communicate that you understand.
28. Again, sketching helps show that you understand (or trying really hard).
29. Helpful: UXD Stack See, I understand... a digital platform that would help city officials.
30. See, I understand... ways a digital lab notebook might enable scientists to do better research.
31. See, I understand... how to help you organize and visualize your launch process.
32. See, I understand... how a new platform can reinvigorate your organization.
33. See, I understand... how to help fill a room with IKEA stuff. #structured #fuzzy It got tweaked after assembling and using it. This got the ball rolling.
34. Communicate that you understand. Capture and do something with it. Big ideas. Be bold and sketch.
35. Capture. Take a picture.
36. Delete. Erase the board. Go make something.
37. Capture and do something with it.
38. Capture and do something with it.
39. Capture and do something with it.
40. Pro tips. Tweak the brightness and contrast to get some solid lines.
41. Set the ink layer to “multiply” and have fun coloring below. Shave back the opacity to create color tones and a painterly feel. Pro tips.
42. Scan + Adjust + Trace + Expand + Color Pro tips.
43. Whiteboard + Vectorized + Color Pro tips.
44. GOALS Communicate that you understand. Capture and do something with it. Be bold and sketch. Big ideas.
45. 1 2 3 Do it.
46. GOALS Communicate that you understand. Capture and do something with it. Be bold and sketch. Show progress. You really need to move on to the making the thing. Big ideas.
47. Show progress. Discover Sketch Prototype
48. Show progress. Discover Sketch Prototype
49. Show progress. Discover Sketch Prototype
50. SketchFlow HTML More clickable & interactive stuff... Visual Design Wireframes Illustrations #structured #fuzzy #transparent time / effort / risk
51. #speed #accuracy #structured #fuzzy #attitude #transparent
52. @kraemer
53. “Any problem can be made clearer with a picture, and any picture can be made using the same simple set of tools and rules.” - The Back of the Napkin by Dan Roam
54. It doesn’t have to be perfect. You’re not shipping the sketch. #pro-tip
55. Please excuse the crudity of this model. I didn't have time to build it to scale or to paint it.
56. 1. Draw a noun 2. Label it with text This accommodates both visual and aural learners. It also helps folks make sense of your drawings when you’re not there to explain them yourself. #pro-tip
58. Practice the shapes specific to your domain. Put at title and date on every page. #pro-tips
62. Concept Maps are a great way to get your arms around complex ideas.
63. Noun Noun Verb
64. DFW UX Professio Refresh Meeting attends
65. It’s OK to be messy
66. Concept Map for Resumes and Quals
67. Discover Sketch Prototype
71. Sketching works for a collection of pages as well.
74. Sketching for the Microsoft Surface helped us better understand its unique context.
79. My daughter is both cute and creative.
81. The collaboration required for group sketching also develops relationships that are more capable make prototypes, not promises make designs, not documents collaborate, don’t litigate partner, don’t just provide make contacts, not contracts make friends, not war
82. Awesome. What can I do next?
83. Recommended Reading Back of the Napkin by Dan Roam
84. Recommended Reading Forms, Fields, and Flow by Dave Gray http://www.davegrayinfo.com/ 2008/04/08/forms-fields-and- flows/
85. Recommended Reading Visual Meetings by David Sibbet
86. Recommended Reading Gamestorming by Dave Gray Sunni Brown James Macanufo
87. @ryancoleman @SunniBrown @nancyduarte @austinkleon @davegray @paulgoode @vizthinkDall as #vizthink @xplane @danroam
88. DECEMBER 15th 4:30pm - 7:00? Place TBD