Juxtapose JS

The ABC's story about the destruction of the tsunami in Fukushima in 2011. Sliding the divider from right to left reveals the devastation of the Sendai district.
The ABC’s story about the destruction of the tsunami in Fukushima in 2011. Sliding the divider from right to left reveals the wave’s destruction of homes, buildimgs and crops in the Sendai district.

Another simple but beautiful tool from Knightlab at Northwestern University, Juxtapose JS allows you to create image comparisons, such as the scene of a news event before and after it occurs. Building a Juxtapose slider requires only before and after images (.jpgs or .gifs). A template for designing your slider is provided, and once your info is entered the program generates an embed code. Voila!

A similar tool was designed and coded by the ABC and used in an effective photo story about the disastrous impact of the tsunami on Fukushima in 2011.

Juxtapose JS

A year in interactive storytelling at The NYT

NYT Ebola

A nice collection of Multimedia Stories, Data Visualization, Data-Driven Stories,Explanatory Graphics, and Visual and Interactive Features created in 2014 by the graphics boffins at The New York Times.

Many story packages depend on strong photography, so that’s one element we’ll need to consider early.

The above all on one page is here.

Photos telling stories

UpShot in the NYT visualises 2,000 calories
UpShot in the NYT visualises 2,000 calories

Often the simplest way to explain a story or a concept is to show readers, not tell them. Great writing also uses the same idea – show us, don’t tell us.

This is an extraordinarily simple and effective story from the UpShot in the NYT:  What 2,000 Calories Looks Like. The story is light on text and heavy on photos that have an impact because they mean something to us – most people living in a country with easy access to a variety of foods can imagine sitting down to most of those meals. This story is so much easier to understand than meaningless lists of foods ranked by their calorie count, and can be read and understood by a very wide audience.

You can find more by The UpShot here.

Graphics: The Washington Post and MH370

The Washington Post used simplicity, clarity, and great, well imagined graphics to produce a number of web stories that sought answers to the mystery of MH370’s disappearance.

What happened to Flight 370?
The depth of the problem

The scale of the search for Flight MH370 has an almost game-like irresistible appeal: readers understand quickly the impossible nature of the task faced by those searching, but also feels compelled to keep looking.

WaPoMH370