Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Collaborative Sketching for Secure & Usable Apps

213 views

Published on

Presentation on Collaborative Sketching for Secure & Usable Apps as presented by Robert Stribley at Internet Freedom Festival, Friday, March 10th, 2017

Published in: Design
  • Be the first to comment

  • Be the first to like this

Collaborative Sketching for Secure & Usable Apps

  1. 1. Robert Stribley 03/10/17 Collaborative Sketching for Secure & Usable Apps
  2. 2. Robert Stribley / @stribs Associate Experience Director, Razorfish Continuing Education Faculty, School ofVisual Arts Introduction My clients have included: • Bank of America, PNC,Wachovia • Citibank, JPMorgan, Morgan Stanley, Oppenheimer Funds, Prudential, Smith Barney,T. Rowe Price • Boston Scientific, Nasonex • Choice Hotels, RCI, Sotheby’s International Realty • Computer Associates, EMC • Ford, Lincoln, Mercedes-Benz, MBFS, Smart • FreshDirect • AT&T, Nextel • Day One, Red Cross, Smithsonian National Air & Space Museum • Pearson,Travel Channel,Women’s Wear Daily
  3. 3. It is hardly possible to overrate the value… of placing human beings in contact with persons dissimilar to themselves, with modes of thought and action unlike those with which they are familiar. – John Stewart Mill
  4. 4. Overview 1. What Collaboration Is 2. What Collaboration Is Not 3. What We Mean By Sketching 4. The Collaborative Sketching Process 5. Our Project 6. Q&A 7. SomeTools & Resources
  5. 5. True collaboration means ... Acknowledging different points of view Acknowledging contributions even when they conflict or overlap with your own What Collaboration Is
  6. 6. Collaboration is not … Having a meeting to discuss an idea or issue is not collaboration Completing a presentation or review with discussion or feedback is not collaboration Assigning roles and deliverables to team mates is not collaboration Providing feedback in person or via email is not collaboration What Collaboration Is Not
  7. 7. What We Mean By Sketching
  8. 8. Some Advice from the Pros
  9. 9. “The great benefit of drawing is that when you look at something, you see it for the first time.” Milton Glaser
  10. 10. “There are techniques and processes whereby we can put experience front and center in design. My belief is that the basis for doing so lies in extending the traditional practice of sketching.” Bill Buxton
  11. 11. Attributes of a Sketch • Quick • Timely • Inexpensive • Disposable • Plentiful • Clear vocabulary • Distinct gesture • Minimal detail • Appropriate degree of refinement • Suggest & explore rather than confirm • Ambiguity Bill Buxton Sketching User Experiences
  12. 12. "There is no more powerful way to prove that we know something well than to draw a simple picture of it. And there is no more powerful way to see hidden solutions than to pick up a pen and draw out the pieces of our problem.” Dan Roam The Back of the Napkin
  13. 13. The Collaborative Sketching Process
  14. 14. For the purposes of our workshop, sketching is … • Quick • Simple • Collaborative
  15. 15. All the tools you need: Paper Sharpies Photo by JasonTank, Flickr
  16. 16. Defining Collaborative Sketching Origins • Rooted in Design Studio Methodology • Grew out of industrial design and architecture • Jim Ungar and Jeff White,“Agile user centered design: enter the design studio - a case study,” 2008
  17. 17. - Stefan Klocek,“Better together; the practice of successful creative collaboration,” Cooper Journal Defining Collaborative Sketching “Ninja. Rockstar. Gifted genius. Many of the ways we talk about creative work (whether it’s design or development) only capture the brilliance of a single individual.”
  18. 18. • To communicate your ideas effectively by visualizing them • To benefit from the participation of your colleagues • To quickly generate ideas and refine through iterations Goals
  19. 19. 1. Discuss 2. Sketch 3. Share 4. Iterate Process
  20. 20. Discuss • Discuss the experience you’re sketching • What’s its purpose? • What features are necessary? • How would you prioritize them? • Who’s the audience? • You’re not discussing layout or design • Just the problem you’re trying to solve • Remember:You’re not sketching yet Process
  21. 21. Sketch • Sketch silently • Limit your time – 5, 10 minutes • Sketch as much as possible, as many different ideas as possible • Don’t worry about mistakes or style • Emphasis is on the quantity of ideas not the quality of sketches Process
  22. 22. Share • Review your work with your team • Keep it short – 60 seconds each • You provide feedback to others • What you like • Questions about what didn’t work for you • You’re not grilling your colleagues and this isn’t a competition Process
  23. 23. Iterate • Now sketch again if you need to • Or collaborate on a high-level design (e.g. via whiteboard) • Then begin your design with a more informed view, with more and better ideas • Iterate on your design Process
  24. 24. Now, it’s your turn
  25. 25. Our Project
  26. 26. bump Develop a secure, proximity-based file-sharing app for mobile phones. Our Project
  27. 27. Consider … Who is the audience? • Journalists • Whistleblowers • Activists • Others? Our Project
  28. 28. • Ability to find and connect securely with another user • Must be proximity based • Must not use wi-fi or cellular data • Must allow for accessing and sharing files • Some level of file details and description • Anything else? Profile, settings? • Any key differentiators? Key Features
  29. 29. Design a Key App Feature In your teams, design a key feature for the Bump app 1) Discuss detailed requirements needed for file browsing and selecting feature 2) Sketch your ideas for the feature individually 3) Share your sketches with your team mates 4) Collaborate on a single design Our Project
  30. 30. 1) Discuss the file browsing and selecting feature in detail • Develop a list of key requirements (E.g. filtering, sorting, file details, selection options, etc) • Remember: No sketching yet 30mins Our Project
  31. 31. 2) Sketch your ideas for this feature individually • Remember:You’re sketching quietly for now, not sharing yet 15mins Our Project
  32. 32. 3) Share your sketches with your team mates 15mins Our Project
  33. 33. 4) Collaborate on a single sketch for this feature 20mins Our Project
  34. 34. Repeat this process for a second feature: Finding and connecting with a user Our Project
  35. 35. Share your results with everyone Our Project
  36. 36. Any Questions?
  37. 37. Some Resources
  38. 38. Books
  39. 39. The following apps are all for the iPad: • Adobe Ideas • Bamboo Paper • Muji Notebook • Penultimate • SketchBook Pro • Paper Sketching Apps
  40. 40. • User Interface Design in an Agile Environment: Enter the Design Studio – Jim Ungar and Jeff White • Design Studio Methodology – Article by Will Evans • The Design Studio Method – Presentation byTodd Zaki Warfel Further Study
  41. 41. Thank you

×