Interactive Information Design and Social Media

I have a bit of a fetish for awesome information design and it gets nearly compulsive when it becomes a reacting entity on the world wide web. The idea that massive amounts of information, many times being ever-changing and dynamic can be molded into a visual form, manipulated, and sifted through is all sorts of awesome to me. I will admit, I am the type of person who flips through a Magazine (backwards) to look at all the pictures first before deciding what I want to read in it. Maybe its my ADD that makes bare-bones text not interesting enough to hold my attention, or perhaps its just my love of pretty pictures, but I foresee a future where information on the web is presented in more interesting interactive methods more often. With the user interacting and producing data through social media, creative interactive visualizations of the data produced brings a whole new fresh engagement to the experience.

madefrom japan

Visual ThesaurusName

Obviously this concept is not that revolutionary, there are many places on the web that showcase stellar interactive information design. Technology such as flash and Java have made it possible to illustrate and animate static concepts. Popular examples of these are interactive timelines, maps, and experiences.

Explore Monticello

British History Timeline

Battle of Gettysburg

Now lets take this concept a step further. Rather than illustrating stagnant information lets visualize dynamic content. Instead of actual events or places the user can now see broader concepts such as emotions or relationships. A major attraction to social media is discovery, the process of finding that 6 degrees of separation between them and someone they met at a conference or party. Interactive information design illustrating that connection introduces the user to tangible representation of what that relationship is.
Check out some examples!

We Feel Fine

We Feel Inspired!

We feel fine was built by Jonathan Harris and Sepandar Kamvar as an experiment. The system…

searches the world’s newly posted blog entries for occurrences of the phrases “I feel” and “I am feeling”. When it finds such a phrase, it records the full sentence, up to the period, and identifies the “feeling” expressed in that sentence (e.g. sad, happy, depressed, etc.). …

The interface to this data is a self-organizing particle system, where each particle represents a single feeling posted by a single individual. The particles’ properties – color, size, shape, opacity – indicate the nature of the feeling inside, and any particle can be clicked to reveal the full sentence or photograph it contains. The particles careen wildly around the screen until asked to self-organize along any number of axes, expressing various pictures of human emotion.

Digg Arc

Digg Arc

Arc was developed as a collaboration between Digg and Stamen Design (who are Bad-ASS) to display stories, topics, and containers wrapped around a sphere. Arcs trail users as they digg stories across topics. Stories with more diggs make thicker arcs.

Twitter Blocks

Twitter Blocks

According to this site Twitter blocks was designed

to allow users to navigate Twitter neighborhoods (or “blocks”) in an abstract way. A public timeline is represented by an orange sequence of blocks, which offsprings a set of block series that depict the statuses of users & the people they follow. The visualization is designed to allow existing twitter users to discover other existing twitter users.

While many of these applications serve as entertaining ways to wade through tons of information there is rarely a deeper motivation or end goal than to just find more interesting information. I am hoping to see this type of interactive information design utilized to not only enhance the enjoyment of surfing through social media but elevate the effectiveness of the experience.

A great example of a site that is using visualization to enhance their search function is


Not only does this method help shoppers but it helps buyers to connect with others in the network who are interested in their products. Etsy is a marketplace for “all things handmade” where you can find a seller who creates products with a specific style, and then see their connections to locate other products. These visual functions help the user manage a concept that is vague to verbalize and subjective… “style”. You can also search through a geo-locator and sort by color. These search methods contribute to the experience of shopping, making Etsy as much a social network as a marketplace. In some circumstances I even feel addicted to using these visualizers, like a video game… gradually becoming more effective at navigating through the merchandise to be rewarded with the perfect product.

Social media can be visually interesting and innovative. If designed with the user’s end-goal in mind creative ways of surfacing content can enhance the overall experience of the web.

[tags]interactive information design, twitter blocks, digg labs, digg arc, etsy,, interactive social media, user experience , Web 2.0 Design, Web 2.0, visual thesaurus, Stamen Design[/tags]


  1. — September 20, 2007

  2. — September 22, 2007

  3. — September 27, 2007

  4. — September 28, 2007