CMN 440/ENS 696 Environmental Visualization   Fall  2006

    Tues/Thurs 3:30- 4:50     209  Marshall  Hall     last revised: 12/08/06
    John Felleman  108B Marshall Hall
    felleman@esf.edu            www.esf.edu/es/felleman
______________________________________________________

Overview      Objectives      Schedule       Format/Grading
 

We can even trace a particular word for 'insight' or 'knowledge' from one culture to another all over the Indo-European world. In Sanskrit it is vidya. The word is identical to the Greek word id&eacutea, which was important in Plato's philosophy. From Latin we have the word video, but on Roman ground this simply meant to see. For us,  'I see' means I understand
(Gaarder. Sophie's World)


OVERVIEW

  Visualization plays a critical role in:

 Scientific Understanding of complex  environmental  transport and transformation processes 
 Planning and Design of sustainable-development futures
 Decision Making between alternatives based on expected  impacts, costs, and their distributions

    Physically we evolved with vision as our primary sensory system. Not only is it the major way we obtain information, visual cognition and language socially co-evolved into our unique ability to conceptualize and communicate. Throughout human history the creation of environmental images, both pictorial and symbolic, have played a central role in our understanding (and misunderstanding) of environmental processes and our ability, (sometimes damaging), to manipulate the environment.

    Environmental professionals work in a multifaceted context of "Adaptive Management" wherein we must integrate three arenas:
    *continuous knowledge building regarding complex processes;
    *creation,  analysis and evaluation of alternative courses of action; and
    *facilitation of open, plural decision making.
In each, effective visualization is an important determinant of the ultimate environmental outcome.

    Environmental Visualization  integrates theory and methods from a number of associated fields:

    Physiology and Sensory Perception- how our visual system transforms continuously changing streams of photons to meaningful constructs.

    Scientific Visualization utilizes drawings, graphs, maps, animations and othe
r depiction types to help analysts "see" the underlying patterns in massively complex data sets such as weather satellite transmissions, and human brain physiology.

    Planning, Design, and Impact Visualization is used to spatially model location suitability, to generate alternative proposed project configurations, and to display predicted effects ranging from future vegetative patterns to pollution releases.

    Public Participation Visualization attempts to facilitate a meaningful extended discourse between decision actors and stakeholder groups in a variety of venues and media, with graphics that incorporate the underlying science, project analyses, and values sets in formats which reflect the range of visual literacies of involved publics.

    Environmental Visualization  is the synthesis of the above fields. It's  rapidly expanding  due in large part to the explosive growth of information technologies such as desktop publishing, GIS, computer graphics and animations, and the Internet. A few professionals from environmental, design and graphics, and communications backgrounds have begun to specialize in specialize in EV. All environmental professionals will need Environmental Visual Literacy, the ability to both interpret  a spectrum of visualization approaches, and to create and effectively communicate visualizations .


OBJECTIVES

After completing this course, students will be able to:

  1. Apply basic principles of visual perception and cognition including: figure-ground,  hierarchy and  organization, 3-D depth, and color;

  2. Classify visualizations by intended audience, rhetorical objective, visualization type, and level of abstraction;

  3. Develop project-based communication objectives, and schematically design preliminary visualizations which are appropriate for the selected audience and medium.


FORMAT/GRADING

Classes:
    3 credits of lecture, discussion, and in-class work activities per week. Some classes will be held in a computer cluster.

Resources
    The course "text" is a required reader. Each unit will be accompanied by  readings, handouts, course  web pages, and external Internet resources.  The primary resources will be existing visuals from a host of print and digital locations.

<>Workload:
    This is a "methods" course, in which the central means of learning is by "doing". Assignmnets involve both the critical analysis of existing visualizations, and the schematic development of new ones. Because the intent is to provide an introduction to a broad spectrum of concepts,  methods, and tools, there will be a number of short assignments. These will be assessed by students, and the professor on a continuing basis. All assignments and assessments will be kept in a 3-ring binder portfolio which will be evaluated (graded) at mid-term and the end of the semester.
    There are 3 kinds of graded assignments:
   
    Illustrated Glossary- As in all subjects, a major portion of learning is to understand and correctly apply the "correct" terminology. This is a significant, course-long, individual undertaking. After each class, the new glossary terms will be posted on the web page. For each term, students are to develop a short (typically a few sentences) working definition AND an illustration or an example. The illustrations can come from any source, however, a MAX. of 50% can come from the internet. One illustration, (properly annotated), may be used to illustrate mutiple terms. The text definitions will be word processed and printed in alpha order. The illustrations are typically separate,and numbered, with the number serving as the link to text. Illustrations are annotated to identify the associated terms.
    Homeworks- Each week or two students will be given a formal homework assignment to be completed individually, and submitted with a cover Transmittal Memo. Homeworks MUST be submitted by the due date to receive comments. Students who have prior coverage in a topic are encouraged to propose replacing the class assignment with an individualized assignment.
    Project-    The course theme this semester is "visualizing ESF".   Each student will select a topic of interest, such as our drinking water, handicapped access, or grass on the quad, and over the course of the semester develop an "infographic" to educate and potentailly activate members of the College community.
    Exercises-  The class will involve many short skill building exercises. The products of these will also be submitted in the Portfolio. They will not be graded, however missing exercises will reduce course grade.

Materials-
Some of the classes and assignments will require materials. These will be identified in advance.  A typical list includes:

pens
pencils hard and soft, red and blue pencils, and colored markers
engineer's plastic traingular scale
45 and 30/60 triangles
grid paper
tracing paper
computer CD disk


Grading:
  
    20    illustarted glossary 1
    20    illustarted glossary 2
    30    homework
    30    project

    ENS 696: Grad students will develop an individualized paper or project which complements their area of study. This will represent 30% of the course grade.


DRAFT Schedule
 
 

Class Date Topic  Readings;
 Terms and Figures;
 Assignments


 I. Foundations
 1 T   8/ 29  Introduction  Terms  
 Exercise
 2 Th   8/31   Elements, Objects, Backdrop, Context  Horton 27-53
 Terms
 Figures
 HWK #1
 3 T    9/5  Depth Cues  Web Resources 
 Exercise
 Terms
 4 Th    9/7  Figure/Ground  HWK #2
 Web Resources
 Terms
 5 T      9/12  Intro to Computer Drawing  Microsoft Press  
 Terms
 6 Th    9/14  Computer Lab- Baker 143
 MS Office/Draw
 Microsoft Press 
  Exercise
 7 T    9/19  1 and 2 Point Perspective  Hanks; Draw 3D
 Web Resources  
 Terms
 Exercise

Th 9/21
 NO CLASS

 8 T    9/26   Color  Horton p.35,36,40,46
 Web Readings
 Terms


 II. Functional Classes
 9 Th    9/28  Classification System  Terms/Concepts  
  WEB
 10 T   10/3  Drawings
    3-D Paraline;  2-D Orthographic
* Semester Project Topic Due
 Ching; Sorby; Beakley
 Terms
 Exercise
 11 Th  10/5      Cross Section;  Profile  handouts
 Terms
  Exercise
 12 T   10/10      Block Diagram; Cut-Away; Explosion  handouts
 Terms  
 13 Th  10/12  Maps: 
    Overview; Spatial Scales
*Prelim.
Glossaries Due
 ASCE ; Handouts
 Terms
 Web Resources
 14 T    10/17      Thematic (Choropleth); Measurement Scales
   *Project: Messages due
 Handouts
 Terms  
 Exercise
 Web Resources
 15 Th  10/19      ArcView Lab -  Baker 143
Handout
 Exercise
 Terms  
  T 10/24      NO CLASS  
16 Th  10/26   Contour
* Portfolio 1 Due, including:
    
 Handouts
 Terms
 Web Resources
 Exercise
 17 T  10/31   Countours in Excel
    Baker 143 (until 4:30)
 Handouts
 Exercise

 18 Th    11/2   Tables and Graphs: 
        Overview
 
   handouts
 Web
 Terms
 19 T   11/7    ArcView 3D Lab- Baker 149  handouts
  Terms
  Exercise
 20 Th   11/9   Student Project- Roundtable
 
Project: Visual Type Examples Due
   Handout Hwk #3

 21 T   11/14    Excel Lab- Baker 149  handouts
 
 22 Th 11/16    Flow Charts
   Hwk #3 Prelim. Submission
  Handouts
  Terms
  Exercise


   III. Planning and Production
 23 T 11/21   Text and Graphics: Concepts, Layout 
 McCloud; Horn; Desktop Pub.; Sci  Am  
 Terms
 24 T   11/28   Temporal Change/Animation; StoryBoards
  Handout Hwk #4
 Web Resources 
 Terms  
 25 Th  11/30   PowerPoint  Lab- Baker 156 

  Handouts
 Exercise
 26 T    12/5   Photoshop lab -
  156 Baker
 
 27 T   12/2  Copyright  handout
 Web Resources 
  Terms 

Th 12/14
12 Noon
 Portfolio II  Due -Room 108B Marshall
 




2006 Glossary Terms 
 
1. From Lecture and sylabus:           
            silhouette
            contour drawing


  2. From Lecture and Horton:
            civic discourse communications model
            defintion: graphic=...
            message
            redundancy
            decoration
            noise
            elements
            object (figure)
            backdrop (background)
            frame
           context
          

3. Depth Cues
          interposition
          texture
          object size
                size constancy
          vertical position
          object shade/ ground shadow
          linear perspective (parallel covergence)
          atmospheric perspective

4.  Object visualization elements (from Horton):
              Point
              line
              area
              line weight
              line form
              value
              texture
              pattern  
               
          figure/ground:

          optical illusion ambiguity
          camoflage
          map land/water ambiguity
         
    message hierarchy
          size
          value/hue (darkness/color)
          object shape
   labeling hierarchy
          within area
          adjacent/parralel- following linear object
          at distance with stringer (lightest line weight)
          legend box
   Graphic- text options
          title
          text on graphic
          legend
          figure caption

5,6  Microsoft Draw
         
raster graphic
         vector graphic
         "smart" objects

         Line types:
          "Line"
          "Scribble"
          Freeform" (polygon)
          "Curve"  (Bezier)
     Editable points
     Object manipulation:
          move
          resize
          rotate
          copy/paste
          Outline, color fill
          shadow
          "3D" (2 1/12D extrusion)
          group/ungroup
          order: front/back

7.  linear perspective
            horizon line
            vanishing point
            1 point perspective construction lines
            2 point perspective construction lines
            wireframe
            enhancement with additional depth cues

8. Color
        hue
        value
        saturation
        color blind
        color shift (in in different backgrounds)
        color use:
            cultural/symbolic
            disipline standards (landuse...)
            production process (print, internet...)
                additive color mixing (RGB)
                subtractive color mixing (CMYK)

9. Classification
      
       Modified Rodman visual classification diagram from Felleman web page

10. Ortho/Paraline
    orthographic projection system
        picture plane
        front/side/back view (elevation)
        plan view (planimetric projection, top view, map)
    3-D paraline
        plan oblique
        isometric projection
11. Cross Section/ Profile
       
cross section
            cutting plane (location on associated orthographic view, view direction arrows, labels)
             tisk strip garaph plot
        profile
            plan view stationing
            vertical exageration
           

12. Block diagram,explosion
     
(geologic) block diagram
       3-D cutaway/transparency
       Explosion
            3-D paraline
            2-D (map, graph...)

13 . Map Intro
        geographic scale- functional classes (ASCE)
        base map
             line
             orthophoto
        choropleth (thematic) map
        isopleth (contour) map
        map elements
            title
            north
            scale (ratio; bar)
            map border
            legend
            location map (composite: inset or side-by-side)
        map generalization:
             classification
             simplification
             exaggeration
             symbolization



14. Choropleth maps
 
   Choropleth map- Basic assumption of spatial distribution of environmental phenomena

    Chorpleth-Conformant (conformal)

        start with bounds-predetermined
        evenly "pour" data into bounds
       
    Chorpleth- proximal
        start with data classes- predetemined
        work from known locations outward to establish area bounds
            generalization:
             area threshold size- inclusions
             mixed classes and transitional edges                 
       
    Theissen map

    Environmental Measurement scales:
        nominal
        ordinal
        interval
        ratio


15. ArcView 2D Maps
      AV theme
        AV  view
        AV feature data table        
        color ramp
        thematic map/graph hybrid     

16. Contour
     contour (isarithmic) map
    contour line
          labeling
          line weight
    color-banded contour   
    linear interpolation from grid
    interpolation from non-grid
        neighbors/zones
        linear-distance exponent
    posting
    isopleth map

18. Table/Graph
       data
       information
       error bars/data range
       significant figures
       table data:
            ratio
            ordinal
            nominal
        table components (from readings)
            one way
            two way
            multiway
            header
        graph components
            title
            axes
            grids
            legend
            data label
         graph types:
                scatter; column; stacked column; area; line; "stock" ( high/low, bar-"wiskers")

19. Arc View 3D
     grid data file
     terrain color ramp
    hillshade
    profile "layout"
    draped warped grid
    extruded polygon (shapefile)

22. Flow Charts
        box and arrow diagram
        organization chart
        "7+-2" hierarchy
        serial flow
        parallel flow
        feedback loop
        burst event
        merge event
        process 2D/3D hybrid
        quantitaive flow hybrid
        tree chart
23. Text/Graphic Layout
        text wrap
        infographic
        from readings:
            initial cap
            banner
            pull quote
            caption
            subhead
24. Change/Motion
          static side-by-side time sequence                  
          scene cut
          object animation within frame -build
          storyboard
                thumbnail  sketch
                treatment
           frame (slide) transitions

27. Copyright
        copyright owner's rights
        what can be copyrighted:
            "finished work" v. idea
            creative work v. "sweat of brow"
        3 "levels" of copyright protection
        "Fair Use" exceptions
        Hester's derivative categories (from handout)



2006 Exercises


Lec. 1  Contour sketch of Hand


Lec.3 
Either:
             A. complete the web cylinder shading exercise; AND do the cone, ball,cylinder, hollow block figures fron class handout; or
             B. render shade and shadows in a simple still life sketch you create on your own, utilizing 3 or 4 distinct values.

Lec. 6   Bear brochure in Microsoft draw- submit in portfolio hard copy, and send spreadsheet as e-mail attachment

Lec. 7   One and two point perspective
       As started in class work session: from first class handout "Rapid Viz" p. 23 and 24. Label horizon line, vanishing points, and complete 2 cubes above, on, and below the horizon in each figure.  Use a color for the linear perspective rays. 
Use a dark outline to highlight each cube, with a lighter line to represent interior edges. When complete, select one cube in each figure, assume a light source, and shade the visible faces (light medium dark).

Lec. 10   Complete the Plan- oblique for the site plan handed out in class.  Work in colored pencils on the handout showing all construction guidelines. Render final on trace overlay using line hierarchy, with shade and shadow in pencil.

Lec. 11
From the class reader Sorby article, working on a xerox of the dot-grid
complete the isometric cubes for Exercises # 9 and 12. on p.32.

Lec. 14  Using the Theissen method, construct a choropleth map from the nominal data pin map handed out in class. On the handout pin map do construction work in colored pencils.  Show final map on a trace overlay, include: title, legend, and data posting.


Lec. 15   Representative printouts from each of the three Lab Chapters. Hand annotate with title and your name.


Lec. 16    Visually interpolate straightline 5' contours on the Saddle "Topogrid" and  "Topo Sample" Handouts by labeling where you visually estimate contours cross grid lines and sketching in the contour.  On a trace Overlay draw smooth (curvilear) contours in  using 2 different line weigts. Label contours. Add title, name.

Lab 17. Color contour printouts listed in lab handout.

Lab 19 color printout of each major step in the ArcView 3D lab

Lec. 22  from class- complete 3 flow charts of the bear food chain:
   A. Basic boxes and arrows
    B. Hybrid: Objects and arrows
    C. Hybrid: Objects and arrows in 2D or 3D background context
Include a classification graph that plots each of the above

Lec. 25
From Handout, complete the "Boing" PowerPoint animation. In portfolio include printout of speaker notes. Also atach animation to an e-mail and send to:    felleman@esf.edu



2006 Web Resources


Lec. 3
Depth Cues
        A. A Professor at York U. in Canada has an excellent site for introducing vision , The Joy of Visual Perception. Go to:
http://www.yorku.ca/eye/thejoy.htm
     Read Ch. 1 Intro ., and Ch. 9 Distance Perception .

        B. Also visit : http://psych.hanover.edu/Krantz/art/cues.html     and look at depth cues in art

        C. Shadows and Shading are a simple and powerful means of conveying Depth in a Visual. There is a good (free)  On Line Art School at: http://www.wetcanvas.com/ArtSchool/Toolbox/LearningHowToDraw/freehand1/index.html
Using your course materials(if you don't have a soft 4B pencil try your 2B), do the exercises in:  Free Hand Shading. Then read the next lesson: Free Hand Shadows and Texture


Lec. 4 Figure Ground
   
     Check out how you do at identifying "embedded objects" at: http://www.csun.edu/~vcoao0el/de361/de361s101_folder/FGembededTasks.html

    Lots of study has been done on how our brains attempt to impose order on ambiguous inputs. View some classic illusions at: http://dragon.uml.edu/psych/illusion.html

       Look at "laws of camoflage": http://www.units.muohio.edu/dragonfly/hide/gestalt.HTMLX




Lec. 7. Linear Perspective
    Lot's of good sites showing how to construct perspectives, and giving art examples for you to view. Check some out:
http://www.wetcanvas.com/ArtSchool/Toolbox/LearningHowToDraw/index.html
http://www.geocities.com/~jlhagan/lessons/persp1-4.htm

8. Color
    Go to the Cornell U. "Art, Design, and Visual Thinking" Page:
http://char.txa.cornell.edu/
    From the "Table of Contents":  Explore "Color", and "Color Psychology"

    At the "Color Matters" site, review basic Color Theory:
http://www.colormatters.com/colortheory.html

    Take the "Color Blind Self-Test":
http://www.visibone.com/colorblind/

    Take a quick look at on-goung research in the use of color in maps:
http://www.personal.psu.edu/cab38/ColorBrewer/ColorBrewer_intro.html
_____________________________________________
Lec. 9 Classification
Go to JF's website, download and print out the 28p. pdf document. Read through quickly and bring to class Thurs. We will use this the rest of the semester:
http://www.esf.edu/es/felleman/Classifying%20Envl%20Visuals%20+Pics%20July18.pdf

13 . Map Intro; Spatial Scale

    An excellent On-Line Intro to Maps and map design can be found at:
http://www.Colorado.EDU/geography/gcraft/notes/cartocom/cartocom_f.html

    Visit the Geography Network to explore the exploding world of on-line digital spatial data:  http://www.geographynetwork.com

    Check out interactive mapping at the EPA's "Enviro-Mapper" site: http://www.epa.gov/enviro/wme/

14. Thematic Maps
    Carefully review Topic #6 Statistical generalization at:
http://www.Colorado.EDU/geography/gcraft/notes/cartocom/cartocom_f.html


16. Contours
    Go to Golden Software and review the features of "Surfer":
http://www.golden.com/

    Many environmental pollution studies generate contours from sophisticated computer "process models.
    Examine  Noise Pollution http://www.ohare.com/cnrc/ohare/o_noise_2000contour_pres1.shtm



18. Tables-Graphs 
    Excel is primarily designed for business applications. For a quick look at plotting software that is specifically for the environment check out "Grapher":http://www.goldensoftware.com/products/grapher/grapher.shtml

    The Guru of table and graph design is Edward Tufte. The library has his excellent books. Learn a bit about his work at:
http://www.evl.uic.edu/davidson/CurrentProjects98/ET_VisualInfo/Explanitory_Pages.html

24. Animation/ StoryBoard
     Lot's of good SB stuff here:  http://www.thestoryboardartist.com/
     A master political satirist: http://www.sfgate.com/columnists/fiore/archive/
    View a "how-to" internet animation: http://www.toddgallina.com/how/
         or get your own free software at: http://www.atomiclearning.com/freestoryboard.shtml
   Lot's of Power Point Animation ideas at: http://pptheaven.mvps.org/index.html


27. Copyright
    The "official" federal copyright site is: http://lcweb.loc.gov/copyright/
        Read "Copyright Basics"     There is considerable activity regarding Copyright as we move into the digital world. This is particularly critical for the visual arts. Go to "The Copyright Web site" : http://www.benedict.com
and review "The Basics". Then go to "Visual Arts" section and look at the big bucks cases, such as Batman, and the Naked gun.






2004 Glossary Terms
      
  







25. Photoshop
       Raster Object Selection
            lasso tool
                freehand
                polygon
                magic wand
                        tolerance
        layers
        transparency in .gif file format












2003 Exercises



Lec. 25 Photoshop- Select
          Atomic testing is underway adjacent to the park  where you did your  bear Draw  brochure         (Lec. 6) . Use Photoshop's select tools to insert a giant snake and a giant lizzard into the bear scence.   Submit hard copy printout.


      



2003 Web Readings/Assignments-
       











24. Scanning/ Imaging
    Review basics of scanning precision and file formats. Read "Scanning 101, Concepts 1,2,3,8,and 9 at:         http://www.scantips.com/ 

    Since the origins of photragraphy in the mid 1800's,  images have been manipulated for artistic and other purposes such as propaganda and fraud. A three part article on the manipulation of naure photography can be found at:    http://www.theatlantic.com/issues/98may/photo.htm

    There are lots of photo resources on-line. A few starting places are:
        Google Image Search: http://images.google.com/
        Alta Vista Photo Finder: http://web.altavista.com/cgi-bin/query?mmdo=1&stype=simage
      

25. Photoshop
    A great place to start is the "WebMonkey's" Photoshop crash course. Read lessons 1 and 2, and glance at the rest: http://www.ets.uidaho.edu/photoshop/intro/index.htm     There are many "classes' on-line. Go to: http://www.designillustration.com/BCC3/lessons.htm
    At the bottom of the page is Photoshop. Look at the weeks of Nov. 13, 20, 27, and Dec. 4. First comes the "Quiz", scroll past this to the Lessons (Pages 2,3...)


26. Animation/ StoryBoard
     Lot's of good SB stuff here:  http://www.thestoryboardartist.com/
     A master political satirist: http://www.sfgate.com/columnists/fiore/archive/
    View a "how-to" internet animation: http://www.toddgallina.com/how/
      Check out "Flash" animations : http://www.wired.com/animation/
    or get your own free software at: http://www.atomiclearning.com/freestoryboard.shtml




 















18. 3D GIS
    Look at the pollution "Images" at EVS: http://www.ctech.com/
    Examine EPA's GIS Vis:  http://www.epa.gov/gisvis/arcview/index.html
    Check out Orton's "Community Vis-Town Builder": http://www.orton.org/frameset.cfm