GARAMOND, ZURICH AND

OCHRE, OH MY!

IPT 655 Visual Instructional Design

Introductions

Balance

C.R.A.P. Design

• Type & Color

Information Hierarchy

Microsoft Word

Adobe InDesign I

Adobe InDesign II

Adobe Photoshop

Microsoft PowerPoint

Quantitative Information

Qualitative Information

Abstractions

Persuasion

DISCUSSION

“Desperate Housewives essentially functions as a kind of cognitive heat sink, dissipating thinking that might otherwise have built up and caused society to overheat.”

Do you think the internet has been as significant as the printing press? If it has, what does it mean for our role?

CRITIQUE

THEY’RE

NOT FONTS!

Typeface = set of letterforms and glyphs in a certain styleExample: Arial

Font = set of letterforms and glyphs from a typeface in a particular weight and sizeExample: Arial Bold 12pt

Typography

Typographic Anatomy

Typographic Anatomy

Serif / San Serif / ScriptMost readable (print) = serifMost readable (electronic) = san serif

Typographic Taxonomy

Display / BodyDisplay = NO MORE than 5 lines!Display = good for

○ Headlines○ Captions○ Pull-quotes

Body = block paragraphs

Typographic Taxonomy

Color

Hue : position on the color wheelPrimarySecondaryTertiary

Color

Value : lightness/darknessTint – lighter than pure hueShade – darker than pure hue

Color

Saturation : intensity of colorHigh saturation – “vibrant” “bright”Low saturation – “neutral” “muted”

Color

MonochromeUses only tints and shades of a single hueExamples: “black and white” “sepia”

Color

AnalogousAdjacent hues on the color wheel“Same family”

Color

ComplimentaryRed/GreenBlue/OrangeYellow/Violet

Color Relationships

Relative to the “PURE”HueSaturationValue

Relative to OTHER COLORSMonochromeAnalogousComplimentaryAccent

EXERCISE

ASSIGNMENT

Read Bonnet, “The Hero’s Journey” Select typefaces to match each of the adjectives

listed. Create color schemes (using paint chips) for at least 5 different adjectives.