Tag: map

Interactive weather map… on TV

No other genre in journalism is more intertwined with infographics than the weather. It’s hard to find a newspaper or a news show that doesn’t use icons, charts and maps to forecast temperatures, wind speeds and the chance of rain.

Interactivity can add a lot of value to weather maps and charts, for instance by allowing you to zoom in on your own town, add layers of interesting information, drill down into historical data, or adjust the timespan of the forecast – to name just a few options. Examples of interactive weather maps are can be found all over the web, ranging from the nice an clean interface of the BBC to the elaborate dashboard by WheaterSpark.

Yesterday, Dutch public broadcaster NOS also introduced an interactive weather map… on television. It is presented on a huge touchscreen that is one of the main features of a brand new studio (as you can see in the video below, the presenter still has to get used to it). A clear case of remediation the other way round: this is not a new medium refashioning an old one, it’s an old medium paying homage to the new! Looking at the weather section of the website of the NOS there only one thing I don’t understand: why can’t we play with these interactive tools ourselves?

Explanation first, then overview, zoom, and the rest of it

In reply to my previous post about the functions of interactivity Eugene Tjoa advocates more attention to explanation in interactive infographics. I totally agree with him. Information visualization has a very fruitful influence on the design of infographics but most infovis techniques are developed for specialists, not for a general audience. Furthermore, there are no general accepted conventions (yet) about the interaction design of visualizations. And although recent research suggests that visual difficulties can stimulate engagement and active processing of information, I think it’s a good idea to at least initially give users of interactives some clues about what they are looking at and how they can play with it.

At the New York Times they call these clues the ‘annotation layer’ and they take them very seriously. At last year’s edition of the Eyeo Festival, Amanda Cox of The Times graphics department stated that “the annotation layer is the most important thing we do.” Without it, she explained, it’s like saying to your audience: “Here’s an interface, now go ahead and browse for the rest of your life.” If you missed her presentation, be sure to watch the video.

The BBC also often adds a layer of annotation to its interactives. Literally. A good example is their interactive map of deathly accidents on British roads between 1999 and 2008. On opening the page, the actual map is partly hidden behind an overlay with a text that explains what data is visualized and how it can be manipulated. After this ‘window’ is closed, smaller overlays indicate the three ‘manipulation modalities’: you can enter your postcode, zoom in on the map or specify a year.

But when it comes to explanation, even the BBC can’t compete with The LRA Crisis Tracker. The smooth design of this interactive map and timeline in a way conflicts with its sinister content. The website offers a live overview of the atrocities committed by the Lord’s Resistance Army in central Africa. Visitors can track the number of abductions, mutilations and killings in real time.

Maybe it’s because of the gravity of the data that so much attention is paid to clarifying them. On your first visit you are automatically presented an overlay with a movie that explains what the site and the data are about. After closing the video player or on subsequent visits, the map and the timeline present themselves with a small animation that highlights the different interactive options and gives you a feeling for the amount of data. It’s like the designers adapted the famous visualization mantra to: Explanation first, then overview, zoom, filter, and details-on-demand. Unfortunately the animation doesn’t run as smoothly anymore as it probably did when the site was launched. Sad but true, the likely cause is the increase of woeful incidents.

How far would kids walk for cannabis?

The Netherlands are famous for their coffeeshops, places where one can buy cannabis for personal consumption without being bothered by the authorities. However, the Dutch government is planning new legislation that will force coffeeshops located within 350 meters of a school to close. Some of my students are reporting about the results of these plans for the coffeeshops in the city of Leiden. A nice opportunity for me to play around with the Google Maps API.

The map below shows all coffeeshops, elementary schools (in red) and high schools (blue) in Leiden. By hovering over the schools you can see which coffeeshops are within the 350 meters zone and would have to close. You can also have all perimeters revealed at once to see that just one of the 11 existing coffeeshops will survive when the rule will be applied to both elementary as high schools, whereas just one none of them has to close down if the rule will only affect high schools. It’s not yet clear how the new law will calculate the 350 meters but in this mashup they are measured in a straight line, not as the actual walking distance from the school to the coffeeshop.

Of course the map doesn’t answer all kinds of interesting questions. Like how far school kids would walk to get their cannabis. Or where they are going to buy their drugs when the coffeeshops are all closed. Nevertheless it would be very interesting to create a similar map for Amsterdam (over 200 coffeeshops) or the entire country. If you have suggestions for improving this interactive, feel free to share them in the comments!

Slick sites with sad stories

Two impressive map mashups were released this week. The Magnum Foundation unveiled a website for its Emergency Fund. It showcases the work of photographers who document social issues worldwide. The site is not quite finished. A lot of information is ‘forthcoming’ and the interface – an interactive worldmap – sometimes seems to acts on its own. But the stories that are already online definitely are worth a visit.

Products of Slavery also features a clickable worldmap. The site contains a visual inventory of more than 122 products that are produced in over 58 countries using child or forced labor. The same data is also accessible in an interactive graph and can be ordered by country or by product. Clicking on a product reveals more information and links to more sources. Just like on the Magnum site, the slick interface reveals rather sad stories.

Election day: a feast of interactivity

From a European perspective the midterm elections held today in the United States are a feast of democracy. Voters elect new members for the House of Representatives and the Senate and all kinds of local representatives. Furthermore they are able to give their opinion on several ballot measures, initiatives, and propositions.

Election day is also a feast of interactivity. As always The New York Times is leading, with interactive election maps for the House and Senate, a visualization of political tweets and an overview of states where Tea Party candidates are running.

But of course others show their best too. Good visualizes how the political climate has changed over time while Forbes concentrates on billionaires’ favorite politicians. Pressure groups also have discovered the power of infographics. Oil Change International reveals how energy companies attempt to suspend the California Global Warming Act by funding Proposition 23. A nice example of the power of zoom, except for the counterintuitive slider. Less interactive but much funnier is this explanimation that promotes the legalization and taxing of cannabis in that same state:

Banks that went bust

The financial crisis may be well over its peak, in the United States banks keep collapsing every month. The Wall Street Journal mapped all bank failures since January 2008. The timeline automatically starts to play as soon as the application is loaded. And although there’s some discussion about the effectiveness of animation, the boxes that appear at the end of it to explain how to manipulate the data sure add to the maps usability.

Stress and distraction

Financial website Portfolio.com made an inventory of factors that can increase stress in metro areas, ranging from unemployment and traffic to pollution and even the weather. These were quantified for the 50 largest cities in the States. The results are visualized on an interactive map. A good idea but the implementation could have been better. For one thing I would have liked to be able to compare the areas on each individual factor. Secondly I prefer a click instead of a mouse-over to reveal popup windows. Last but not least, the animation of the steam doesn’t contain information but certainly adds distraction.