Concept diagrams are one of the best bang-for-buck deliverables available to today’s UX designer. In its most basic form, a concept diagram uses nouns connected by verbs to describe a system, idea, or application. It can be a sophisticated deliverable or a quick-and-dirty sketch. The technique is not unlike diagramming sentences in elementary school — though it tends to be quite a bit more fun. This is a fast-paced primer on building better concept diagrams and using them to understand relationships between ideas in new ways. In particular, we’ll examine how to use concept diagrams to represent domain expertise and create a mechanism for transferring knowledge between stakeholders, subject matter experts, and designers. Learn the simple rules for creating concept diagrams, when you will and won’t want to create one, and what to do with it once you have it. Understand how concept diagrams differ from similar techniques such as affinity diagramming and mindmapping, and when best to apply each in your process. Variations on this talk have been presented at the 2014 Information Architecture Summit in San Diego, MinneWebCon 2014 at the University of Minnesota, Web 2013 at Penn State, and the 2014 University of Illinois Web Conference.

1. Start Smarter
with a Concept
Diagram
!
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
@scottrocketship | #startsmarter

2. From the film “Ten Bullets” by Tom Sachs http://vimeo.com/34901903

3. From the film “Ten Bullets” by Tom Sachs http://vimeo.com/34901903

4. From the film “Ten Bullets” by Tom Sachs http://vimeo.com/34901903

6. @scottrocketship | #startsmarter
There’s nothing
worse than a sharp
image of a fuzzy
concept.
- Ansel Adams, photographer

7. @scottrocketship | #startsmarter

8. @scottrocketship | #startsmarter
Clarity is
empowering.

9. When you don’t know
what you believe,
everything becomes an
argument.
- Jason Fried & David Heinemeier Hansson
Rework p. 44, 2010
@scottrocketship | #startsmarter

10. @scottrocketship | #startsmarter
Isness vs.
Oughtness

11. How do we
know we’re
finished?

12. Where does this
project fit?

13. It’s a good idea,
but is it “us”?

14. I don’t
understand.

15. Never delegate
understanding.
- Charles Eames

16. @scottrocketship | #startsmarter
Concept Diagrams Defined

17. Concept
Modeling
is a
results
in
Concept
Diagram(s)
Process

18. Nouns connected by Verbs
Concept
(noun)
Concept
(noun)
Proposition
link (verb)

19. knowledge is
assimilated in the
framework of what we
already know
@scottrocketship | #startsmarter
CONSTRUCTIVISM
BASICALLY...

22. Concept
Modeling
is a
results
in
Concept
Diagram(s)
Process

23. Software
SystemsBusiness
Systems
can represent
in
Concept
Diagram(s)
SaaS
applications
iPhone apps
e-
commerce
site
MOOC
survey tool
brand
standards marketing
campaigns
project
processes
event plans
the
business
itself

24. “the diagram before the diagram”

25. @scottrocketship | #startsmarter
Building Concept Diagrams:
A Five-Step Process

26. @scottrocketship | #startsmarter
Ask a question.

27. Novak, J. D. & A. J. Cañas, The Theory Underlying Concept Maps and
How to Construct and Use Them, Technical Report IHMC CmapTools 2006-01
Rev 01-2008, Florida Institute for Human and Machine Cognition, 2008

28. How do we know
we’re finished?
Where
does this
project fit?
It’s a good
idea, but is it
“us”?I don’t
understand.

29. @scottrocketship | #startsmarter
Make a list.

30. Nouns Verbs

31. 3 Zones of Assessment
on your person
immediate
surroundings
within a short
distance

32. Materials Review
Expert Interviews
Competitive Research
Mindmapping

33. B.R.E.A.D.
browse
read
edit
add
delete

34. Nouns
Things you can name. Dog. Love. Pencil.
Transaction. David Bowie.
Actions. Capture anything that’s
unique, interesting, or colorful.
Verbs

35. Tips:
• collect collect collect! filter later
• don’t start with a blank page
• cluster variations
• show it around— lists are easy
for others to riff on

36. @scottrocketship | #startsmarter
Make
connections.

37. Monopoly
is
Familes
play
Board
game

40. Tips:
• plural nouns make it easier
• colorful verbs are great
• aim for three or fewer words
• stuck? add a bunch of lines, then
fill in verbs
• leave it messy

41. @scottrocketship | #startsmarter
Arrange the
pieces.

42. Photo by Flickr user Jay Malone http://www.flickr.com/photos/jcorduroy/

45. Tips:
• circles are easier when working
digitally
• 15-25 pieces are a good start
• give yourself some space
• a bit of grouping is okay, but be
open to change

46. @scottrocketship | #startsmarter
Refine
and test.

54. @scottrocketship | #startsmarter
Building Concept Diagrams:
Focus Gather ArrangeLink Refine

55. @scottrocketship | #startsmarter
Concept diagrams
in practice.

56. A POST
Replies
Title
Body
Type
Question
Feature
Topic
always has a
always has a
written by the
written by the
belongs to exactly one
is described with zero or more
such as
Issue
is the anchor for any number of
Userchosen by the
User
chosen by the
Categories
organized into
User
which are NOT selected by the
Interface
that are only part of the
Any User
written by
Body
which only have a
re
es
Consumer
Products
Wolfram
Tones
Physics
Transportation
such as
which can be browsed and
followed the same way as
will not (in version one) affect the
?
ARTICULATION

57. A POST
Replies
Title
Body
Type
Question
Feature
Topic
always has a
always has a
written by the
written by the
belongs to exactly one
is described with zero or more
such as
Issue
is the anchor for any number of
Userchosen by the
User
chosen by the
Categories
organized into
User
which are NOT selected by the
Interface
that are only part of the
Any User
written by
Body
which only have a
re
es
Consumer
Products
Wolfram
Tones
Physics
Transportation
such as
which can be browsed and
followed the same way as
will not (in version one) affect the
Groups
April 20, 20

58. COORDINATION

59. COORDINATION
+

60. brand
company
CONVERSATION

61. Website
Portal
available at
idealer.co/
dealername
is built by
is a
Service
for
that powers
Native Mobile
Apps for Auto
Dealerships
used by
Dealership
Customers
De
to enh
and
used to
manage
Auto
Dealers
designed
for
who access
brand
company

62. @scottrocketship | #startsmarter
Use concept models for
yourself. Ultimately,
they are the most selfish,
introspective, and self-
indulgent artifact...
- Dan M. Brown
Communicating Design, 2nd Edition, p.65
CONVERSATION

63. DOCUMENTATION

64. DOCUMENTATION

65. EVALUATION
✔
✔
✔
✔
✔
✔

66. FACILITATION

67. FACILITATION

68. :)
@scottrocketship | #startsmarter
Thanks.
http://kubie.co
Search Icon: Gianni Clifford, from The Noun Project
List icon by Charlérik Lemieux, from The Noun Project
Puzzle icon by Irene Trautluft, from The Noun Project
Repeat icon by Greenwave, from The Noun Project
Idea exchange icon by Luis Prado, from The Noun Project
Question icon by Marc Orro, from The Noun Project
Bread by Jon Testa from The Noun Project

69. ?
@scottrocketship | #startsmarter
Questions?
http://kubie.co
Search Icon: Gianni Clifford, from The Noun Project
List icon by Charlérik Lemieux, from The Noun Project
Puzzle icon by Irene Trautluft, from The Noun Project
Repeat icon by Greenwave, from The Noun Project
Idea exchange icon by Luis Prado, from The Noun Project
Question icon by Marc Orro, from The Noun Project
Bread by Jon Testa from The Noun Project