Visualizing Information Spaces: Design Observer

Visualizing Information Spaces: Design Observer

tags: print, information design

Date: Fall 2009
Course: Graduate Studio I, Carnegie Mellon
Process: Process Book

We were tasked with visualizing the information space of a preassigned artifact (website, book, movie, etc.). I was assigned the active and very prominent design website

Even during the preliminary sketching process, as I attempted to draw the sitemap and the density of information across the site, I ran into major issues with the site's usability that impeded me from navigating the space properly, and then realized that it was important to convey those issues as part of my discussion of the site's information space.

The site consists of three major content areas—Observatory, Change Observer, and Places—with a fourth area, Observer Media, including content pertaining to the other three areas (hence the horizontal dotted (not solid) line separating it from the other three). The articles in each of the three main sections are categorized both by Topics (a.k.a. keywords) and Departments (a.k.a. categories). I opted to use clusters of dots with lines, as it was an immediately obvious way to discern the density of information across the site.

At the time of designing, there were roughly 800 articles on the site, and well over 1000 lines, which I did draw manually.

The overall layout is meant to hint subtly at the structure of a website, with the header, main site navigation, content, and a "footer" (where I included a personal note about a personal experience I had with seeing the site's creators give a talk, and how that related to this project).

Visualizing Information Spaces: zoomed view Visualizing Information Spaces: zoomed view
want to move to another piece?
AutoCAD Utility Design
Autodesk InfraWorks
Information Design: Designing Information Spaces
Information Design: Self-Portrait
Presentation: Intercultural Design
Presentation: What is UX?
Shirt Design: CMU's All University Orchestra
Master's Thesis: Designing for Reverse Culture Shock
Video: A Meditation on Reverse Culture Shock