Collaborative Sketching for UX
Upcoming SlideShare
Loading in...5
×
 

Collaborative Sketching for UX

on

  • 1,194 views

Collaborative Sketching for UX - presented by Robert Stribley at UX Sketchcamp NYC, 10/12/2013

Collaborative Sketching for UX - presented by Robert Stribley at UX Sketchcamp NYC, 10/12/2013

Statistics

Views

Total Views
1,194
Views on SlideShare
1,192
Embed Views
2

Actions

Likes
4
Downloads
18
Comments
0

1 Embed 2

http://mateovelasquezs.wordpress.com 2

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • XKCD Cartoon http://xkcd.com/386/
  • Photo by JasonTank, Flickr
  • Common precognitive visual attributes – from The Back of the Napkin – Dan Roam
  • Our Exercise
  • Defining Collaborative Sketching
  • Our Exercise
  • Our Exercise
  • Our Exercise
  • Our Exercise
  • Our Exercise
  • Our Exercise
  • Photo: Flickr.com/stribs
  • Resources
  • Books: Sketching User Experiences by Bill Buxton, The Back of the Napkin by Dan Roam
  • Sketching Apps
  • Prototyping with sketches – source: http://www.fastcodesign.com/3017637/kickstarting-appseed-turns-your-sketches-into-apps
  • thanks

Collaborative Sketching for UX Collaborative Sketching for UX Presentation Transcript

  • Collaborative Sketching for UX Robert Stribley UX Sketch Camp NYC – 10/12/14
  • First, remember, anyone can sketch Cartoon by XKCD
  • And for the purposes of today’s workshop, sketching is … •Quick •Simple •Collaborative
  • All the tools you need: Paper Sharpies Photo by JasonTank, Flickr
  • Some Examples
  • Any idea what this is a sketch of?
  • Twitter [This sketch] has very special significance – it's hanging in the office somewhere with one other page. Whenever I'm thinking about something, I really like to take out the yellow notepad and get it down. – Jack Dorsey, Twitter “twttr sketch” Twitter.com
  • Advice from the Experts
  • “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 Bill Buxton Sketching User Experiences
  • 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
  • "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
  • Collaborative Sketching
  • Defining Collaborative Sketching Origins • Rooted in Design Studio Methodology • Grew out of industrial design and architecture • No “rockstars” • Different versions/methods • For example, Todd Zaki Warfel, Message First, talks about … • Create. Pitch. Critique. • 6.8.5 game
  • Methodology • Sketch • Limit your time • Don’t worry about mistakes or style Goals • Benefit from the participation of your colleagues • Communicate ideas effectively by visualizing them • Quickly generate ideas and refine through iterations
  • Process: 1. Discuss 2. Sketch 3. Share 4. Revise
  • Discuss • Discuss the experience you’re sketching • What’s its purpose? • What features are necessary? • How would you prioritize them? • What’s the audience? • However, you are not discussing layout or design • Just the problem you’re trying to solve • No sketching yet!
  • Sketch • Sketch silently • Limit your time – 5, 10 minutes • Sketch as much has possible, as many different ideas as possible • Emphasis is on quantity of ideas not quality of sketches
  • Share • Review your work with your team • Keep it short – 60 seconds each • You provide feedback to others • What you like • Questions about didn’t work for you • You’re not grilling your colleagues and this is not a competition
  • Revise • Now begin your wireframe with a more informed view, more and better ideas • And sketch again if you need to
  • Our Exercise
  • What to do?
  • Our Exercise: A home page for Events.com • A website for finding local events – Listed by category – Listed by date – Listed by ??? • Who is the audience? – Personas
  • Our Exercise: Consider other event sites you’re familiar with. This will be your “competitive analysis”
  • Our Exercise: In teams, sketch your ideas. Events.com Home Page 1. Take 10 minutes to discuss what features belong here 2. Sketch your ideas silently for 10 minutes 3. Share your sketches with your team 4. Sketch again, incorporating what you learned from others
  • Our Exercise: 1. Take 10 minutes to discuss what features belong here
  • Our Exercise: 2. Sketch your ideas silently for 10 minutes
  • Our Exercise: 3. Share your sketches with your team
  • Our Exercise: 4. Sketch again, incorporating what you learned from others
  • Some Resources
  • Online Reading & Viewing Introduction to Design Studio Methodology http://uxmag.com/articles/introduction-to-design-studio-methodology The Design Studio Method – Presentation by Todd Zaki Warfel https://vimeo.com/37861987
  • Sketching Tools The following apps are all for the iPad: • Adobe Ideas • Bamboo Paper • Muji Notebook • Penultimate • SketchBook Pro
  • Prototyping With Sketches AppSeed Currently a Kickstarter projects, AppSeed allows you to turn your app sketches into working mobile prototypes "Sketching is simply the fastest way to test ideas and visually brainstorm” – Greg Goralski, AppSeed creator
  • thanks www.slideshare.net/stribs @stribs