Calendar

  1. Welcome and Introductions January 13

    In Class

    1. Review course policies, schedule, and projects
    2. Introduce Project 1
    3. Data, Information, Knowledge, Wisdom

    For Next Class

    To Read
    1. Tufte, Envisioning Information (EI): Introduction; Escaping Flatland; Micro/Macro Readings
    2. Kinross, “The Rhetoric of Neutrality”
    3. Kraus, We’re creating a culture of distraction (15 minute video)
    To Do
    1. Email Karl from your preferred email account
    2. Bring to class a photo or screenshot of an information display that you use daily

    Martin Luther King Day (No Class) January 20

  2. Complex Information in Limited Dimensions January 27

    In Class

    1. Reading discussion
    2. Lab setup

    For Next Class

    To Read
    1. Tufte, EI: Layering and Separation; Small Multiples; Color and Information
    To Do
    1. Bring draft sketches/mockups of Project 1 images for workshopping on 2/3

  3. Elements of Visual Information Design February 3

    In Class

    1. Reading discussion
    2. Workshop time for Project 1

    For Next Class

    To Read
    1. Tufte, EI: Narratives of Space and Time; Epilogue
    2. Selections from Universal Principles of Design
    3. Selections from Wood, Everything Sings
    To Do
    1. Complete draft of Project 1, including progress narrative

  4. Space, Time, and Mapping February 10

    In Class

    1. Brief reading discussion: small-group; Tufte taxonomies
    2. Workshop time for Project 1

    For Next Class

    To Do
    1. Complete Project 1, including project presentation

  5. No Class - Weather Cancellation February 17

    For Next Class

    To Read
    1. Morville & Rosenfeld, Information Architecture for the WWW: Part I: Introducing Information Architecture

  6. Information Architecture I February 24

    In Class

    1. Project 1 presentations
    2. Introduce Project 2
    3. Reading discussion

    For Next Class

    To Read
    1. Morville & Rosenfeld, Part II: Basic Principles of Information Architecture
    2. COM541 students also read Morville & Rosenfeld, Part IV
    To Do
    1. Email Project 2 proposal memo to instructor by 9am, Monday March 3

  7. XML & JSON; Information Architecture II March 3

    In Class

    1. Reading discussion
    2. Playing catch-up on semantic structure in XML
    3. Lightweight structure with JSON

    For Next Class

    To Read
    1. Morville & Rosenfeld, Part III: Process and Methodology
    2. COM541 students also read Morville & Rosenfeld, Part V
    3. IBM developerWorks, XML basics for new users
    4. json.org, Introducing JSON and JSON: The Fat-Free Alternative to XML
    To Do
    1. ...

  8. More XML & JSON + Git/GitHub March 10

    In Class

    1. Set up Oh-my-zsh and Git/GitHub
    2. Walking through JSON/XML, Project 2 (view in-class examples)
    3. Reading discussion

    For Next Class

    To Do
    1. Work on Project 2

    No Class March 17

  9. Work Week March 24

    In Class

    1. Introduce Project 3

    For Next Class

    To Read
    1. Few, Information Dashboard Design
    To Do
    1. Finish Project 2, including final presentation

  10. Project 2 Due March 31

    In Class

    1. Project presentations
    2. Reading discussion (if time)

    For Next Class

    To Read
    1. Few, Information Dashboard Design: Introduction; Chapters 1, 2, & 3
    To Do
    1. ...

  11. Dashboard Design: Mistakes and Considerations April 7

    In Class

    1. Last call for Project 2 presentations
    2. Project 3 Q&A
    3. Reading discussion

    For Next Class

    To Read
    1. Few, Information Dashboard Design: Chapters 4, 5, & 6
    To Do
    1. ...

  12. Dashboard Design: Perception and Simplicity April 14

    In Class

    1. Reading discussion

    For Next Class

    To Read
    1. Few, Information Dashboard Design, Chapters 7 & 8, 11-13
    To Do
    1. ...

  13. Dashboard Design: Graphical Elements and Media; Work Week April 21

    In Class

    1. Reading discussion
    2. Project 3 work time

    For Next Class

    To Do
    1. ...

  14. Project 3 Presentations April 28

    In Class

    1. Project 3 Presentations

    Final Projects Due May 7 by 5pm CDT

Projects

Project 3: Interactive Design of Information Due May 7

This project gives you the opportunity to prototype an interactive, dashboard-like information display for small-screen devices. You will take the structure of your data from Project 2 and build a prototype high-density/high-resolution interactive display (versus the static display from Project 1).

The focus of the project is on interaction with data, on mobile devices. And because interaction on those devices requires the use of fingertips, you’ll need to think about the affordances of tapping, dragging, swiping, pinching, and so on--as well as how to represent that interactivity in a prototype. And of course, all interactivity should be in service to your users and their ability to best interact with the data that you are providing them.

Deliverables & Milestones

  1. A proposal memo (about a paragraph or two) emailed to the instructor by 9am on Monday, March 31
  2. A first draft of your prototype, submitted to the instructor as a Dropbox link by the end of class on April 14
  3. A final draft of your prototype, submitted to the instructor as a Dropbox link by 5pm on May 7
  4. An HTML or PDF document that shows your in-progress work and briefly discusses your design process and thinking over the course of the project
  5. A self-critique memo that evaluates your project and your progress in the class to this point (2-3 paragraphs; submit via email with Dropbox share link)
  6. A brief (5-8 minutes) presentation of your work on April 28
  7. A link to all deliverables in a Dropbox folder; link mailed to instructor by 5pm on May 7

Requirements

Your prototype must:
  • Display a browseable list of records
  • Provide a means (search, geolocation data, something else) to narrow down the list of records
  • Offer an interactive view of an individual record, with the ability to somehow manipulate the record’s elements: drilling further into the data, for example, or pulling up associated records
  • Be presented in some digital format (a series of images; an HTML/CSS prototype; or even a series of slides)

Project 4 (COM541 Only): Information Architecture & Interaction Due May 7

For this project, you will augment your Project 3 with some research into information architecture as it relates to interaction design. This could be investigation into a particular theory (such as activity theory or actor-network theory) or into a specific interaction-design technique: in either case, you will provide a one-page writeup of the theory or technique that you investigate, and how it informed your work in Project 3. You will also provide a bibliography of 10-15 sources (a combination of electronic and library) on the theory or technique. You will prepare your writeup in Markdown as a GitHub Gist.

Deliverables & Milestones

  1. A URL to your GitHub gist, emailed to the instructor by 5pm, May 7

Project 1: Visual Design of Information Due February 17

Project 1 asks you to take some set of data and build from it a static information display that both aids in your audience’s understanding of the information and makes a particular visual argument for how the audience should act based on their understanding. Your design should strive for a high degree of information density: like the examples throughout Tufte’s Envisioning Information, a high-density information display does not necessarily derive from extraordinarily dense data. Instead, density emerges from juxtaposition of one simple set of data with another; from small multiples of simple data spread out over time/space; or in combining two strategies for information display into one (a photo-realistic map of terrain with an otherwise simplified map of train lines).

You will submit two versions of your final design, both as PNG images: one for large-screen display (e.g., flat-screen televisions) and one for smaller, tablet-sized screen display. Paradoxically, the smaller display will likely have a higher level of detail than the large-screen display, given the distance at which someone would view the design. But the more important deliverable is a document that showcases the development of your idea: the emphasis on this assignment is the attempt you make at creating a dense information display, not just the final deliverables.

Your designs should not be some lame, boring Excel-produced pie charts. They should tell a story and make an argument, and be compelling enough that someone might want a poster of the design to hang on the wall (even if your designs aren’t quite wall-ready by the end of the project). They should make the audience you’re reaching stop and look more closely, at both the micro and macro levels of the design, much like in Tufte’s rich collection of examples.

Deliverables & Milestones

  1. A shared Dropbox link to all deliverables
  2. An HTML or PDF document that shows your in-progress work and briefly discusses your design process and thinking over the course of the project
  3. Two standalone PNG image files: one of your design for a large-screen viewed at a distance (think: television set) and one of your design for a small-screen viewed at arm’s length
  4. A self-critique memo that evaluates your project and your progress in the class to this point (2-3 paragraphs; submit via email with Dropbox share link)
  5. A brief (5-8 minutes) presentation of your work on February 17

Requirements

Your dataset must:
  • Be openly/freely available from some governmental, educational, or private source
  • Include either a spatial or temporal dimension
Your visual designs must:
  • Be versioned across the life of your project to showcase the progress of your thinking and design work (HTML or PDF deliverable)
  • Be prepared specifically for both a large- and small-screen display (one image for each; PNG deliverables); DO NOT just resize your image
  • Be saved as a PNG or other web-friendly, mildly compressed format; bonus points for tackling your design as SVG

Project 2: Structural Design of Information Due March 31

In stark contrast to the first project, which emphasizes visual display of information, Project 2 looks at the structural/semantic design of information that can be easily retrieved and shared across different devices and platforms. Working from a data set similar to that of your first project, you will create a structural information design either as a series of XML or JSON files, or as a relational database (e.g., MySQL).

A central concern of this project will be granularity: you will need a structural representation of the list of all of the records that make up your dataset (at least one XML or JSON file) and a structural representation of each record itself (one XML/JSON file per record, most likely).

You will also need to come up with some sort of metadata scheme to categorize and/or tag the records that make up your set. This may come in the form of XML attributes, special XML tags, or specific JSON properties and language features (especially arrays).

Deliverables & Milestones

  1. A proposal memo (about a paragraph or two) emailed to the instructor by 9am on Monday, March 3
  2. A shared Dropbox link to all deliverables
  3. An HTML or PDF document that shows your in-progress work and briefly discusses your design process and thinking over the course of the project
  4. A series of XML or JSON files (if you wish to do a relational database, we will need to discuss how to submit that work): one file providing a listing of all records that is then somehow keyed (e.g., through a unique identifier) to the individual records (one record per file, unless another schema presents itself that makes better sense for your particular dataset)
  5. A self-critique memo that evaluates your project and your progress in the class to this point (2-3 paragraphs; submit via email with Dropbox share link)
  6. A brief (5-8 minutes) presentation of your work on March 31

Requirements

Your dataset must:
  • Be openly/freely available from some governmental, educational, or private source; it can also be a dataset of your own creation
  • Be chosen/created with regard to the next project, which involves an interactive information display (hint: think about the importance of density from Project 1)
Your structural XML or JSON designs must:
  • Be versioned across the life of your project to showcase the progress of your thinking and design work (HTML or PDF deliverable; extra credit for using Git/GitHub)
  • Use UTF-8 encoded text files as their foundations (*not* word-processor documents)
  • Be both valid (technically correct for parsing) and structurally semantic (using XML tags or JSON property names that describe the structure and content of your data)
  • Be named as well as structured for both machine- and human-friendly readability

Instructor

Prof. Karl Stolley

  • karl.stolley@gmail.com
  • karlstolley on Twitter, App.net, & Kik.
  • Office in Siegel Hall 218
  • Office hours on Mondays, 4pm to 5pm & by appointment

Policies

Course Description

COM541: Information Structure and Retrieval/HUM380: Dense Information, Distracted Humans looks at the use of information to help people gain insight and make decisions in the context of information overload. Drawing on theories from rhetoric, information architecture, and a range of other humanities disciplines (from history and philosophy to ethics), this course provides students with an applied-theoretical foundation in creating visual, structural, and interactive representations of information for retrieval across a range of electronic devices, particularly mobile technologies.

  1. Course Goals

    • Design interfaces and other digital objects for usability and user experience for specific communication situations, using theoretically grounded methods of user-research design and evaluation.
    • Design context-senstitive, audience-/user-focused content in digital form
    • Understand and apply theories of communication, information design, and knowledge dissemination from a range of humanities disciplines
    • Develop sophisticated, user-centered systems for storing, retrieving, and manipulating data and information
    • Apply course concepts and adjust/extend course projects to fit your own academic and professional interests

  2. Materials and Technologies

    Required Texts

    • Few, Stephen. 2013. Information Dashboard Design: Displaying Data for At-a-Glance Monitoring, 2nd ed. Burlingame, CA: Analytics Press.
    • Morville, Peter and Louis Rosenfeld. 2006. Information Architecture for the World Wide Web, 3rd ed. Sebastopol, CA: O’Reilly Media.
    • Tufte, Edward R. 1990. Envisioning Information. Chesire, CT: Graphics Press
    • Plus other electronic books, articles, and materials linked to from the course calendar

    Required Technologies

    • A sketchbook

    Recommended Technologies

    • A smartphone or tablet device
    • A Twitter account

  3. Grading Policy: HUM380 Students

    • Project 1: 10pts
    • Project 2: 30pts
    • Project 3: 20pts
    • Class Participation: 40pts
    • TOTAL: 100pts

    A = 90+ pts; B = 80-89pts; C = 70-79pts; D = 60-69pts; E =< 59 pts

    Grading Criteria

    • A - Student has turned in all required components of a project, the work is exceptional in quality, and reflects the student’s dedication to adjusting the project to his or her own interests.
    • B - Student has turned in all required components of a project, and the work is exceptional for undergraduate work.
    • C - Student has turned in all required components of a project and submitted work that is acceptable as undergraduate level.
    • D - Student has turned in all required components of a project, but the work is below undergraduate level.
    • E - Student has not turned in all required components of a project.

  4. Grading Policy: COM541 Students

    • Project 1: 10pts
    • Project 2: 30pts
    • Project 3: 20pts
    • Project 4: 10pts
    • Class Participation: 30pts
    • TOTAL: 100pts

    A = 90+ pts; B= 80-89pts; C=70-79pts; E =< 69 pts

    Grading Criteria

    • A - Student has turned in all required components of a project, the work is exceptional in quality, and reflects the student's dedication to adjusting the project to his or her own interests.
    • B - Student has turned in all required components of a project and submitted work that is acceptable as graduate level.
    • C - Student has turned in all required components of a project, but the work is below graduate level.
    • E - Student has not turned in all required components of a project.

  5. Course Technology Policy

    Because technology is an essential part digital communication and information design, it is essential to this class. You are just as responsible for learning to command various technologies (particularly an image-editing program of your choice) as for any other course content. Difficulty with technology is not an acceptable excuse for being unprepared for class.

    If you are having trouble with technology or any other material covered in this course, it is your professional responsibility to do research beyond the resources and guidance provided in class and find materials that work for you. I also encourage all students to meet with me during my office hours or at another arranged time outside of class or to contact me via email or GChat, or our Campfire room, well in advance of project deadlines.

    Note that coming to class with broken or malfunctioning work is far better than showing up with nothing but an excuse like “I just didn’t get it.” For most of the semester, it is expected that you’ll show up with broken work. When you’re learning, effort is more important than perfection. Just be sure to put in the effort early, and not the night before a project is due.

  6. Attendance and Participation

    Your attendance and active participation are required both for your own success in the class, and for the success of the class as a whole. However, if you absolutely must miss, please contact me ahead of time via email.

  7. Academic Honesty

    As with any course at IIT, you are expected to uphold the Code of Academic Honesty as described in the IIT Student Handbook). All work for this course must be your own original effort, including print and digital page design and computer code. Summarizations and quotations of text, as well as any use of open-source code libraries and images not of your own making, should be clearly cited as legally and ethically warranted and rhetorically appropriate. Access, storage, dissemination, and other use of data from third-party sources must conform to the source’s terms of service, licensing, and other relevant legal and ethical restrictions.

    If you are at all uncertain as to whether you are submitting work that in whole or in part may violate the Code of Academic Honesty, please contact me immediately and before the work is due. The consequences of academic dishonesty are severe. Any student who violates the Code of Academic Honesty will be subject to expulsion from this course with a failing grade, and I will report the student to the Chair of the Department of Humanities, who may take additional disciplinary action, including reporting violations to the relevant offices of Undergraduate or Graduate Academic Affairs.

  8. Special Needs Statement

    Reasonable accommodations will be made for students with documented disabilities. In order to receive accommodations, students must obtain a letter of accommodation from the Center for Disability Resources. The Center for Disability Resources (CDR) is located in IIT Tower, 3424 S. State Street - 1C3-2. Contact the Center by telephone at 312-567-5744 or via email at disabilities@iit.edu

    Students who have any difficulty (either permanent or temporary) that might affect their ability to perform in class should contact me privately, either in person or via email, at the start of the semester or as a documented difficulty arises. Methods, materials, or deadlines will be adapted as necessary to ensure equitable participation for all students.