Posted on April 20, 2010 by Tracy Boyer Clark

Today Kat Downs, Information Designer at The Washington Post, details her experience designing and building the impressive interface for the series “On the trail of a serial rapist.” I asked her to describe her experience organizing this data-rich story into a clean and compelling interface because I think that many of you will be faced with a similar situation (if you haven’t been already). I know I was overwhelmed when I produced “Above the Law?” for The Roanoke Times!

Years of court cases, connections, archival footage, and the endless other resources may become baffling, but the trick is to parse and present it in a consistent manner.

I hope you take the time to read about Kat’s trials and tribulations so you are prepared when you are tasked with a similar assignment!

A LITTLE BACKGROUND
“On the trail of a serial rapist” was a project born of some incredible research and reporting by Josh White and Maria Glod, who spent about two months visiting police departments and crime scenes and talking to victims of the so-called East Coast Rapist.

I knew instantly that this was going to be a great multimedia story. We had so many types of information (photos, video, maps, quotes), and the story was immensely important to our community—this rapist has been on the loose for 13 years and is a suspect in 17 cases. It was an opportunity to do something interesting and new.

I worked on this project for about five full days. Most of that time was spent organizing the data, selecting and sizing the images, designing the interface and building it out with Flash/AS3.

THE IDEA
The concept was that we would have this “strip of cases,” which would let people see the connections between the crimes. We had so many interesting details for every case, so the trick was to include all that detail while not getting too bogged down in it; to emphasize the relationships between the crimes and try to get at the trends of the attacks – where, how, and when.

So I built the piece so that you can group the cases by date, location, weapon or existence of DNA by sorting the table at the top. I liked doing it this way because it worked on two levels: all the data was there, so it was a deep information experience for people who wanted that (police, crime watchers, or neighbors or community members), but it was also simple and engaging enough to interest people who knew nothing about this story and were encountering it for the first time.

The interface is like a slideshow in that you can move forward and back through the cases, but you can also dig through them however you want. So if you go to the map, which was done by cartographer Laris Karklis, you can select any location and go straight to the case details. Each case page has a map, photographs, a summary, a quote, and all the details. No matter which order you view them in, the headline, blurb and quote help to personalize the cases and provide context for each event in the larger sequence.

We also had some video from two of the crime scenes and an on-camera interview with the reporters that Jason Aldag of our News Video team shot. In the video, Josh and Maria talk about how they got interested in this story. I think that aspect is really compelling – what interested us in this case? What’s unique about it and why is it so important?

LIKES
A feature I really like is the deep linking, which was done with SWFAddress by asual. I have used it on a couple of other projects and I really like the way it works. It makes it easier to navigate and lets people bookmark individual cases, which is great for a piece like this, where someone may only be interested in a specific case. I also really like the way you can sort the cases to find trending. I don’t think everyone who looks at the presentation would use that functionality, but for those who are really interested in finding out how this suspect thinks and works, it’s really fascinating.

I think the color-coding does a good job of helping to lead viewers through the experience of both the map and the case details. I also love having the video that Josh and Maria shot with the detectives on the scene (which you can see on two of the most recent cases – see Oct. 31, 2009). It really helps to personalize the scene and the detectives who work on these cases.

WOULD’VE BEEN NICE-TO-HAVES
The only thing I think would have been nice to have was a satellite view in the Google maps that we included on each case detail page. Initially we had both the standard and satellite map views. But at the size and zoom we wanted, the satellite imagery sourcing for the Google maps is so dense that it covered most of the image. Because of that issue, the effect wasn’t accomplishing what we wanted – to let people see the terrain of the areas: wooded, secluded but near a busy intersection, etc – so we just removed it from the piece.

If I want to do something like this in the future, I’ll either use a different mapping API or make sure that I make the Google map bigger, so I don’t end up with sourcing all over the image. There is also quite a lot of text on the page (long intro + lengthy credits), so it might have been nice to trim that down a bit.

THE IMPORTANCE OF MULTIMEDIA REPORTING AND COLLABORATION
The main reason this graphic was successful was because of Josh and Maria’s reporting. I can’t emphasize enough the importance of having people in the field who value multimedia and realize what kind of impact it can have, and take the time to gather it during the reporting process. Josh and Maria were very organized and they collected massive amounts of detailed information on each case. It would have been very difficult to have been given this assignment and expected to go out and gather this data after the reporting process was complete.

According to Josh, “both Maria and I spent far more time on the graphic elements of this story than we normally would, in part because we felt they were such an important component of explaining this series of crimes. We visited all of the scenes, compiled all of the information about the cases, interviewed as many victims as we could, spoke to each police department, assembled what evidence was available and took most of the photographs.”

“Spending as much time as we did on the graphic paid huge dividends, and not just in the finished product of the graphic that [Kat] so artfully (and painstakingly) assembled. It really helped us sort out all of the details, put them in perspective, and make sense of them for the story. Ultimately the story and the graphic were intermeshed in a way I’ve never seen before; we were able to literally empty our notebooks, provide readers with everything we had, and we didn’t need to get mired in all the nitty gritty in the actual story. I think it worked about as perfectly as we can hope for.”

The collaboration between Josh and Maria, editor David Marino-Nachison, Jason and myself was one of the most fun parts of working on this project – taking everyone’s ideas and creating a new form of storytelling that equals more than the sum of its parts. I think we were all really pleased with the result.

From Maria: “[The graphic] will continue to be a great resource, both for us and for readers, when this man either attacks again, or is caught. And one of those two things is likely to happen. We can always link to the former story, but the graphic is an enduring way to remind readers of the cases and present them with all the details that would not make it into an update story simply because of the volume and level of detail.”

Other posts that might interest you:

• Crunching 30 years into an interactive
• Behind the scenes of “Goa hippy tribe”
• SBS launches multimedia site “Dragon Children”

Tags: David Marino-Nachison, deeplinking, Flash, interactive, Jason Aldag, Josh White, Kat Downs, Laris Karklis, Maria Glod, multimedia, The Washington Post

---

• ← Apple’s iPad: Three weeks into the (magical) revolution?
• Entrevista con Ed Granger-Happ, innovador fundador de NetHope →