Contact me:

me@smithaprasadh.com.

Download my resume: design / research

Smitha Prasadh

Interaction + Inclusion + Interculturalism

Visualizing information spaces: DesignObserver.com

What this is about

This was a grad school project that I'm still fond of. We were tasked with visualizing the information space of an artifact (website, book, movie, etc.). I was assigned the active and very prominent design website DesignObserver.com.

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. There's a fourth area, Observer Media that includes content pertaining to the other three areas (which is why I used a dotted, not solid, line separating it from the other three). The articles in 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. I drew them all manually. (It was cathartic, honestly.)

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).

There are many things about this project that I would do differently today. Ask me sometime!

Want more details? Check out the Process Book.

A close-up of the poster details, showing a cluster of chartreuse dots and hundreds of lines pointing to them from columns of keywords on the left and right.

Close-up of dense lines and dots. (Did I mention I drew all these manually?)

A close-up of the poster details, showing peach bubbles with notes in pink text that call out usability issues with the site.

How I noted usability issues with the site throughout my project.

The final poster

The final poster.