profile image twittering: love that sktich now shows dimensions when you're using the select tool!
Tuesday, June 27, 2006

One of the reasons I love designing for the web is the constantly shifting landscape, both in terms of audience and tools.  With each technological shift in the brief history of the Internet, designers have evolved and created new systems for people to navigate online spaces.  In the last few weeks, there’s been a good synergy between what I’m working on and what I’m seeing online.  I’ve noticed several sites that are using visualization methods to entice visitors to explore and navigate content. 

These visualizations methods aren’t entirely new, but in the context of the ever-expanding, often vast amounts of content generated by social sites, they’re critical to our experience and our ability to discover new information and patterns.  Social sites can include everything from bookmarking applications, news, blogs, wikis, music sharing, knowledge applications, mobile, photo and video media sites, forums, social networks - anywhere the public or a member can contribute to either the content or conversation. 

Each of these types of sites and communities generate their own particular flavor of data, but there are similarities in how we can explore the fluid and hybrid space of social data.  As designers, we’re constantly seeking new ways to present this information in compelling and suitable ways. 

Database-driven sites introduced the freedom for designers to provide visitors with dynamic navigation - sorting and switching between different views, whether that’s showing a range of data (show 25 results) or a set of criteria (all restaurants within a five mile radius).  While news sites and portals were already showing us recency and time-based posts, blogs made the element of time even more important with daily posts, monthly archives, permalinks.  Blogs took the social aspect of forums to a whole new level by fueling conversations online through comments and trackbacks, and they gave the web a personal voice.

Now in this era of social software and user participation, time, conversations, and people have become even more critical to the experience. 

We expect that a popular blog post will only stay on del.icio.us popular page for a mere 24 hours due to algorithms to deal with new volume.  We know that the “digg effect” can cripple servers and drive mass amounts of traffic to your site in a fraction of time.  My partner, Max, recently had a post on Digg’s home page and received 16,000 uniques in 20 hours.  At the Digg version 3 launch party, founder Kevin Rose quoted that Digg gets 8.5 million unique visitors a month.

We’re not only creating content but also sharing our data - what we’re bookmarking, our upcoming events, news we’re reading, stories we recommend, ratings and reviews, photos and videos, our music playlists - the list goes on.  We’re not only sharing, we’re also surveilling and discovering through our friends and other users on the various sites we belong to.

Rather than pure content and information, today’s new sites are increasingly complex and integrated paths of “data” - 1. the content that is contributed to a site and 2. the paths and actions that people take and 3. the relationships that form between content and people.  So, how do we enable discovery in this environment?  By expanding our use of visualization methods to present content and activity.  Below are four examples of this type of discovery.

Digg Incoming
At the Digg version 3 launch party last week, Kevin Rose showed off Digg Incoming, a new feature that will launch in July.  Digg Incoming shows the popularity and activity of stories being dugg in real time by members of the site.  A slider allows you to narrow or broaden your time period for viewing. Hovering over stories show titles and clicking on one pops up the story headline and stat view.  One of the other views shows comments and activity clustering around a post as users traverse from one story to another.  This is one of the most exciting visualizations I’ve seen.  Given the sheer volume of stories and activity on Digg, it’s becoming impossible to find new, noteworthy stories or to see what was popular at any given time unless it was on the home page.  This certainly gives me a method to explore and discovery the stories I’m interested in based on live activity. 

What I’d really like a Digg Incoming to tract my own online habits, as both record and navigation/discovery from my own patterns :)

For now, you can see my partner, Max Kiesler’s DesignDemo of Digg Incoming for a view of the interaction which he edited out of the Diggnation podcast.  Incidentally, Digg worked with stamen design, the guys behind Mappr who I interviewed for eHub last year.

image

image

Newsmap
Newsmap is a project by Marcos Weskamp and Dan Albritton and won a Prix Ars Electronica Net Vision Award of Distinction in 2004.  The application visually reflects changes of the Google News aggregator.  “A treemap visualization algorithm helps display the enormous amount of information gathered by the aggregator. Treemaps are traditionally space-constrained visualizations of information. Newsmap’s objective takes that goal a step further and provides a tool to divide information into quickly recognizable bands which, when presented together, reveal underlying patterns in news reporting across cultures and within news segments in constant change around the globe.” Visit Newsmap and also see Max Kiesler’s DesignDemo of Newsmap.

image

BBC News Most Popular Now
The BBC News site uses a visualization map to show a live stat of its most popular stories.  Stories are sorted in the left pane, and can be geographically targeted using the map to the right.  It’s a great way to scan international headlines and get a pulse for what’s popular by BBC News readers as well.  Visit BBC News Most Popular Now.

image

Musicovery
Musicovery is a music discovery station that allows browsing based on the tempo and genre of the music.  As you selected options, circles and connected tendrils of bands and music streams float out.  Clicking on one plays that song or station.  Unfortunately, the site is now down temporarily because “the number of visitors has reached such a level that given the way we currently operate the broadcast the cost has become too high...We plan to rapidly provide the service again on a more sustainable basis.” See Max Kiesler’s DesignDemo of Musicovery instead for a view of the interaction.

image

If you have suggestions of other current visualizations, please feel free to leave a comment.  I’ll be sharing some of my own work on this in the future as well.

[Technorati tags: , , , , , ]

Written by Emily Chang in Agile designSocial designVisualization // Posts by RSS //
Argey on June 27, 2006 at 10:57 PM:

I’ve been working on 3D mind maps and 3D concept maps for a while now, and after a year in public beta, the result was released last month: 3D Topicscape.  It had a review in the Wall Street Journal last Friday.  There are user stories at the site showing use for business, projects and hobbies.  One is at http://www.topicscape.com/user-story/organizing-project-plans.html
It can turn a collection of notes, web pages and files into something that can be vizualized and understood in a new way, and usually allows finding materials even when the right keywords don’t come to the front of the mind when searching.  This is because it allows searching by concept while flying around the information landscape.

Emily Chang on June 29, 2006 at 01:35 AM:

You have my name ;) I love your site as well, great design. 

-Emily Chang

Ellen Weber on June 29, 2006 at 05:15 AM:

Emily what an exciting look at how people can be part of the action, through using more of their multiple intelligences. All of this can happen because of the way people like you are changing the landscape of the web.... Thanks for this reflection of all we have been given lately! 

Emily on June 30, 2006 at 03:18 AM:

Argey, thanks for the note.  I’ll check out Topicscape when I get a chance.

Emily, thanks, and it’s nice to meet another Emily Chang! :)

Ellen, I like your phrase multiple intelligences.

Sholom Sandalow on June 30, 2006 at 02:36 PM:

Great post.  Those are all good examples of new and innovative ways of using cutting edge technologies to help users visualize information.  Although designers lucky enough to be working on experimenting with new data visualization tools should be careful.  There is a fine line between usefull and neat.  The visual display is always a means to an end, which in this case, is to provide the user with a better way of processing the data he/she is looking at.

Andi B. on July 01, 2006 at 11:16 PM:

Hi Emily

I’ve got anotherone which is not gathering actual information from the internet but nevertheless offers very important information and is based on some kind of user involvement. I’d consider it a Web 1.45 application. http://www.whc.ki.se/index.php

Greets from sunny Switzerland

Andi

Bertrand on July 16, 2006 at 01:44 PM:

I like http://infosthetics.com (it’s not only for web design !)

Mary Heart on November 22, 2006 at 07:15 PM:

As with all things web, these sites live and die by the quality and freshness of thier core content.  Unfortunately, all the the examples given have very limited data sources, so they are quickly tapped out by the user who is on to the next bright shiny thing.

I guess the news sites are exceptions, but both are awfull from my perspective, the last thing I need is the firehose media blitz of all headlines at once.  In fact I don’t see where either do anything with the relationships of the stories.  The first looks just awfull. The second looks like the typical USA Today pablum of multinational corporate view of world events.

Aaron on December 19, 2006 at 09:26 PM:

I would tend to agree more with Mary on this as well particularly as it pertains to Newsmap. With a new outlook on usability, I am still marinating the minimalism mental tune after reading your post ‘Design 2.0:  Minimalism, Transparency, and You’ last night.


post a comment

Trackback URL:


recent posts

WordCamp 2008

iPhone 2.0.1

Female Bloggers

blog topics

archives

By date
By topic

selected posts

PicoCool: Cool Content from Real People

My Data Stream

Design 2.0: Minimalism, Transparency, and You

Next entry: GigaOM 2.0 Launches

Previous entry: Supernova2006

recent readers

Recently

Subscribe


Daily Stream

See what I'm doing online in my data stream, a daily river of my digital activity.