Creating conceptual models in Adobe Illustrator (10)

Conceptual Diagrams
A tool for science communication
Bill Dennison & Tim Carruthers
integration
application
network
Conceptual diagrams
• Conceptual diagrams have proven useful for
science integration and applications
• Technological advances have made it possible to
‘click & drag’ using symbol libraries (you don’t need
to be an artist)
• An easy to use system that can ‘grow’ (updated
with additional symbols and bases) will encourage
more scientists to use conceptual diagrams and
communicate more effectively
"Make everything as simple as possible, but not
simpler." A. Einstein
integration
application
network
What is a conceptual diagram?
• “Concept” from Latin conceptus (meaning thought);
something conceived in the mind
• “Diagram” from Greek diagramma (meaning to mark out
by lines);
• a graphic design that explains rather than represents, a
drawing that shows arrangement and relations
• THOUGHT DRAWING
• Conceptual diagram = A diagram using symbols that
depicts the essential attributes of a system
integration
application
network
Conceptual diagrams provide an interface
Science
Conceptual
Diagram
Priorities &
environmental
values
Current
understanding
Credibility &
support
integration
Community
Shared
vision
application
Commitment &
resources
network
Good conceptual diagrams are used extensively
Z scheme of photosynthesis
Plate tectonics
integration
application
network
Darwin used conceptual diagrams to
explain his theory of coral reef
formation
integration
application
network
Conceptual diagrams use symbols: an ancient
technique to depict unequivocal messages
Darwin’s conceptual diagram
Cave drawing (Australian
aborigines)
integration
application
network
Symbols (icons) are a key element of conceptual diagrams
• Symbol: from Greek symbolon (token of identity) and Latin symbolum (token, sign)
• Symbol: A sign that signifies by virtue of sharing a property with what it represents
–a. something that stands for or suggests something else
–b. a visible thing that stands for something invisible or intangible
• Symbols used in mathematics (e.g., p), chemistry (e.g., 210Pb), music
(e.g.,
) weather (e.g.,
), religion (e.g.,
), corporations
(e.g.,
), and organizations (e.g.,
)
• Symbols can be universal; language independent
• Symbols are scalable; size of symbol can represent relative importance--
vs.
• Symbols can be information-rich; size, shape, color and position of symbols can convey
information
integration
application
network
Both shape and color of symbols
can be important for recognition
integration
application
network
Symbols are an important feature of
everyday life
Shape, color and images used for traffic signs
integration
application
network
In conceptual diagrams, as in maps,
symbols need to be explained in a legend
Map legend:
Conceptual diagram legend:
integration
application
network
Conceptual diagrams can capture the
increasing understanding of a system…
1995
1998
2001
integration
application
network
Conceptual diagrams can depict
processes at different scales…
meters
kilometers
centimeters
integration
application
network
Conceptual diagrams can be nested
integration
application
network
Conceptual diagrams are not…
… cartoons
… model relationships
… colored box & arrow diagrams
… a replacement for good, wellinterpreted data
integration
application
network
Conceptual diagrams can augment
the effective communication of
scientific understanding
Conceptual diagram
that uses 2 pp. of
text for explanation
integration
Conceptual diagram with
‘stand-alone’ legend
application
network
Literature citations can be added…
integration
application
network
Why use conceptual diagrams?
• Helps to clarify
thinking
(words can be ambiguous, an
image commits to the message
being portrayed)
• Communication
(one way and two way –idea
presentation and idea
development)
• Identify gaps /
priorities / essential
elements
• Develop syntheses (or
present synthesis)
Seagrass loss in Moreton Bay
integration
application
network
Use of conceptual models facilitates
hybrid diagrams of data
Journal
articles
integration
Books
application
network
Symbols can be used on maps and linked
to species identification guides
Distribution
map
Identification
guide
integration
application
network
Who develops/uses conceptual
diagrams?
Scientists
Teachers
Resource Managers
integration
application
network
Various applications of conceptual
diagrams
Research
Synthesis
Monitoring
Management
integration
application
network
Conceptual diagrams can be incorporated
into various publications
Books
Newsletters
Journal
publications
Posters
integration
application
network
Conceptual diagrams can be used in
powerpoint presentations
Overall summary
Component diagrams (nested)
Problem statement
Problem resolution
(Burford et al.)
integration
application
network
Conceptual diagrams can be produced in
real time to synthesize main messages
Result of one day meeting into seagrass loss in Western Port
integration
application
network
The Ten Commandments of
conceptual diagrams…
1. Thou shalt honor thy audience
2. Thou shalt simplify
3. Thou shalt not use garish colors or apply colors inconsistently
4. Thou shalt not produce a diagram without a complete legend
5. Thou shalt not covet a single style
6. Thou shalt not be constrained by geometry
7. Thou shalt not use arrows indiscriminately
8. Thou shalt not be afraid of making new symbols
9. Thou shalt not publish diagrams without significant editing
10. Thou shalt not confine use of diagrams to scientific peers
integration
application
network
Drawing Programs
Program
Web Site
Price
Adobe Illustrator
(PC, MAC)
www.adobe.com
* $ 45
Corel Draw
(PC)
www.corel.com
* $165
www.macromedia.com
** $ 99
www.deneba.com
** $199
Macromedia Freehand
(PC,MAC)
Deneba Canvas
(PC, MAC)
* ~ USM Site License
** ~ Educational Price (not though USM site license)
integration
application
network
Copyright issues
http://www.copyright.gov
/
http://www.benedict.com/homepage.htm
• © Dennison 2000 and /or add logo; but this does NOT
connote any real proprietary value
• Right click to grab image from web site—public
supported web sites do not need permission, but
permission and/or acknowledgement is
recommended
• Ideas not copyrightable “Copyright does not protect
ideas, concepts, systems, or methods of doing
something.”
• Universal symbols, lists and tables from public
documents are not copyrighted
integration
application
network
Resolution issues
Print/Publication
Monitor/Web
300 Dots per inch (DPI)
72 DPI (also called PPI-Pixels
per inch)
CYMK palette
cyan, yellow,magenta, black
RGB palette
Red, green, blue
Drawing files, bitmap imagesMay be large files (size)
Compressed images, small files
(size)
Pixel = Picture Element
Text scanned in as line art at 600 DPI
Paste Special when inserting image > smaller image size
72 dpi 150 dpi 250 dpi
integration
application
network
Transferring images to Powerpoint..
•
•
•
•
From the ‘edit menu’:
choose ‘paste special’
For diagrams and figures use
Enhanced Metafile, GIF or
PNG
For photos use JPEG
This can reduce a 70Mb
powerpoint file to 2Mb !!
integration
application
network
File Types
vector
— determined by the way they
represent graphic information
raster
File
Name
Type
Primary Use
*.ai
Adobe Illustrator
vector
art work
*.cdr
Corel Draw
vector
art work
*.bmp
Windows bitmap format
raster
photographs, art work
*.tif
Tagged-Image Format
raster, vector
scanned images
*.eps
Encapsulated Postscript
vector, raster
art work
*.jpg
(jpeg)
Joint Photographic Experts
Group
compressed
raster
photographs (web)
*.gif
Graphics Interchange
Format
compressed
raster
art work (web)
integration
application
network
Creating conceptual diagrams
• Define overall message (e.g., what story or stories
to tell)
• Identify audience (e.g., scientific peers, general
audience)
• List key structural & functional aspects
– major processes (e.g., biogeochemical pathways,
food web)
– biota/habitats (e.g., forest types, wetlands)
• Experiment with ways to depict system (2D vs. 3D;
mirror images; nested)
• Start drawing (white boards are useful)
integration
application
network
Layering simplifies the diagram
Layer 1 (background panels)
Layer 2
(Icons and Keys)
Layer 3 (window dressing)
Priority is assigned within layers
: a ‘sent to back’ icon will be in front
of the ‘sent to front’ background panel
integration
application
network
The ‘layers’ window
Creates new layers
integration
application
network
The ‘layers’ window
The currently active layer is highlighted,
anything drawn or imported will be in this layer
integration
application
network
The ‘layers’ window
This locks entire layers (for eg base of model) –
to work on other layers (eg icons)
integration
application
network
The ‘layers’ window
Layers are indicated by different highlight colors
integration
application
network
Bases can be 2 or 3 dimensional
• Forming Bases – Filled and Clear arrow tools
• Line and Fill colors – the color/stroke/gradient menus
• Textures – the swatch menu
Bases
integration
application
network
Click and drag bases…
Import the
‘bases palette’
integration
application
network
Click and drag bases…
integration
application
network
Click and drag bases…
To edit base,
right click &
‘break link
to symbol
integration
application
network
Replicating a base fill/style
Open the Style library
‘Environmental..
Physical Styles’
Then highlight the object
to receive a fill style
integration
application
network
Replicating a base fill/style
Changes fill, in this
case to ‘mud’
integration
application
network
Gradient palette
Custom gradients
can be found in
the swatch palette
integration
application
network
Gradient palette
Useful to indicate
gradual changes
in water quality etc
integration
application
network
Gradient palette
Adjust mid point
of gradient
Create new
color points
integration
application
network
Pen tools (selection tools)
Drawing palette
Left click and hold on pen tool gives four options..
integration
application
network
Pen tools (selection tools)
integration
application
network
Pen tools (selection tools)
integration
application
network
Pen tools (selection tools)
integration
application
network
Pen tools (selection tools)
integration
application
network
Pen tools (selection tools)
integration
application
network
Outlines and Fills
Fill
Outline
Line is defined as black and a stroke weight of 1 pt
Fill is transparent (turned off)
integration
application
network
Outlines and Fills
Line is transparent (turned off)
Fill is defined as light blue
integration
application
network
Libraries
Window:
symbol libraries
choose required
library
integration
application
network
Libraries
3
1. Create new layer
2. Choose symbol
3. Insert into model
1
2
integration
application
network
Creating new symbols
Find a photograph of
object and import into
Illustrator
Lock the image
integration
application
network
Creating new symbols
Choose the standard
pen tool
Set line thickness and
choose an easily visible
color
Start tracing areas of
uniform color
integration
application
network
Creating new symbols
Use the curve pen
tool to smooth lines
integration
application
network
Creating new symbols
Adjust color and fill
integration
application
network
Grouping and transforming
Having created a
symbol group the
elements
integration
application
network
Grouping and transforming
Symbols or elements can
be rotated, scaled and
reflected
integration
application
network
Grouping and transforming
integration
application
network
A range of currently available
symbols
integration
application
network
www.ian.umces.edu/conceptualdiagrams.htm
Please visit our website to download the symbol libraries for
Illustrator for FREE
Be sure to click the “Register for FREE Instant Access” link
integration
application
network
Acknowledgements…
Eva Abal
Catherine Collier
Karen Holloway
Diana Kleine
Kate Moore
Judy O’Neil
Francis Pantus
Dieter Tracey
integration
application
network
Future possibilities:
•
Develop Stella-like functionality with conceptual diagram ‘frontend’ (quantitative representations, scenario runs)?
integration
application
network