j187 | IIM

Intro to Interactive Media

Site Critique: CNN Home and Away

Screen shot 2012-10-01 at 8.23.57 AM

Reviewer: Annie Daniel

Site: CNN Home and Away

Report: Full Review

CNN’s Home and Away is an interactive infographic created in 2008 that displays casualties and troops that have died while serving in the the US-led Operation Enduring Freedom and NATO-led International Security Assistance Force. CNN worked with Stamen Design to create the piece. Home and Away recently won Gold in The Information is Beautiful Awards for Data Journalism, and an Ultimate Award for Most Beautiful.


When the user arrives at the site, an intro slideshow of images and descriptions of the fallen troops appears. This leads into a loading overlay with a casualty and hometown counter that counts as the page loads. This is effective at giving the user some context as to what the maps will display, as well as keeping the user interested as the page loads.


Once loaded, the chart closes to bring two side-by-side maps to the foreground, both spattered with white dots of varying sizes. Both maps can be zoomed in and out, and at the top of the page is an option of viewing either a map of Afghanistan or Iraq that displays on the right.  The zoom and map navigation is intuitive and easy to use as it functions similarly to a Google Map in that the user can click and drag to different locations. The zoom option is clearly located at the top left corner of both maps.

The map on the right of either Afghanistan or Iraq has white spots that mark locations of casualties. On the left is a map of the world that displays the soldiers who were killed during those attacks.

Beneath the maps are charts that describe ages of the soldiers killed, locations of the soldiers’ hometowns, and a timeline. The timeline allows the user to click on any month to see how many casualties, as well as where the casualties occurred on the map.

On the maps, the user has the option to click any of the dots. Each map’s dots contain different information to present a different impact of the war. If the user chooses to click on a dot on either of the right maps (Afghanistan or Iraq), they are presented with a pop-up menu of the soldiers killed in that particular location. When the soldiers’ pictures/descriptions are rolled over from the pop-up menu, their hometown location is shown on the US map. For the international map on the left, the dots mark the hometowns of the fallen soldiers while the right map zooms to show the location of the casualty in which they were killed. For instance, the casualties in Afghanistan for April 2012 as well as the soldiers’ hometowns are shown here:

Users also have the option to view the page in list form. This page contains sixty-four pages of soldiers who have died in action. The page also includes a blurb, not included on the original infographic, that describes the information


This piece is extremely personal. There are no images of battlefields or tanks or guns, but instead the information is presented in a very apolitical, straightforward fashion leaving it up to the user to decide what they will take away from the piece. Further, there is no mention of money, the economy, or the upcoming election- just a simple presentation of facts using graphs, images, and two maps.  According to Stamen’s write-up on the piece, they also linked the story to CNN’s iReport that allows users to connect with each other and share their story of loss. The social media aspect draws the user closer to the information and allows for the piece to reach an even more personal level.

CNN’s Home and Away project uses a monochromatic color scheme of blacks, whites, and grays with a splash of red in the top navigation bar. The colors do nothing to soften the blow of the hard information the infographic presents, but instead, give the users a solemn, immediate introduction to the content of the page. The only color images are those of the fallen soldiers that pop-up when a white dot is clicked. This is effective in communicating to users the profound impact this was has had on families all over the world by putting into perspective the number of lives lost.

The content is arranged in a clean, easy to read format, that presents a significant amount of information at once. Though the page was made in Flash and was not designed responsively, think that the page carries the most impact when all of the information can be seen at once on a monitor. At the very bottom right corner is a small counter with totals and information on when the content was last updated.

Some flaws in the page include the lack of responsiveness in the sliders on the bottom charts. They do not always move with your mouse and are somewhat delayed. It also may have been useful to include a brief description or caption below the maps as it is slightly overwhelming to open a page with so much information and very little description (aside from the into video that most people would probably skip, or at least I did when I first visited the site). A problem with the intro video that came up was that it only displays once- so if it is missed the first time, there is no opportunity to view it again. There is also no About page for the piece. The only description is that on the List View page. While I like the simplicity of the piece in forcing the user to look at facts and not emotional write-ups, an informational page about where and how the data is collected would have been useful.

As far as an audience for the piece, I would imagine CNN and Stamen Design were attempting to reach 18-30 year-old males interested in a side of the war unrelated to politics or the economy. Because of the dark nature of the infographic, I am led to believe that this would be too grim for families of the fallen soldiers, despite the social media outlet in each of the soldier bios. In reference to the bottom left graph on age, I think it would be reasonable to assume that CNN and Stamen Design were targeting the age group that includes the majority of the troops included in the graphic. This may have contributed to some of the choices made in the creation of the piece.

Home and Away does a beautiful job at conveying its message to its intended audience. The clean maps and thoughtful color scheme contribute to the effectiveness of the piece. The pictures of the fallen troops and the option of the List View, as well as the social aspect with the inclusion of iReport draw the user closer to the message without being overly sentimental. Though some additional information would have helped in delivering a clearer message, I like the idea of letting the user use the piece as he or she finds appropriate. Every aspect of the page is interactive and loaded with information. Home and Away deserved the awards it was given, and I walked away from the piece feeling more informed and humbled by the information it presented.

Leave a Reply

You must be logged in to post a comment.