37signals logo

This is Signal vs. Noise, a weblog by 37signals about design, business, experience, simplicity, the web, culture, and more. Established 1999 in Chicago. Visit the Product Blog for more information on our products.

Jobs:

Gigs:

Screens: News.com, Archive.org, Walmart Matt Nov 22

16 comments Latest by Peter Hentges

News.com
news.com
What’s Hot gives a visual snapshot of the 15 newest and most read stories on News.com. The bigger the block, the hotter the story. The brighter the block, the newer the story. Bright yellow means the story was just published.

Archive.org
batting avg
Each item at Archive.org gets a “batting average” (the percentage of people who downloaded the item after visiting its details page).

Walmart
walmart
Walmart’s home page has a revolving slide show of products. The 1-2-3-4 bubbles at the bottom slowly fill up so visitors know how long until the next image is displayed. Jay, who submitted this screen, calls it a “nifty way of giving people who are slow readers an idea of how much time they have for your slideshow, and if they need to pause or not.”

Got an interesting screenshot for Signal vs. Noise? Send the image and/or URL to svn [at] 37signals [dot] com.

Looking for a job? Got a position to fill? Check out the Job Board.
Over 1 million people use 37signals' simple web-based software to collaborate on projects, track contacts, and organize their business with an intranet.

16 comments so far

cjcurtis 22 Nov 06

don’t really have an opinion about the archive.org or the walmart thing.

but the “what’s hot” on news.com…i don’t get it.

how is that better than listing hottest or newest stories in a nice neat column from top to bottom…and maybe using a little color to differentiate?

(so you can actually read it)

with this, you still have to read headlines, but they are all different sizes and shapes. i’m also thinking this means that the newest stories, since they haven’t had a lot of hits yet, are very small in comparison to the other stories. wouldn’t this be considered counterproductive in the news business??

i see that it does have a “headlines” option, but i don’t see the point of the graphic.

Daniel 22 Nov 06

That News.com idea is either a rip off or a purchase of an idea that’s been around for quite some time called the Newsmap.

Phil 22 Nov 06

Which was even already mentioned here: http://www.37signals.com/svn/archives2/screens_around_town_google_news_and_newsmap.php

I don’t quite “get it” any more now then I did then.

Darren 22 Nov 06

regarding the news.com “what’s hot”

The technique used there is called a treemap – I read about them first in Information Dashboard Design ( Stephen Few, published by O’Reilly, Jan 2006)

According to what I read, the treemap idea was devleoped by Ben Shneiderman at the University of Maryland. ( bio here, google results here )

Seems he’s quite a thinker…something along the lines of Tufte.

Rick 22 Nov 06

I am receiving an error message when trying to post a message

Thomas 22 Nov 06

News.com cough copied coughanother site. http://www.marumushi.com/apps/newsmap/newsmap.cfm

ugh 22 Nov 06

archive.org—batting average = terrible copy writing … but then again archive.org is stuck in about 2001 in terms of experience design.

Oren 22 Nov 06

What Walmart is using is called a called a heatmap. They are a standard chart type and have been around for a very long time. I wouldn’t call it copying any more than you can say someone copied the idea of a pie chart from someone else. We use these a lot in the financial industry to convey multiple points of data related to a single value. It’s really most useful when you can view changes in the data. It makes it easy to visually spot how the data is altered over time. It’s not all that useful for something like news where you generally don’t care about a stories change in popularity.

You can see an example of its use here: http://www.windowsfs.com/TheMag/tabid/54/articleType/ArticleView/articleId/1414/JPMorgan-Reuters-Map-Out-Data-Views.aspx

Darrel 22 Nov 06

I came across the CNET orange thing a few weeks ago. It comes across as a giant hairy wart on someone’s face. You just can’t avoid looking at it even though it just kind of grosses you out.

Tamimat 22 Nov 06

@ Thomas: Everybody is copying Apples Design. Marumshi was not the first person to come up with this design. It is always the understanding of data and transforming into the best visual form. When the “Marumshi” System is good do it, if not search for something else. Even if you Invent it you will find somebody who did it in a small project or in a book or even hounderds of years ago. Even the Yello Highlighting was not a 37signal invention. But if it helps to solve your problem use it.

jeevs sinclair 23 Nov 06

have you seen http://tenbyten.org (by number27) it’s a very interesting display of the world NOW as per the news and photos, a very clever ideal and great implementation I think.

10×10™ (‘ten by ten’) is an interactive exploration of the words and pictures that define the time. The result is an often moving, sometimes shocking, occasionally frivolous, but always fitting snapshot of our world. Every hour, 10×10 collects the 100 words and pictures that matter most on a global scale, and presents them as a single image, taken to encapsulate that moment in time. Over the course of days, months, and years, 10×10 leaves a trail of these hourly statements which, stitched together side by side, form a continuous patchwork tapestry of human life. 10×10 is ever-changing, ever-growing, quietly observing the ways in which we live. It records our wars and crises, our triumphs and tragedies, our mistakes and milestones. When we make history, or at least the headlines, 10×10 takes note and remembers. Each hour is presented as a picture postcard window, composed of 100 different frames, each of which holds the image of a single moment in time. Clicking on a single frame allows us to peer a bit deeper into the story that lies behind the image. In this way, we can dart in and out of the news, understanding both the individual stories and the ways in which they relate to each other. 10×10 runs with no human intervention, autonomously observing what a handful of leading international news sources are saying and showing. 10×10 makes no comment on news media bias, or lack thereof. It has no politics, nor any secret agenda; it simply shows what it finds.

With no human editors and no regulation, 10×10 is open and free, raw and fresh, and consequently a unique way of following world events. In 10×10, we respond instinctively to patterns in the grid, visual indicators of relevance. When we see a frequently repeated image, we know it’s important. When we see a picture of a movie star next to a picture of dead bodies, we understand the extremes that exist in our world. Scanning a grid of pictures can be more intuitive than reading headlines, for it lets the news come to life, and everything feels a bit less distant, a bit closer to heart, and maybe, if we’re lucky, gives us pause to think. If you’d like to learn more about 10×10, you can read how it works.

Tory 23 Nov 06

People need to stop trying to reinvent the wheel. The News.com treemap is just awful. Readers shouldn’t have to try to decipher some gimmicky-looking chart. Why can’t they just list stories in order of popularity?

john 23 Nov 06

Why is everyone so bent on whats popular? This article has been read 500 times. This means nothing to me, except that the title was catchy enough to have 500 people click on it.

If the layout works, and doesn’t get in the way, thats all that matters in a design mind. For a real world person, its about content that is easy to figure out.

td 23 Nov 06

web 2.0 gone a muck. Seems like a lot of people are choosing to focus on just the first of the three screens posted. The Wal-Mart slide show (with hour-glass style timer) is a very useful and enjoyable addition. No comments of archive or news stuff.

I do agree that not everything needs to be dictated and aggregated via popularity.

Nick 23 Nov 06

I’ve got to agree with the others here that the News.com graphic display is a mess. The fact that they have to explicitly label the hottest story signals the failure of the visual cues.

I don’t know about anybody else, but in my mental model ‘hotness’ is something that is signified using colour. Those oranges and yellows can’t help but conjure images of burning fires. But then I find from the key that colour dictates newness. Now it’s just confusing because I can’t escape from that colour-fire-hot thinking that my experience has taught me. And that means I’m having to really think about decoding the image. And the payoff for that extra processing? That older stories tend to be hotter.

As previous posters have said, display a list and be done with the chartjunk.

Peter Hentges 28 Nov 06

An alternative to the “most popular” listing of stories on a news site is used by the BBC (http://new.bbc.co.uk). They have a “Most Read” listing but also a “Most E-mailed” listing. It gives you a look at stories people thought interesting enough to email to someone. I think it shows that people tend to email stories that are funny or shocking but at least it’s a different way of sorting the stories.

Comments are closed