Week One

In class

Introduction

• Document genres & information design
• Sample document: Paper money
• Sample document: Grand Central Station poster



Key Concept: Genre Conventions

• Figure 1: Spectrum of Conventions
• Figure 2: Table of Conventions
• Examples of conventions:
  1. Sample conventions (1): Memo
  2. Sample conventions (2): Business cards
  3. Sample conventions (3): Poem in a critical edition
  4. Sample conventions (4): Traditional "bad" index
  5. Sample conventions (5): Well-designed index
  6. Sample conventions (6): Email message
  7. Sample conventions (7): Comic-book splash page
  8. Sample conventions (8): Annotated text



Sample project from Spring 2006

• Amy's Catalogue
• Reference article: John Von Neumann
• Informational Poster: Computer Myths
• Informational Poster: Computer Game Myths



Make Folders for Design Work

• Use SSH to make coursework folders on Eden:
  
  Note: Don't use spaces or upper-case letters in file or folder names!
  
  
  1. Open SSH Secure File Transfer Client on your computer and

     (a) click on "Quick Connect"
     (b) for "Host Name" enter www.eden.rutgers.edu
     (c) enter your Eden username
     (d) click "Connect" and enter your password.

  2. Check the Remote (right) side of the SSH window for a "public_html" folder.
  3. Create a "public_html" folder there if you don't have one already — see the GetIT SSH Tutorial for help. Note that public_html must be spelled exactly that way: lower-case letters with an underscore (no quote-marks).
  4. Check that your "public_html" folder's permissions are 755.
  5. In your "public_html" folder make a "415" folder — and set its permissions to 755.
  6. In your "415" folder make a "hw" folder (where you'll store your homework) — and set its permissions to 755.
  7. Double-check that you didn't use spaces or upper-case letters in your filenames!
  8. Check that everything worked: in a browser, enter

     http://www.eden.rutgers.edu/~your username/415

     You should see your "hw" folder listed inside your "415" folder.



More Sample Documents

• Sample document (1): NMD debate map
• Sample document (2): Another argumentation map
• Sample document (3): Tri-fold brochure



Research Review

• Make a quick online visit to RU Libraries
• If you haven't done so already, review the instructions for how to find an article
• Use the RU library indexes to find these articles:

  Yates, Joanne, and Wanda J. Orlikowski. "Genres of Organizational Communication: A Structurational Approach to Studying Communication and Media." Academy of Management Review 17.2 (1992): 299-326.
  
  Kostelnick, Carles. "Supra-Textual Design: The Visual Rhetoric of Whole Documents." Technical Communication Quarterly 5.1 (1996): 9-33.




Trifold Brochure Assignment

• Begin work on the trifold brochure assignment (we'll be designing the brochures using Adobe InDesign)
• Samples from last semester:

  Spring Break Brochures
  Architecture Styles Brochures
  Furniture Styles Brochures
  Brochure Typography
  

• Other sample brochures:

  Dash Catering at the Barker Rotunda (pdf)
  Important Information on Dining Plans (pdf)
  Neptune Project (html)
  FUNSAT
  Bayanihan Linux Thin Client Manager (html)
  Treks across Australia (html)
  Village of Homer, NY (html)

Homework

Reading

• Buy the Williams, Cohen, and Tufte books from the RU Bookstore or your prefered online book vendor.
• Read Cohen, chaps. 1 & 2
• Read Horn (pdf) — and make at least one comment on him in your Usability Notes: e.g., what could his article do better; does he tell you as a student what you wanted to know?
• Read Kostelnick, "Supra-Textual Design: The Visual Rhetoric of Whole Documents," Technical Communication Quarterly 5.1 (1996): 9-33 (find through RU Libraries)
• To get ahead, read the first half of Williams, Non-Designer's Design Book



Other work

• If you need to, download SSH for home use from RU Software (login with your NetID and search under keyword "SSH")
• Find one or more trifold brochures to bring as an example to the next class
• Make a list of six questions your audience will have that the brochure should answer; order these from the most general to the most specific; print the list and bring it to class
• Complete your initial research; review the brochure requirements; and (in a word-processing file) begin a draft of your brochure text to review in class. Save your draft in your "brochure" folder in your Eden webspace. We'll begin to work on the actual brochure layout using InDesign in the next class

top

Week Two

In class

Work due

• List of brochure questions (printed)
• Draft of brochure text (printed)
• At least one (preferably non-Rutgers) trifold brochure



Key Concepts

• We'll discuss some key concepts — category of information; the rhetorical situation of information design and documentary genre conventions, etc. — and look at some examples.
• Figure 1: Spectrum of Conventions
• Figure 2: Table of Conventions
Sample conventions (1): Memo
Sample conventions (2): Business cards
Sample conventions (3): Poem in a critical edition
Sample conventions (4): Traditional "bad" index
Sample conventions (5): Well-designed index
Sample conventions (6): Email message
Sample conventions (7): Paper money
Sample conventions (8): Comic-book splash page
Sample conventions (9): Annotated text




Sample Brochures

• Samples from last semester:

  Spring Break Brochures
  Architecture Styles Brochures
  Furniture Styles Brochures
  Brochure Typography
  

• Other sample brochures:

  Dash Catering at the Barker Rotunda (pdf)
  Important Information on Dining Plans (pdf)
  Neptune Project (html)
  FUNSAT
  Bayanihan Linux Thin Client Manager (html)
  Treks across Australia (html)
  Village of Homer, NY (html)




Class Forum

• Register for the Class Forum
• Respond to the "Introduction" thread



Developing the Brochure

• In your groups: circulate and examine the sample brochures you brought in for discussion. Make a list of about 10 conventions of the brochure genre (try to come up with spatial, textual, etc.). Exclude the obvious ones: e.g., two-sided, double-folded, three-paneled, landscaped. This shd take about 5 mins
• When you've finished: post your list to the "Brochure Conventions" thread on the Class Forum and compare your group's list with those of other groups
• Plan the common design for your group's brochure set: in particular, determine the categories of information you'll include in your brochure and determine which category of information should go in which part of the brochure (page, part of page, etc.)



In-Design Warm-Up

• First, open Adobe InDesign and, if you've failed to look over the Cohen chapters, then browse through the first two parts of this InDesign CS2 tutorial to familiarize yourself with the basic InDesign CS2 layout and tools
• Then complete this brochure layout tutorial for InDesign CS2.
• Finally, in your groups begin to draft your brochures — and arrange to email or otherwise share whatever parts you need to share

Homework

• Read Williams (Non-Designer's Design Book), 10-86, 105-108
• Complete draft of brochure; have your electronic copy saved in Eden and a printed and folded two-sided "demonstration" copy for next class
• Note: To save InDesign CS2 files in an InDesign CS compatible format: Save CS2 file "backwards" using the INX export feature (File » Export) and select InDesign Interchange as the format (the file should save with an .inx extension and not an .indd extension)

top

Week Three

In class

Work due

• Trifold brochure draft



Design Examples

• CRAP principles: Contrast, Repetition, Alignment, Proximity

Example 1
Example 2
Example 3
Example 4

• Carefully examine example 1 and list the following:

  1. Twelve (12) CRAP features
  2. Two things wrong with the design / two things you'd add or change (give brief reason why)




Brochure Work

• Critique, revise, and coordinate trifold brochures
• Work on "common design descisions" section of design script
• Sample design scripts:
  1. Trifold Brochure DS
  2. Halloween Party Manual DS
• Sample trifold brochure whose content moves :
  1. Outside/front
  2. Inside/back
  3. Brochure as Story

Homework

• Read Ann C. Tyler, "Shaping Belief: The Role of Audience in Visual Communication," Design Issues 9.1 (1992): 21-29 (PDF)
• First: Read Williams 121-173 ("Designing with Type") and

  E. R. Brumberger, "The Rhetoric of Typography: The Persona of Typeface and Text," Technical Communication 50 (2003): 206-223 (find the article on the RU Libraries website)

• For help finding the Brumberger article, review "How Do I Find an Article" or use search field on the Electronic Journal List
• Review Cohen, chaps. 3-5, on working with text and ojects
• Then revise and finish your brochure and Design Script (in memo format)
• You'll turn in a (color) printed copy of your brochure and DS memo; you'll save a (compressed) PDF version of your brochure in a "brochure" folder in your "415" folder on Eden
• Again: To save InDesign CS2 files in an InDesign CS compatible format: Save CS2 file "backwards" using the INX export feature (File » Export) and select InDesign Interchange as the format (the file should save with an .inx extension and not an .indd extension)
• Here is what Adobe says
• In preparation for the next assignment, take a look at the list of designers at the Design Museum website

top

Week Four

In class

Work due

• Trifold brochure, final draft (print out and PDF) and design script



Biographical Dictionary Assignment

• Van Neumann bio article with minimal formatting
• Van Neumann article with differentiated content
• Sample Van Neumann re-designs:

  Front pages (color)
  Front pages (black & white)
  Back Matter
  Other pages
  

• The Assignment: Designer's bio article



Sample Entries from Biographical Dictionaries

• These ones are representative of the genre; they're functional but not especially exciting, design-wise
• Ancient Greeks: Pericles, p. 1
• Ancient Greeks: Pericles, p. 2
• Ancient Greeks: Pericles, p. 3
• Ancient Greeks: Pericles, p. 4
• Ancient Greeks: Pericles, p. 5
• Spies: Sara Edmonds (source: I Lie for a Living: Greatest Spies of All Time)
• Spies: Sir Francis Walsingham (source: I Lie for a Living: Greatest Spies of All Time)




More on Conventions in Document Design

• Kostelnick and Roberts's Table of Conventions
• Examine different levels and categories of information on a single page:

  Shopping guide (New York magazine)
  Scholarly article, secondary information
  

• Consider variations within a single genre: The Contents Page

  Contents page
  Another contents page
  Contents page from magazine (Scientific American)
  Contents, flowing
  Older (19th-century) table of contents
  Less detailed contents page
  Detailed contents page (1)
  Detailed contents page (2)
  Two-column contents page (some extra design)
  Another two-column TOC
  




Work on Reference Articles

• Begin work on the second assignment: Reference Book

Homework

• Color Tutorial 1
• Color Tutorial 2
• Construct first draft of the Designer Bio design in InDesign; bring printed b & w dummy copy to class along with an electronic copy in your Eden space
• Find three examples of useful and interesting document layout that suggest ideas or starting point for your design; bring actual documents or photocopies to class

  These examples can come from reference books or from other document genres

• As I said in class, don't worry about making the full visual language matrix: rather, make a list of essential conventions for the bio/reference article

top

Week Five

In class

Work due

• First draft of bio article
• If you didn't turn in a color printed copy of your brochure and a printed copy of your DS, then do so today
• Again: Save InDesign CS2 files in an InDesign CS compatible format: Save CS2 file "backwards" using the INX export feature (File » Export) and select InDesign Interchange as the format
• Here is what Adobe says



Review of Brochures

• Comparison of two brochures from same group
• Reading test of a sample brochure
• Fun with Beer
• More Fun with Beer



Designing with the Modular Grid

• Notes about modular grids (from Princeton Architectural Press): Here
• Sample Page: table of contents; promotional poster
• Five Simple Steps to Designing Grid Systems



Work on Designer Bio Articles

• Share and discuss your design examples
• Then continue working on the assignment

Homework

Reading

• Josef Muller-Brockmann, Grid Systems in Graphic Design, rev. 4th ed. (Arthur Niggli 1996), pp 10-13 and 133-156 (PDF)
• And while you're at it: review these helpful comments on Typography

Design Assignments

• Complete bio article FD and design script (printed copies plus e-copies on Eden
• Find 2 examples of clear and/or complex grids used to establish a hierarchy within a design. Look at newspapers, magazines, books, signs, posters, web pages, etc. Scan, photograph, or (if websites) link to them. If you scan or photograph them, store copies on Eden. Then in the "Grids" thread on the Class Forum, link to your examples and for each briefly state why you feel that these examples illustrate clear and/or complex hierarchies.
  top

Week Six

In class

Work due

• Designer's Bio Article and Design Script; printed copies for me, PDF of article and Word doc of DS in a "biobook" folder on your Eden space
• Post link to your "biobook" folder in the "Designer's Bio" thread on the Class Forum
• Respond to the "Grids" thread assignment on the Class Forum

  Posters

• Review Poster Assignment
• Sample posters

Homework

Reading

• Tufte, "Words, Images, Numbers — Together" (Beautiful Evidence, p. 82)

Design Assignments

• Research Type Specimen; put together information for short presentation next week
• We'll begin drafting the poster in class, but you can start before then, if you like

top

Week Seven

In class

Work due

• Research for Type History Poster: You'll need to give a short presentation of your findings
• Class Forum



Show & Tell

• Campaign 2004 (Paul Scher)
• Statistics (more Scher)
• More Scher, again
• Alphabets



Bio Article Review/Critique

• Let's take a look at your posted work on the Forum
• If necessary, fix/complete your "biobook" folders
• Then we'll concentrate on two aspects of these projects: (1) how they reflect or fail to reflect their subjects; and (2) the readability of their information (e.g., is the information well-differentiated? is it clearly presented?)
• Our source texts:
  • Alvar Aalto
  • Frank Lloyd Wright
  • Archigram
  • Manolo Blahnik
  • Penguin Books
  • Jaguar
• Some things to keep in mind:
  1. Titles within the text
  2. Padding
  3. Page number position
  4. Vertical spacing
  5. Images: Don't use low-quality small images, such as those accompanying the articles online



Type History Posters

• Make a list of five specific visual features, properties, or associations of your selected type and post to the Type Features thread
• Draft Type Poster
• Set up your initial, base design using, and abusing, a modular grid (see Cohen 32-33); try different combinations (4 x 4, 8 x 6)
• Grid-system based poster:
• When setting up you page consider margins and bleed for the poster format
• Here again: sample posters
• Note: Try to highlight at least six of the following anatomical features in your poster:
  • baseline
  • x-height
  • cap height
  • stem
  • bowl
  • serif
  • ascender
  • descender
  • ligature
  • finial
  • terminal
  • spine
  • cross bar
  • counter
• Also consider different styles (roman, bold, ilatic, oblique, black, condensed, expanded, small caps)

Homework

Reading

• Tufte, "Mapped Pictures" (Beautiful Evidence 12); "Links and Causal Arrows" (Beautiful Evidence 64)
• Note: These Tufte chapters will be especially useful for the next, the "movie monster" assignment



Design Assignments

Updated March 8

• Complete a first draft of your Type History Poster; there will be a critique/discussion of these in the first part of the week 8 class
• You'll then have some time to revize them in class; the final draft and DS will be due at the start of the week 9 class (Mar. 26)
• The Design Script should draw on (and quote from) Tufte and Muller-Brockmann (at least 3 times from each) as well as other readings
• In the second part of the week 8 class, after break, you'll begin work on the film monster assignment (researching, image collection, group disucssion and planning)
• You should also think about possible topics for your final project; you'll need to submit at least two topic ideas for this project

top

Week Eight

In class

Work due

• Complete first draft of Type History Poster, for in class critique and revision
• At least one idea for final design project
• Bring Tufte book to class



Class work

• Critique and discussion of first-draft posters
• Poster revision
• Discussion of Tufte readings
• Begin researching and planning "film monsters" project



Sample Documentws

• Tiger document
• How to Kill a Vampire (poster)
• Selections from Eyewitness Art: Composition (pdf)

Mapped Pictures

• Anatomy of a Carp

Picture Maps

• NSA Surveillance Octopus

Links and Causal Arrows

• SARS spread

Homework

Reading

• Judy Delin, John A. Bateman, and Patrick Allen, "A Model of Genre in Document Layout," Information Design Journal 11 (2003): 54–66. Esp. the section on the tiger document
• In preparation for your presentations: Tufte on the evils of PowerPoint



Design Assignments

• Complete final draft of Type History Poster and Design Script
• Complete research for Film Monsters project (and prepare to present your main findings via PowerPoint!!!)

top

Week Nine

In class

Work due

• Final draft of Type History Poster and Design Script
• Reply with a link to your poster PDF and DS in the Type Posters thread on the Class Forum
• Research for Film Monsters project



Monsters Project

• Short PowerPoint presentations of visual and textual information from your research
• Work on first draft of Monsters Project



The Weeks Ahead

• Week 10 Monday, Apr. 2: First draft of Monsters; in-class critique
• Week 11 Monday, Apr. 9: Begin working on final project; revised draft and DS for Monsters is due
• Week 12 Monday, Apr. 16: Work on drafting, researching Final Project
• Week 13 Monday, Apr. 23: Draft one of FP due; critiques
• Week 14 Monday, Apr. 30: Draft two of FP due; critiques

Homework

• First draft of Monsters project

top

Week Ten

In class

Review of Type History Posters

• Readability: Cooper Black (currently MIA)
• Focus: Cooper Black (and red); Helvetica
• To use or not to use images: Gill Sans; Gill Sans (2)
• Typography: Univers



Final Project

• Next week we beign work in class on your final projects; everything until now has been a prepartion for them
• Today, while you work at revizing your Monster projects, you should speak to me about your final project ideas
• Take a look at the generic 415 Final Project Assignment
• Your final project should consist of 3-5 different but related documents (these can be different sub-documents within a single document like a booklet; e.g., a critical edition of a poem or a manual for device)
• To prepare for your project, you'll want to look at other examples of the kind(s) of document you plan to produce.
• You'll need to consider the following questions:
  1. Why wasn't your audience being served (or well-served) before?
  2. What is your most important design/usability challenge?
  3. How is your analysis of related documentation affecting your design process?



Monster Project

• Review Monster Project first drafts
• Revise drafts

Homework

• Final draft and DS for Monsters project is postponed by one week; have your complete draft ready for in-class review in the first hour of next week
• Have two to three ideas for the final project; we'll be researching and planning this in the second half of next week's class

top

Week Eleven

In class

• Review of Monster project drafts
• Discussion of Final Project ideas
• Begin to research, plan, and design Final Projects

Homework

• Monsters DS; should be at least 600-800 words, in memo format, citing Tufte at least four times; also citing other readings in support of your planning
• DS paragraphs should not indent; instead, skip a line between each single-spaced paragraph
• Find an example of a document that means to address the needs of your intended audience; make a list of problems with this document
• 200-word progress report for final project: what are you trying to do? what information have you found so far? what information do you still need to find?

top

Week Twelve

In class

Work Due

• Monster Project and DS

Today's Examples

• Graphs: Aharef: Websites as graphs
• Instructions: Google TiSP
• Explanatory narrative with arrows: The Governor's Crash (source: NY Times)

Final Project

• Work on Final Project designs
• Some questions to keep in mind:
  1. Who is your specific audience?
  2. What do they need to know?
  3. What do they already know?
  4. What documents might they already have access to that supply some or all of the information they need?
  5. What are the strengths and flaws of these documents?
  6. Where will they encounter or acquire your document(s)?
  7. Why wasn't your audience being served (or served well) before?
  8. What is your most important design/usability challenge?

Homework

• Work on Final Project: electronic first draft due next week (at least one complete document)
• Find and bring to class at least two previous documents related to your project

top

Week Thirteen

In class

Work Due

• Rough draft of at least one final project document

Today's Examples

• Graphs: Aharef: Websites as graphs
• Instructions: Google TiSP
• Explanatory narrative with arrows: The Governor's Crash (source: NY Times)
• Teen Slashers

Final Project

• Work on Final Project designs
• Some questions to keep in mind:
  1. Who is your specific audience?
  2. What do they need to know?
  3. What do they already know?
  4. What documents might they already have access to that supply some or all of the information they need?
  5. What are the strengths and flaws of these documents?
  6. Where will they encounter or acquire your document(s)?
  7. Why wasn't your audience being served (or served well) before?
  8. What is your most important design/usability challenge?

Homework

• Work on Final Project: electronic first draft due next week
• Find and bring to class at least two previous documents related to your project

top

Week Fourteen

In class

Work Due

• Drafts of final project parts



Final Project

• Work on Final Project
• Discuss progress with instructor



By 9 pm, Thursday, May 3

• Save your final projects and DS in a "final" folder in your "415" folder on Eden
• Then: Post a link to these electronic versions of your final project documents in a reply to the "Final Project" thread on the Class Forum



On or before Friday, May 4

• Leave printed copies of your documents and design script in my mailbox in the Murray Hall mail room

top

Final Office Hour

top