« Marine Dock Parking Meter | all projects

Digital Book Browsing

For this project, each student was given an artifact that contained complex information such as a book, website, audio of a lecture, CD-ROM, board game, physical space, etc. I was given a magazine, the December 1999 issue of Wired Magazine. My solution is an interactive method for browsing the contents of an item—in this case a magazine. My approach remained as dedicated as possible to the physical affordances of a magazine.

Carnegie Mellon University
Graduate Design Studio I
October 2002

[— inspiration —]

[— demo —]

This visualization shows a series of thin colored stripes, each representing a page-spread in a text document. Below the page associations are colored blocks representing the table-of-contents, each grouping covering a set of pages. Hovering the cursor over the pages displays those page-spreads for quick scanning. Hovering the cursor over the tabel-of-contents displays the title for that section. Additionally, each page-spread is labeled with its section title from the table-of-contents, and in future version there would be a method for dogearing pages (currently shown with the white triangle.


The objective of this project was to visualize an information space using the digital medium.


In my initial thinking I considered several different options that were unique to my artifact. Simply visualizing a magazine wasn't enough, there was something special about that particular magazine. My first approach was to focus on the balance of content versus advertising—this particular issue of Wired was very heavy on advertisements at this point in time.

In the end, my strategy was to avoid just visualizing content. I wanted to retain the core attributes of the the original artifact as much as possible. Then I considered representing the artifact as a relic of a specific time period by telling a story of the dotcom/tech industry in the Bay Area (Silicon Valley & Multimedia Gulch) in 1999. To do this I considered sorting through businesses with advertisements in the issue that are still in business and those that are no longer in business. I would then cluster businesses by reason of failure and success.

In the end, I decided to visualize the physical affordances of a magazine becuase the solution would be broader sweeping and have many other applications. Some of the physical characteristics I considered were: 1) Bending and folding—this allows you to see the side edges of the magazine with all of the strips of colored pages; 2) Thumb through the pages for high-level scanning—one of the most common methods of browsing a magazine is to thumb through it, only partially seeing the pages, which still provides powerful visual clues to pages the reader may remember seeing in the past or grabbing the readers attention of pages they may not have seen; 3) Dog-ear pages—Folding over the edge of a page is a quick way to mark interesting information for later referral.