SlideShare a Scribd company logo
1 of 52
Download to read offline
Collaborative Sketching for UX
Robert Stribley
02/19/14
Collaborative Sketching for UX - NYU 02/19/14
Arguably, we’ve
been sketching for
eons
But now, we’re sketching
more than ever
• IdeaPaint Inc makes a paint
that turns any surface into a
whiteboard
• Its sales have doubled every
year since introduced in 2008
• More than ½ its business is in
the workplace

See “Doodling for Dollars,” Wall Street Journal, April 24, 2012
Why sketch?
• Enable
communication
• Make abstract
concepts concrete
• Iterate on ideas
• Jumpstart
collaboration
• Ensure recollection
• Humanize ideas
What can I sketch?
• Home pages
• Category pages
• Product pages
• Wizards & widgets
• Search results
• Process Flows
• Anything, really
And there’s so
much more to
sketch for …
• Smartphones
• Tablets
• Google Glass
• iWatches
• Responsive design
• Ubiquitous
computing
Who can sketch?
• Information architects
• Interaction designers
• Graphic designers
• Content strategists
• Project managers
• Business analysts
• Functional analysts
• Developers
• Client directors
Really,
anyone can
sketch
Cartoon by XKCD
A few ways we sketch at
Razorfish:
•
•
•
•
•

Solo
Sketch to comp
Communicate to client
Storyboarding
As a team – collaboratively
What sketching isn’t …
• Sketching isn’t only for
designers
• Sketching isn’t difficult
• Sketching isn’t drawing
You needn’t be Michelangelo
to participate
However, we can
learn from the pros
Who often begin
with a sketch
Adding layers, detail,
color
Until they complete
their masterpiece
A Quick Case Study
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
Some Advice from the Experts
“The great benefit of drawing is that when you
look at something, you see it for the first time.”
- Milton Glaser
“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
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 for UX - NYU 02/19/14
Collaborative Sketching
For the purposes
of today’s
workshop,
sketching is …
•Quick
•Simple
•Collaborative
All the tools you
need:
Paper
Sharpies

Photo by JasonTank, Flickr
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
Collaborative Sketching for UX - NYU 02/19/14
Collaborative Sketching for UX - NYU 02/19/14
Now, it’s your turn
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 … what else?

• Who is the audience?
– Locals
– Tourists
– Event promoters
Also, consider
other event sites
you’re familiar
with. This will be
your “competitive
analysis”
Our Exercise:
In teams, sketch your ideas
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

Discuss
Sketch

Share
Revise
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
Books
Sketching Tools
The following apps are all
for the iPad:
• Adobe Ideas
• Bamboo Paper
• Muji Notebook
• Penultimate
• SketchBook Pro
• Paper
Prototyping
AppSeed
Currently in development,
this Kickstarter project lets
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
Further Study
• 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
Thank you

www.slideshare.net/stribs

More Related Content

What's hot

Becoming a Web Design Champion
Becoming a Web Design ChampionBecoming a Web Design Champion
Becoming a Web Design ChampionMeagan Fisher
 
160329 iot talk 002
160329 iot talk 002160329 iot talk 002
160329 iot talk 002Alex Hulme
 
Participatory Design: Discovering Unmet Needs & New Solutions
Participatory Design: Discovering Unmet Needs & New SolutionsParticipatory Design: Discovering Unmet Needs & New Solutions
Participatory Design: Discovering Unmet Needs & New SolutionsJennifer Briselli
 
Doors, Walls and Old Trees: Prioritizing to Get Simple
Doors, Walls and Old Trees: Prioritizing to Get SimpleDoors, Walls and Old Trees: Prioritizing to Get Simple
Doors, Walls and Old Trees: Prioritizing to Get SimpleJason Ulaszek
 
Design thinking for designing and delivering services
Design thinking for designing and delivering servicesDesign thinking for designing and delivering services
Design thinking for designing and delivering servicesZaana Jaclyn
 
Visual tools and innovation games - full day workshop - sp intersections - no...
Visual tools and innovation games - full day workshop - sp intersections - no...Visual tools and innovation games - full day workshop - sp intersections - no...
Visual tools and innovation games - full day workshop - sp intersections - no...Ruven Gotz
 
Do You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.org
Do You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.orgDo You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.org
Do You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.orgAutodesk
 
Modern Web Concepts
Modern Web ConceptsModern Web Concepts
Modern Web ConceptsRyan Parsley
 
Designing the future vision of libraries
Designing the future vision of librariesDesigning the future vision of libraries
Designing the future vision of librariesZaana Jaclyn
 
Sketching As a Communication and Collaboration Tool.
Sketching As a Communication and Collaboration Tool.Sketching As a Communication and Collaboration Tool.
Sketching As a Communication and Collaboration Tool.Aaron Irizarry
 
What is ux design? A behind the scenes tour
What is ux design? A behind the scenes tourWhat is ux design? A behind the scenes tour
What is ux design? A behind the scenes tourNeil Turner
 
Designing a human centred mindset to lead at the edge
Designing a human centred mindset to lead at the edgeDesigning a human centred mindset to lead at the edge
Designing a human centred mindset to lead at the edgeZaana Jaclyn
 
Design curation workshop by UX Desi @Lamakaan, Hyderabad, India
Design curation workshop by UX Desi @Lamakaan, Hyderabad, IndiaDesign curation workshop by UX Desi @Lamakaan, Hyderabad, India
Design curation workshop by UX Desi @Lamakaan, Hyderabad, IndiaGanesh Kumar
 
Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...
Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...
Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...Dana Mitroff Silvers
 
Speaker Camp Atlanta Workshop - June 28, 2014
Speaker Camp Atlanta Workshop - June 28, 2014Speaker Camp Atlanta Workshop - June 28, 2014
Speaker Camp Atlanta Workshop - June 28, 2014Russ U
 
TKG.com's Content Ideation Breakfast Bootcamp
TKG.com's Content Ideation Breakfast BootcampTKG.com's Content Ideation Breakfast Bootcamp
TKG.com's Content Ideation Breakfast BootcampThe Karcher Group
 
Writing kick-ass hypotheses: Lean UX Meetup, Las Vegas : July
Writing kick-ass hypotheses: Lean UX Meetup, Las Vegas : JulyWriting kick-ass hypotheses: Lean UX Meetup, Las Vegas : July
Writing kick-ass hypotheses: Lean UX Meetup, Las Vegas : JulyKate Rutter
 
Visual Tools and Innovation Games - full day workshop - dev intersections - n...
Visual Tools and Innovation Games - full day workshop - dev intersections - n...Visual Tools and Innovation Games - full day workshop - dev intersections - n...
Visual Tools and Innovation Games - full day workshop - dev intersections - n...Michelle Caldwell, PSM, SSGB
 
Design thinking for designing and delivering services
Design thinking for designing and delivering servicesDesign thinking for designing and delivering services
Design thinking for designing and delivering servicesZaana Jaclyn
 

What's hot (20)

Becoming a Web Design Champion
Becoming a Web Design ChampionBecoming a Web Design Champion
Becoming a Web Design Champion
 
160329 iot talk 002
160329 iot talk 002160329 iot talk 002
160329 iot talk 002
 
Participatory Design: Discovering Unmet Needs & New Solutions
Participatory Design: Discovering Unmet Needs & New SolutionsParticipatory Design: Discovering Unmet Needs & New Solutions
Participatory Design: Discovering Unmet Needs & New Solutions
 
Doors, Walls and Old Trees: Prioritizing to Get Simple
Doors, Walls and Old Trees: Prioritizing to Get SimpleDoors, Walls and Old Trees: Prioritizing to Get Simple
Doors, Walls and Old Trees: Prioritizing to Get Simple
 
Design thinking for designing and delivering services
Design thinking for designing and delivering servicesDesign thinking for designing and delivering services
Design thinking for designing and delivering services
 
Visual tools and innovation games - full day workshop - sp intersections - no...
Visual tools and innovation games - full day workshop - sp intersections - no...Visual tools and innovation games - full day workshop - sp intersections - no...
Visual tools and innovation games - full day workshop - sp intersections - no...
 
Do You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.org
Do You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.orgDo You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.org
Do You Know Who Your Users Are? The Role of Research in Redesigning sfmoma.org
 
Modern Web Concepts
Modern Web ConceptsModern Web Concepts
Modern Web Concepts
 
UX Recipe Cards
UX Recipe CardsUX Recipe Cards
UX Recipe Cards
 
Designing the future vision of libraries
Designing the future vision of librariesDesigning the future vision of libraries
Designing the future vision of libraries
 
Sketching As a Communication and Collaboration Tool.
Sketching As a Communication and Collaboration Tool.Sketching As a Communication and Collaboration Tool.
Sketching As a Communication and Collaboration Tool.
 
What is ux design? A behind the scenes tour
What is ux design? A behind the scenes tourWhat is ux design? A behind the scenes tour
What is ux design? A behind the scenes tour
 
Designing a human centred mindset to lead at the edge
Designing a human centred mindset to lead at the edgeDesigning a human centred mindset to lead at the edge
Designing a human centred mindset to lead at the edge
 
Design curation workshop by UX Desi @Lamakaan, Hyderabad, India
Design curation workshop by UX Desi @Lamakaan, Hyderabad, IndiaDesign curation workshop by UX Desi @Lamakaan, Hyderabad, India
Design curation workshop by UX Desi @Lamakaan, Hyderabad, India
 
Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...
Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...
Design Sprints for Awesome Teams: Running Design Sprints for Rapid Digital Pr...
 
Speaker Camp Atlanta Workshop - June 28, 2014
Speaker Camp Atlanta Workshop - June 28, 2014Speaker Camp Atlanta Workshop - June 28, 2014
Speaker Camp Atlanta Workshop - June 28, 2014
 
TKG.com's Content Ideation Breakfast Bootcamp
TKG.com's Content Ideation Breakfast BootcampTKG.com's Content Ideation Breakfast Bootcamp
TKG.com's Content Ideation Breakfast Bootcamp
 
Writing kick-ass hypotheses: Lean UX Meetup, Las Vegas : July
Writing kick-ass hypotheses: Lean UX Meetup, Las Vegas : JulyWriting kick-ass hypotheses: Lean UX Meetup, Las Vegas : July
Writing kick-ass hypotheses: Lean UX Meetup, Las Vegas : July
 
Visual Tools and Innovation Games - full day workshop - dev intersections - n...
Visual Tools and Innovation Games - full day workshop - dev intersections - n...Visual Tools and Innovation Games - full day workshop - dev intersections - n...
Visual Tools and Innovation Games - full day workshop - dev intersections - n...
 
Design thinking for designing and delivering services
Design thinking for designing and delivering servicesDesign thinking for designing and delivering services
Design thinking for designing and delivering services
 

Viewers also liked

Viewers also liked (16)

Pablo Picasso
Pablo PicassoPablo Picasso
Pablo Picasso
 
Art of engineering sketch board
Art of engineering sketch boardArt of engineering sketch board
Art of engineering sketch board
 
graphic design terms
graphic design termsgraphic design terms
graphic design terms
 
My coat of arms story
My coat of arms storyMy coat of arms story
My coat of arms story
 
Year 9 rooms
Year 9 roomsYear 9 rooms
Year 9 rooms
 
FREE - Top 200 Graphic Design Terms Reference Guide
FREE - Top 200 Graphic Design Terms Reference Guide FREE - Top 200 Graphic Design Terms Reference Guide
FREE - Top 200 Graphic Design Terms Reference Guide
 
Cubism
CubismCubism
Cubism
 
Vocabulary
VocabularyVocabulary
Vocabulary
 
Natural forms
Natural formsNatural forms
Natural forms
 
Designing a logo
Designing a logoDesigning a logo
Designing a logo
 
User Experience Design in context of Graphic Design
User Experience Design in context of Graphic DesignUser Experience Design in context of Graphic Design
User Experience Design in context of Graphic Design
 
Year 7 Graphics Booklet
Year 7 Graphics BookletYear 7 Graphics Booklet
Year 7 Graphics Booklet
 
Gcse exemplar sketch book pp cswk
Gcse exemplar sketch book pp cswkGcse exemplar sketch book pp cswk
Gcse exemplar sketch book pp cswk
 
Service Design Thinking
Service Design ThinkingService Design Thinking
Service Design Thinking
 
Vocabulary of Interior Design
Vocabulary of Interior DesignVocabulary of Interior Design
Vocabulary of Interior Design
 
Elements of interior design
Elements of interior design Elements of interior design
Elements of interior design
 

Similar to Collaborative Sketching for UX - NYU 02/19/14

Collaborative Sketching for UX - Razorfish 042115
Collaborative Sketching for UX - Razorfish 042115Collaborative Sketching for UX - Razorfish 042115
Collaborative Sketching for UX - Razorfish 042115Robert Stribley
 
Collaborative Sketching for Secure & Usable Apps
Collaborative Sketching for Secure & Usable AppsCollaborative Sketching for Secure & Usable Apps
Collaborative Sketching for Secure & Usable AppsRobert Stribley
 
Collaborative Exercises for Digital Design 3/7/18
Collaborative Exercises for Digital Design 3/7/18Collaborative Exercises for Digital Design 3/7/18
Collaborative Exercises for Digital Design 3/7/18Robert Stribley
 
Design, Behind the Scenes 2.0
Design, Behind the Scenes 2.0Design, Behind the Scenes 2.0
Design, Behind the Scenes 2.0Jason Wright
 
UX Bristol 2012 - 'Designing UX without requirements' - presented by e3
UX Bristol 2012 - 'Designing UX without requirements' - presented by e3UX Bristol 2012 - 'Designing UX without requirements' - presented by e3
UX Bristol 2012 - 'Designing UX without requirements' - presented by e3e3_media
 
Experiences and Creative Process (Semih Energin Technology Stream)
Experiences and Creative Process (Semih Energin Technology Stream)Experiences and Creative Process (Semih Energin Technology Stream)
Experiences and Creative Process (Semih Energin Technology Stream)IT Arena
 
A New Toolbox: Artifact Providence 2013
A New Toolbox: Artifact Providence 2013A New Toolbox: Artifact Providence 2013
A New Toolbox: Artifact Providence 2013Kevin Sharon
 
It's Not Just About Code
It's Not Just About CodeIt's Not Just About Code
It's Not Just About CodeDan Pickett
 
Being a designer
Being a designerBeing a designer
Being a designerAhmad Firoz
 
Introduction to Design Thinking
Introduction to Design ThinkingIntroduction to Design Thinking
Introduction to Design ThinkingAmmad Nasir
 
Intro to Design (Lecture)
Intro to Design (Lecture)Intro to Design (Lecture)
Intro to Design (Lecture)Ammad Nasir
 
So You've Got a Software Idea...Now What?
So You've Got a Software Idea...Now What?So You've Got a Software Idea...Now What?
So You've Got a Software Idea...Now What?Dan Pickett
 
Designing Your UX Career
Designing Your UX CareerDesigning Your UX Career
Designing Your UX CareerBen Sykes
 
Designer Games - Creative Exercises to Enhance Your Work
Designer Games - Creative Exercises to Enhance Your WorkDesigner Games - Creative Exercises to Enhance Your Work
Designer Games - Creative Exercises to Enhance Your WorkJohn H Douglass
 
Thinking and working visually for software testers
Thinking and working visually for software testersThinking and working visually for software testers
Thinking and working visually for software testersHuib Schoots
 
Collaborative sketching - research through design
Collaborative sketching  - research through designCollaborative sketching  - research through design
Collaborative sketching - research through designNeil Allison
 
Module1 design process
Module1 design processModule1 design process
Module1 design processStacie Hidek
 

Similar to Collaborative Sketching for UX - NYU 02/19/14 (20)

Collaborative Sketching for UX - Razorfish 042115
Collaborative Sketching for UX - Razorfish 042115Collaborative Sketching for UX - Razorfish 042115
Collaborative Sketching for UX - Razorfish 042115
 
Collaborative Sketching for Secure & Usable Apps
Collaborative Sketching for Secure & Usable AppsCollaborative Sketching for Secure & Usable Apps
Collaborative Sketching for Secure & Usable Apps
 
Collaborative Exercises for Digital Design 3/7/18
Collaborative Exercises for Digital Design 3/7/18Collaborative Exercises for Digital Design 3/7/18
Collaborative Exercises for Digital Design 3/7/18
 
Design, Behind the Scenes 2.0
Design, Behind the Scenes 2.0Design, Behind the Scenes 2.0
Design, Behind the Scenes 2.0
 
UX Bristol 2012 - 'Designing UX without requirements' - presented by e3
UX Bristol 2012 - 'Designing UX without requirements' - presented by e3UX Bristol 2012 - 'Designing UX without requirements' - presented by e3
UX Bristol 2012 - 'Designing UX without requirements' - presented by e3
 
Experiences and Creative Process (Semih Energin Technology Stream)
Experiences and Creative Process (Semih Energin Technology Stream)Experiences and Creative Process (Semih Energin Technology Stream)
Experiences and Creative Process (Semih Energin Technology Stream)
 
A New Toolbox: Artifact Providence 2013
A New Toolbox: Artifact Providence 2013A New Toolbox: Artifact Providence 2013
A New Toolbox: Artifact Providence 2013
 
It's Not Just About Code
It's Not Just About CodeIt's Not Just About Code
It's Not Just About Code
 
Being a designer
Being a designerBeing a designer
Being a designer
 
Introduction to Design Thinking
Introduction to Design ThinkingIntroduction to Design Thinking
Introduction to Design Thinking
 
Intro to Design (Lecture)
Intro to Design (Lecture)Intro to Design (Lecture)
Intro to Design (Lecture)
 
So You've Got a Software Idea...Now What?
So You've Got a Software Idea...Now What?So You've Got a Software Idea...Now What?
So You've Got a Software Idea...Now What?
 
Designing Your UX Career
Designing Your UX CareerDesigning Your UX Career
Designing Your UX Career
 
Designer Games - Creative Exercises to Enhance Your Work
Designer Games - Creative Exercises to Enhance Your WorkDesigner Games - Creative Exercises to Enhance Your Work
Designer Games - Creative Exercises to Enhance Your Work
 
Thinking and working visually for software testers
Thinking and working visually for software testersThinking and working visually for software testers
Thinking and working visually for software testers
 
Selling UX
Selling UXSelling UX
Selling UX
 
Build sh*t that matters
Build sh*t that matters Build sh*t that matters
Build sh*t that matters
 
BE CREATIVE
BE CREATIVEBE CREATIVE
BE CREATIVE
 
Collaborative sketching - research through design
Collaborative sketching  - research through designCollaborative sketching  - research through design
Collaborative sketching - research through design
 
Module1 design process
Module1 design processModule1 design process
Module1 design process
 

More from Robert Stribley

Best Practices for Simplifying User Experiences
Best Practices for Simplifying User ExperiencesBest Practices for Simplifying User Experiences
Best Practices for Simplifying User ExperiencesRobert Stribley
 
Designing for Privacy in an Increasingly Public World — Speed Talk
Designing for Privacy in an Increasingly Public World — Speed TalkDesigning for Privacy in an Increasingly Public World — Speed Talk
Designing for Privacy in an Increasingly Public World — Speed TalkRobert Stribley
 
Designing for Privacy NY Studio—10/04/21
Designing for Privacy NY Studio—10/04/21Designing for Privacy NY Studio—10/04/21
Designing for Privacy NY Studio—10/04/21Robert Stribley
 
Designing for Privacy in an Increasingly Public World
Designing for Privacy in an Increasingly Public WorldDesigning for Privacy in an Increasingly Public World
Designing for Privacy in an Increasingly Public WorldRobert Stribley
 
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...Robert Stribley
 
Birds, Bats & Wind Turbines
Birds, Bats & Wind Turbines Birds, Bats & Wind Turbines
Birds, Bats & Wind Turbines Robert Stribley
 
Guidelines for Responsive UX Design 12/12/20
Guidelines for Responsive UX Design 12/12/20Guidelines for Responsive UX Design 12/12/20
Guidelines for Responsive UX Design 12/12/20Robert Stribley
 
Free Flow: The Economic Imperative for Restoring Immigration and Labor Movement
Free Flow: The Economic Imperative for Restoring Immigration and Labor MovementFree Flow: The Economic Imperative for Restoring Immigration and Labor Movement
Free Flow: The Economic Imperative for Restoring Immigration and Labor MovementRobert Stribley
 
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...Robert Stribley
 
Introduction to User Experience Design 2/15/20
Introduction to User Experience Design 2/15/20Introduction to User Experience Design 2/15/20
Introduction to User Experience Design 2/15/20Robert Stribley
 
Introduction to User Experience Design 12/07/19
Introduction to User Experience Design 12/07/19Introduction to User Experience Design 12/07/19
Introduction to User Experience Design 12/07/19Robert Stribley
 
Guidelines for Responsive UX Design 11/16/19
Guidelines for Responsive UX Design 11/16/19Guidelines for Responsive UX Design 11/16/19
Guidelines for Responsive UX Design 11/16/19Robert Stribley
 
Introduction to User Experience Design 10/05/19
Introduction to User Experience Design 10/05/19Introduction to User Experience Design 10/05/19
Introduction to User Experience Design 10/05/19Robert Stribley
 
Guidelines for Responsive UX Design 07/20/19
Guidelines for Responsive UX Design 07/20/19Guidelines for Responsive UX Design 07/20/19
Guidelines for Responsive UX Design 07/20/19Robert Stribley
 
Introduction to User Experience Design 06/22/19
Introduction to User Experience Design 06/22/19Introduction to User Experience Design 06/22/19
Introduction to User Experience Design 06/22/19Robert Stribley
 
Introduction to User Experience Design 04/27/19
Introduction to User Experience Design 04/27/19Introduction to User Experience Design 04/27/19
Introduction to User Experience Design 04/27/19Robert Stribley
 
Guidelines for Responsive UX Design 03/23/2019
Guidelines for Responsive UX Design 03/23/2019Guidelines for Responsive UX Design 03/23/2019
Guidelines for Responsive UX Design 03/23/2019Robert Stribley
 
Introduction to User Experience Design 2/16/19
Introduction to User Experience Design 2/16/19Introduction to User Experience Design 2/16/19
Introduction to User Experience Design 2/16/19Robert Stribley
 
Introduction to User Experience Design 12/08/18
Introduction to User Experience Design 12/08/18Introduction to User Experience Design 12/08/18
Introduction to User Experience Design 12/08/18Robert Stribley
 

More from Robert Stribley (20)

Best Practices for Simplifying User Experiences
Best Practices for Simplifying User ExperiencesBest Practices for Simplifying User Experiences
Best Practices for Simplifying User Experiences
 
Designing for Privacy in an Increasingly Public World — Speed Talk
Designing for Privacy in an Increasingly Public World — Speed TalkDesigning for Privacy in an Increasingly Public World — Speed Talk
Designing for Privacy in an Increasingly Public World — Speed Talk
 
Designing for Privacy NY Studio—10/04/21
Designing for Privacy NY Studio—10/04/21Designing for Privacy NY Studio—10/04/21
Designing for Privacy NY Studio—10/04/21
 
Designing for Privacy in an Increasingly Public World
Designing for Privacy in an Increasingly Public WorldDesigning for Privacy in an Increasingly Public World
Designing for Privacy in an Increasingly Public World
 
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
 
Birds, Bats & Wind Turbines
Birds, Bats & Wind Turbines Birds, Bats & Wind Turbines
Birds, Bats & Wind Turbines
 
Guidelines for Responsive UX Design 12/12/20
Guidelines for Responsive UX Design 12/12/20Guidelines for Responsive UX Design 12/12/20
Guidelines for Responsive UX Design 12/12/20
 
Free Flow: The Economic Imperative for Restoring Immigration and Labor Movement
Free Flow: The Economic Imperative for Restoring Immigration and Labor MovementFree Flow: The Economic Imperative for Restoring Immigration and Labor Movement
Free Flow: The Economic Imperative for Restoring Immigration and Labor Movement
 
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
No Transit: The Criminal Treatment of Transgender Asylum Seekers in the Unite...
 
Immigrant Song
Immigrant SongImmigrant Song
Immigrant Song
 
Introduction to User Experience Design 2/15/20
Introduction to User Experience Design 2/15/20Introduction to User Experience Design 2/15/20
Introduction to User Experience Design 2/15/20
 
Introduction to User Experience Design 12/07/19
Introduction to User Experience Design 12/07/19Introduction to User Experience Design 12/07/19
Introduction to User Experience Design 12/07/19
 
Guidelines for Responsive UX Design 11/16/19
Guidelines for Responsive UX Design 11/16/19Guidelines for Responsive UX Design 11/16/19
Guidelines for Responsive UX Design 11/16/19
 
Introduction to User Experience Design 10/05/19
Introduction to User Experience Design 10/05/19Introduction to User Experience Design 10/05/19
Introduction to User Experience Design 10/05/19
 
Guidelines for Responsive UX Design 07/20/19
Guidelines for Responsive UX Design 07/20/19Guidelines for Responsive UX Design 07/20/19
Guidelines for Responsive UX Design 07/20/19
 
Introduction to User Experience Design 06/22/19
Introduction to User Experience Design 06/22/19Introduction to User Experience Design 06/22/19
Introduction to User Experience Design 06/22/19
 
Introduction to User Experience Design 04/27/19
Introduction to User Experience Design 04/27/19Introduction to User Experience Design 04/27/19
Introduction to User Experience Design 04/27/19
 
Guidelines for Responsive UX Design 03/23/2019
Guidelines for Responsive UX Design 03/23/2019Guidelines for Responsive UX Design 03/23/2019
Guidelines for Responsive UX Design 03/23/2019
 
Introduction to User Experience Design 2/16/19
Introduction to User Experience Design 2/16/19Introduction to User Experience Design 2/16/19
Introduction to User Experience Design 2/16/19
 
Introduction to User Experience Design 12/08/18
Introduction to User Experience Design 12/08/18Introduction to User Experience Design 12/08/18
Introduction to User Experience Design 12/08/18
 

Recently uploaded

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 

Recently uploaded (19)

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 

Collaborative Sketching for UX - NYU 02/19/14

  • 1. Collaborative Sketching for UX Robert Stribley 02/19/14
  • 4. But now, we’re sketching more than ever • IdeaPaint Inc makes a paint that turns any surface into a whiteboard • Its sales have doubled every year since introduced in 2008 • More than ½ its business is in the workplace See “Doodling for Dollars,” Wall Street Journal, April 24, 2012
  • 5. Why sketch? • Enable communication • Make abstract concepts concrete • Iterate on ideas • Jumpstart collaboration • Ensure recollection • Humanize ideas
  • 6. What can I sketch? • Home pages • Category pages • Product pages • Wizards & widgets • Search results • Process Flows • Anything, really
  • 7. And there’s so much more to sketch for … • Smartphones • Tablets • Google Glass • iWatches • Responsive design • Ubiquitous computing
  • 8. Who can sketch? • Information architects • Interaction designers • Graphic designers • Content strategists • Project managers • Business analysts • Functional analysts • Developers • Client directors
  • 10. A few ways we sketch at Razorfish: • • • • • Solo Sketch to comp Communicate to client Storyboarding As a team – collaboratively
  • 11. What sketching isn’t … • Sketching isn’t only for designers • Sketching isn’t difficult • Sketching isn’t drawing You needn’t be Michelangelo to participate
  • 12. However, we can learn from the pros
  • 16. A Quick Case Study
  • 17. Any idea what this is a sketch of?
  • 18. 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
  • 19. Some Advice from the Experts
  • 20. “The great benefit of drawing is that when you look at something, you see it for the first time.” - Milton Glaser
  • 21. “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
  • 22. 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
  • 23. "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
  • 26. For the purposes of today’s workshop, sketching is … •Quick •Simple •Collaborative
  • 27. All the tools you need: Paper Sharpies Photo by JasonTank, Flickr
  • 28. 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
  • 29. 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
  • 31. 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
  • 32. 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
  • 33. 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
  • 34. Revise • Now begin your wireframe with a more informed view, more and better ideas • And sketch again if you need to
  • 40. Our Exercise: A home page for Events.com • A website for finding local events – Listed by category – Listed by date – Listed by … what else? • Who is the audience? – Locals – Tourists – Event promoters
  • 41. Also, consider other event sites you’re familiar with. This will be your “competitive analysis”
  • 42. Our Exercise: In teams, sketch your ideas 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 Discuss Sketch Share Revise
  • 43. Our Exercise: 1. Take 10 minutes to discuss what features belong here
  • 44. Our Exercise: 2. Sketch your ideas silently for 10 minutes
  • 45. Our Exercise: 3. Share your sketches with your team
  • 46. Our Exercise: 4. Sketch again, incorporating what you learned from others
  • 48. Books
  • 49. Sketching Tools The following apps are all for the iPad: • Adobe Ideas • Bamboo Paper • Muji Notebook • Penultimate • SketchBook Pro • Paper
  • 50. Prototyping AppSeed Currently in development, this Kickstarter project lets 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
  • 51. Further Study • 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

Editor's Notes

  1. Collaborative Sketching for UX
  2. “Aerial Screw” sketch by Leonardo DaVinci - circa 1483
  3. Cave painting in Lascaux, France
  4. Reference - “Doodling for Dollars,” Wall Street Journal, April 24, 2012
  5. Why Sketch?
  6. Sketches by Razorfish UX
  7. XKCD Cartoon http://xkcd.com/386/
  8. Sketch by Edward Hopper – Photo by Robert Stribley
  9. Sketch by Edward Hopper– Photo by Robert Stribley
  10. Sketch by Edward Hopper – Photo by Robert Stribley
  11. “Nighthawks” by Edward Hopper, 1942 – Photo by Robert Stribley
  12. Milton Glaser, graphic designer, designer of the I <3 New York logo
  13. Bill Buxton – Sketching User Experiences
  14. Common precognitive visual attributes – from The Back of the Napkin – Dan Roam
  15. Our Exercise
  16. Photo by JasonTank, Flickr
  17. Defining Collaborative Sketching6.8.5 – Create 6-8 sketches in 5 minutes
  18. Our Exercise
  19. Our Exercise
  20. Our Exercise
  21. Our Exercise
  22. Our Exercise
  23. Our Exercise
  24. Photo: Flickr.com/stribs
  25. Refer to websites: Flavorpill, NYCgo, Eventful, etc
  26. Resources
  27. Books: Sketching User Experiences by Bill Buxton, The Back of the Napkin by Dan Roam
  28. Sketching Apps
  29. Prototyping with sketches – source: http://www.fastcodesign.com/3017637/kickstarting-appseed-turns-your-sketches-into-apps
  30. thanks