Archive for the ‘Critique’ Category

NY Times Mashup – Housing Violations

Wednesday, November 21st, 2007

I wrote last week about SoCali fire mashups and design lessons that could be learned. This NY Times mashup “Buildings with the most Violations” is a good example of what to do “right” (and they still squeeze in a horizontal ad on the page even with the larger graphic size).

Some nitpicks: I wish the map didn’t zoom in so far when the locations are accessed via the table listing on the right and there was a way to snap back to the full view (maybe a new “world” button ala ArcMap next to the (+) and (-) icons). Also would be nice if the database table headers could be clickable to set the sort on that column (with a 2nd click changing the order from ascending to descending). CSS styles could be applied to the “description” inside the text bubbles to add graphic hierarchy. Looks best in Firefox; the database scroll bar isn’t working in Safari.

NY Times Housing Violations Map

Fire in SoCal – Google Mashups Examined

Tuesday, November 13th, 2007

The end of October saw an outbreak of Santa Anna winds driving flames across the Southland. Many newspapers used Google map mashups to display this “breaking news” in geographic context. Sometimes this worked, sometimes it didn’t.

KPBS Fire Map


DESIGN LESSONS

1. Is a Google Mashup appropriate?

  • Yes, millions of people wanted street-level analysis
    (the KPBS map got over 1.5 million hits)
  • Timely content, easy to deploy

2. Stay focused

  • Don’t ask the map to accomplish too much
  • Give the map enough space to speak (make it big!)

3. Provide an entry point

  • “Start here” amongst the clutter
  • Maps should tell stories, not just be data dumps
  • Include a legend – not all symbols are self explanatory

4. Provide levels of information

In the map

  • mouseOver (feature names) “tooltip” behavior
  • onClick (brief description) “bubble window” behavior that takes up max of 35% of map (minimizes scrolling of the map on display, and allows for more map context to be read while window is displayed)
  • Use smart legends to allow symbol visibility to be toggled on/off by category on complicated maps

Complementing the map

  • “More Info” links to detailed information and related content.
  • Combine the map with a database display along side the map, not in the map neatline

5. Precision versus Accuracy

Limit map zoom

  • If you don’t have an exact location, don’t allow the user to zoom in past a certain scale

Show the detailed area, not a point on zoom in

  • If you’re showing streets, show detailed fire features as polygons not points

6. Chronology

  • If possible, display previous day’s map along with today’s (NY Times)
  • Compare with prior event (last year) (Washington Post)


THE MAPS

Interactive versus Narrative

Wednesday, November 7th, 2007

Alberto Cairo give a presentation this week while I was working at WPNI. He was El Mundo’s director of online graphics from 2000 to 2005 and is now a journalism professor at UNC Chapel Hill. He spoke about online news graphic best practices and how print and online newsrooms can be better integrated to produce these graphics.

Alberto mentioned a NY Times interactive that Archie Tse created in April that took my fancy then and still stands out as one of the best interactive graphics of 2007.

http://www.nytimes.com/2007/04/10/business/2007_BUYRENT_GRAPHIC.html

Rent or Own

Before the housing bubble burst, there was much hyperbole, conversation, and general brouhaha about renting or buying and which one was “better” (with many joining the buying frenzy). This interactive graphic allows the reader to enter their own personal circumstances into a visual calculator and determine the best course of action for THEMSELVES. Often newspapers publish several scenarios to outline the parameters, but this tool reduced a complex topic to a meaningful conclusion: “Is it Better to Buy or Rent?” for ME.

This type of non-linear interactive stands in strong contrast to more narrative focused multimedia presentations (interactives?) like another NY Times graphic: Climbing Kilimanjaro.

Great interactive Caribbean travel map

Sunday, November 4th, 2007

I’m very impressed with this NY Times map that ran last weekend:
http://travel.nytimes.com/2007/10/28/travel/28curacao.html
(follow the “click to explore venues” link in their left sidebar)

Caribbean Map – New York Times

On the surface, this map is a Flash-based interactive graphic that makes use of Google maps thru a “mashup” (inside of Flash) enabling the cartographer to use Google for the detailed street and satellite maps to plot features (like travel points of interest) onto. This information is often more detailed than the databases we have and can quickly be deployed. The downside is the “look” is Google and after awhile, every mashup seems to look alike.

But this NY Times example uses custom map icons and mouseOver effects to good use to distinguish itself. And you can’t even tell it’s a mashup at first view. It starts with a regional Caribbean map (custom NY Times cartography) and then zooms into the specific country before fading to the Google mashup.

This map is also well integrated into it’s host page. In-line with each point of interest description in the HTML is a link back to the map. When the user clicks on the “MAP” link, the photo on the top of the page changes to the interactive map, zooms in, and displays that feature, even if the map wasn’t displayed at first.

Excellent interactive!