ischool logoINFO 424 Spring, 2010:                                                                                                 
Course Schedule (course syllabus | resources)

WEEK 1

Concepts

Information Visualization
Visual Potential
Uses of color
Uses of text
Pre-attentive processing
Layering
Visual Hierarchy

Illustrator Skills

New files
Layers
Navigating
Drawing shapes
Coloring
Creating text
Selecting objects
Isolation Mode
Grouping
Text (alignment, spacing, style)

Flash Skills

Creating a new file
Managing panels
Importing from Illustrator
Symbols (button, graphic, movieClip)
Timeline (frames)
Tweens

Files created (dropbox)

  • VisualPotential_1.docx
  • MedalDrawing.ai
  • Medals_2_imported.fla
  • Medals_3_movement.fla
  • MapForKayakers.ai
  • MapForAudience.ai

.
MONDAY lecture - March 29

Introduction to course
Information Visualization
Visual Potential
Encoding/uses of color
Preview of labs for the week

Also take a look at this page where I've described my expectations around the lab time

MONDAY lab - March 29

EXERCISE: Spotting Visual Potential

LAB: Olympic Medals, Phase 1 (Draw in Illustrator)

a

LAB: Olympic Medals, Phase 2 (Import to Flash)

a

 
FRIDAY - April 2

LAB: Modify a Park Map

green background

LAB: Olympic Medals, Phase 3 (Make it move)

a

 

WEEK 2

Concepts


Uses of text
Uses of color
Unity & Variety
Defining colors (hue, saturation, value)
Color harmonies
Text & visuals proximity
Chart junk analysis concepts

Illustrator Skills

Chart tool
Grouping
Effects (drop shadow, arrowheads, blur)
Text formatting (style, spacing, alignment)
Pen tool
Dashed lines
Color tools
Live color
Color representations

Flash Skills

ActionScript (actions pane)
Instance names
Visibility
Events/event listeners
‘if’ clauses

Files created (dropbox)

  • BiofuelsPie.ai
  • BiofuelPieModifications.ai
  • Medals_4_tabs.ai
  • Network.ai
  • NetworkRecolored.ai

.
MONDAY lecture - April 5

Review - Visual Potential, uses of color & text

Basic design concepts - Unity, Variety (Harmony), color harmony, hue/saturation/brightness, Visual Hierarchy

Preview
MONDAY lab - April 5

LAB: Biofuels Pie

biofuels Pie

LAB: Olympic Medals, Phase 4: Make the tab buttons change appearance

a

 
FRIDAY lab - April 9

LAB: Network Diagram (WARNING: This takes a long time)

network diagram

 

WEEK 3

Concepts

Uses of color

Illustrator Skills

Pathfinder panel (merging shapes)
Color inventory

Flash Skills

Cell-by-cell animation
Commenting code
Controlling animation
Dynamic event listeners
Publishing files

Files created (dropbox)

  • colorAnalysis.ai
  • coloredBioFuelsPie.ai
  • DrugAnimation_Man.ai
  • DrugAnimation_Man.fla
  • Medal_5_control.fla
  • controlledAnimation.fla
  • Medals_6_slider.fla

.
MONDAY lecture - April 12

Review

Visual perception (introduced in map lab)

color perception, pre-attentive processing, tuning, layering

Preview - analyze pharmaceutical video

 
MONDAY lab - April 12

Debugging Video

LAB: Color Analysis

LAB: Pharmaceutical Drug Animation, phase 1 (Illustrator) - draw guy & house

LAB: Pharmaceutical Drug Animation, phase 2 (Flash) - animate toilet & drink

FRIDAY lab - April 16

FLASH QUIZ (trial)

LAB: Olympic Medals, Phase 5: Let the user control the animation

LAB: Olympic Medals, Phase 6: Control the movement with a slider

 

WEEK 4

Concepts

Uses of text
Visual hierarchy
Encoding
Labeling
Layout
Organization
Contrast & Legibility

Illustrator Skills

Text on a line
Scissors tool

Flash Skills

Slider component
Conditional statements
Alignment
Opacity
The Library
Static/Dynamic text
Mouse Events
Positioning on stage
Follow cursor

Excel Skills

Formatting charts

Files created (dropbox)

  • textAnalysis.ai
  • ParkStyleMap.ai
  • Medals_7_infoBox.fla
  • Medals_8_text.fla

 
MONDAY lecture - April 19

Review

Preview
MONDAY lab - April 19

LAB: Evaluate/Emulate Text

LAB: Create a Park-style map

finished map
FRIDAY lab- April 23

TAKE-HOME EXAM: Evauate & Emulate a Design

LAB: Olympic Medals, Phase 7 : Make the info box appear on hover

LAB: Olympic Medals, Phase 8 : Make the text change

WEEK 5

Concepts

Choropleth map split color scheme
color blindness

Flash Skills

Changing colors in AS
Parent/child relationships
Text property of text box
Child references
XML objects
Parsing text
Loading files
XML references
Trace statements
Import statements
Sprites
Graphic object
TextField object
TextFormat object
Adding to stage

Files created (dropbox)

  • choroplethMap.fla
  • dynamicText.fla
  • Medals_9_XML.fla
  • Medals_10_draw.fla
  • ActionScriptDrawing.fla

.
MONDAY lecture - April 26

discuss Bertin's graphs - thinking perceptually

talk about providing context

Audience

Animation
MONDAY lab - April 26

LAB: Choropleth map

choropleth map
FRIDAY lab - April 30

LAB: Olympic Medals, Phase 9 : Store the data in an XML file

LAB: Olympic Medals, Phase 10: Draw the circles with ActionScript

 

WEEK 6

Excel Skills

Chart anatomy
x axis
y axis
Category axis
Category axis labels
Series

Flash Skills

XML references
Looping through XML
Display order

Files created (dropbox)

  • Medals_11_XMLtoo.fla
  • xmlExercise.fla
  • DrugAnimation_finalDrawings.ai
  • EnergyConsumption_unformatted.xslx
  • Beverage_Buildings.docx
MONDAY lecture - May 3

Color schemes, color blindness

User feedback?
MONDAY lab - May 3

LAB: Olympic Medals, Phase 11: Add more data to the XML file

LAB: Pharmaceutical Drug Animation, phase 3: finish drawing
FRIDAY lab - May 7

FLASH QUIZ

LAB: Excel-Illustrator, Phase 1: Creating a Chart in Excel

WEEK 7

Excel Skills

Formatting

Flash Skills

Tweens in AS
Arrays
Pasting frames between files
MovieClip animations embedded in main timeline

Files created (dropbox)

  • DrugAnimation_scenes.fla
  • DrugAnimation_loops.fla
  • Medals_12_tweens.fla
  • tweens.fla

.
MONDAY lecture - May 10

Balance, White Space, Eye movement
MONDAY lab - May 10

LAB: Pharmaceutical Drug Animation, Phase 4: scene animation

LAB: Pharmaceutical Drug Animation, Phase 5: movieClip animations
FRIDAY lab - May 14

TAKE-HOME EXAM: Evauate & Emulate a Design

LAB: Olympic Medals, Phase 12: Create tweens in ActionScript

WEEK 8

 

Flash Skills

Slider Component in AS
Commenting code
.as files
Packages
Classes
Properties
Methods
Constructor

Files created (dropbox)

  • Medals_13_moreData.fla
  • Medals_13_commented.fla
  • EnergyConsumption_formatted.xslx
  • Gas_Wages.docx
  • DrugAnimation_Masks.fla

.
MONDAY lecture - May 17


Isotypes

Tools
MONDAY lab - May 17

LAB: Olympic Medals, Phase 13: Add more countries

LAB: Excel-Illustrator lab Phase 2: Formatting a Chart in Excel
FRIDAY lab - May 21

FLASH QUIZ

LAB: Pharmaceutical Drug Animation, Phase 6: Masking

 

WEEK 9

Excel Skills

Second axis
Move location of axis

Illustrator Skills

Clipping Masks & Compound paths

Illustrator Skills

Scissors tool
Live trace
Color guide
Rotate text

Files created (dropbox)

  • ImportedExcelGraph.ai
  • Medals_14_class.fla
  • FinalGraph.ai

.
MONDAY lecture - May 24

Review
MONDAY lab - May 24

LAB: Excel-Illustrator Phase 3: Importing an Excel File into Illustrator

LAB: Olympic Medals, Phase 14: Create a class
FRIDAY lab- May 28

TAKE-HOME EXAM: Evauate & Emulate a Design, Illustrator portion

TAKE-HOME EXAM: Evauate & Emulate a Design, Flash portion

LAB: Excel-Illustrator Phase 4: Emulating a Graph Design

bird graph

WEEK 10

SUMMARY (dropbox)

 
MONDAY - May 31 MEMORIAL DAY

No class
FRIDAY lab - June 4

FLASH QUIZ - CANCELLED (replaced by second portion of take-home exam)

work on finishing up any late labs and/or your final take-home exam