New homicides map

We just launched this interactive map with details about 2,294 homicides that occurred in D.C. between 2000 and 2011. You can find the killings in your neighborhood, follow the trends over time, and learn how the victims died and what happened to their cases.

Key findings featured in the graphic:
Click the headline to jump straight to that view in the map.

Homicides in D.C. are down 55 percent since 2000
The number of homicides in the District fell last year to 108, a 49-year low. Despite the decline, homicide continues to be a tough crime to solve and prosecute in the city.

Motives: Drug killings down 84 percent
The most common motives for homicide in D.C. are arguments, drugs and retaliation. About 2 percent are classified as gang-related. Homicides involving drugs have decreased about 84 percent since 2000. Drug-related homicides accounted for eight of the city’s killings last year, compared with 49 in 2000.

Most dangerous age: 24 percent of those killed were in their early 20s
More than half of the District’s homicide victims between 2000 and 2011 were between the ages of 15 and 29. About 93 percent of those victims were male, and 94 percent were African American.

Homicides map

Published in The Washington Post, Oct. 14, 2012

As I designed this app, I was thinking about how to allow people to quickly find homicides in their area. That led to a decision to focus on neighborhoods. We let people see groupings of crimes that are meaningful to them in both the map and corresponding charts. To surface trends at a city-wide level, we added four promo spots above the map that send people directly to important stories in the app. And a timelapse feature lets people view trends, year by year, across the city and in specific neighborhoods. We’re getting great feedback from users; many people are telling us that they found surprising and intriguing information in the app.

Role: Design, light programming

Tools used: JavaScript, Google Maps API, Flot, CSS

Awards: Gold medal in the SND Digital competition, Silver medal at Malofiej for design

More JavaScript maps: 2010 census, Republican primary tracker, Earthquake in Japan

Seeing liberty through the lens

The Post has some of the best photojournalists in the world, and it’s always such a pleasure to work with them. For this three-part series on Virginia voters, Melina Mara took portraits of Virginians and interviewed them. Nick Kirkpatrick recorded and edited audio from the interviews. Then Bonnie Jo Mount traveled the state to photograph the themes: women, economy, and faith. Grace Koerber designed the beautiful package, and I was her editor. After she left the Post to go back to school for interior design, I handled the second two installments, putting together the mosaics and working on package branding. I love the slideshow and mosaic pattern Grace designed — it’s an inspiring way to do individual portraits and interviews. The ability to view images as a mosaic or in a full-screen gallery view is awesome.

For part two and three, I designed the mosaics. It was fun to lay out the page, especially with Bonnie Jo’s amazing photographs to work with. You can’t go wrong:

Say What? Interactive transcript player tool is a new way to tell speech stories

Ryan speech

Yesterday, we launched a new project: an interactive transcript player that matches up the words of the speech, Post analysis, and reaction from Twitter.

I have been wanting to do a Twitter project for a while, and this time all the pieces fit together. After I pitched the idea, Cory Haik coordinated a partnership with VoterTide, a great company in Omaha that does aggregation and analysis of Twitter trends specifically around politics, that made the Twitter analysis segment possible. I designed the piece, and we were able to get two awesome developers, Leslie Passante and Jeremy Bowers, to build it.

My favorite things are the ‘watch highlights’ view, where you can see all the Post analysis and skip everything else, and the addition of the social layer. Here’s an excerpt from the ‘Ask the Post’ blog post we put together on it:

… VoterTide will provide user reactions as they happen on Twitter, and we’ll match that to the moment in time these reactions occurred during the speech. We will package these reactions to reveal insights into the nation’s response to the conventions and their most-watched speeches.

We’ve gotten some great reaction from this project on washingtonpost.com and on Twitter. It was also written up by Poynter:

So as the GOP nominee took to the podium and the president prepares to do the same at next week’s DNC, it is appropriate that journalists roll out the coolest newest thing. The Washington Post did just that.

“Some innovations we have done, you step back and say, ‘That was fun.’ And some you might say, ‘We produced a new story form.’ But this time I think we can say both,” Haik said.

Totally agree! And we just did another one for Mitt Romney’s speech. This project would not be possible without the awesome producers who put it together: Haley Crum and Mary Keister. Check it out!

Washington Post Olympics graphics and multimedia roundup

Here’s some of what the WaPo team put together for the London Olympics:

The definition of perfection
I designed this piece about how gymnastics scoring worked. Wilson Andrews developed it and edited/animated the videos, and Bonnie Berkowitz did the writing.

definition of perfection

Profiles in Speed
This six-part series we developed in the run-up to the Olympics featured greats like Missy Franklin, Michael Phelps and Carmelita Jeter. Videos, infographics, and awesome articles. I especially love the segment on technology.

profiles in speed

Are you over the hill for Olympic sports?
As part of the Profiles in Speed series, I developed this graphic which lets you see where you fit into the Olympic age spectrum. Flowing Data wrote about it here.

over the hill

Four more pieces after the jump! »

StoriesFrom.us

Launched on July 7, 2012

StoriesFrom.us

StoriesFrom is a storytelling platform that allows individuals and organizations to create rich, community-driven documentary projects online. The site was made possible through a Knight News Challenge grant from the John S. and James L. Knight Foundation, cosponsored by Google. I built the front end of the site based on designs by Grant Kindrick. The site was optimized for the iPad and included complex gesture-specific functionality like the “wall,” pictured above. I themed Drupal templates to create the story pages (video, slideshow, and text options) and built several other page types, including a map featuring geolocated tweets based on specific keywords, multiple project displays and a complex navigation system.

Role: Front-end development

Tools used: JavaScript (MVC framework), MapBox, PHP, Drupal theming

Note: Due to changes in the Twitter API, the live tweet display is no longer functional.

NICAR presentation on visualization

I just got back from the NICAR conference in St. Louis, where I gave a talk with Bill Keaggy on Best Visualization Practices. There’s delicious stack of links here: http://bit.ly/nicar2012 and the presentation is here (click the settings gear and open speaker notes to find out what we talked about):

Chrys Wu kept a detailed list of links if you want to check out some of the other sessions. I also got the see the St. Louis arch! Very exciting:

St. Louis Arch

View from the top: St. Louis Arch

New year, new post

It’s been a busy few months, but I’m gonna squeeze in a post for January! I’ve switched jobs at the Post and moved into a new role, Interactive Projects Editor, focusing on creating interactive projects that combine design and graphics with video, photography and social media. I’m really looking forward to the new challenge. In other news, I’m getting used to the new delicious and trying out this ‘stacks’ thing. I’ve got a few going, namely one on interactive maps and one for games and quizzes. I’ll keep those updated as I collect links around the web. And, some of my recent work….

Pinocchio tracker
The tracker part of this was originally done with Tableau, but we decided to rework it and to add a game element to it. It’s on a page of its own as well as in the right rail on all our politics content. Try it out!

The Media Divide
This piece was born from a project by Marc Fisher to track what media people consume in a day and see how it reflects their ideology. Evelio Contreras did this great video and we put it together in a calendar with links to all the news they watched/read/listened to, and combined that with a poll.

The Seat Pleasant 59
This project leads with Whitney Shefte’s awesome video about a class of students who were promised that if they graduated from high school, their college would be paid for. We tracked down the students and found out where they are now. My contribution was the list/grid view and filtering along with itemizing content for each of the dreamers.

The power of the crowd: Is life getting better or worse?

An excerpt of my post about our new project on the WP innovations blog:

This is one of the first projects to take users opinions and mash them up with actual data to see whether perceptions match up with reality. It’s a fascinating window into how people feel about the places where they live and a forum for a conversation around how things are changing.

There are already some patterns emerging. We are starting to see that, in general, more states with high unemployment are being rated ‘worse’ by users, and more places with low unemployment are being rated ‘better’.

D.C. stands out – though unemployment is high, 83 percent of users (as of publication of this post) ranked it better. One left a comment after rating it ‘better’: “DC is better due to a higher number of permanent residents, community activism, and better stewardship. Welcome to the 21st century!” The comments on why people voted the way they did have been some of the most interesting results of the project we’ve seen so far.

Read more of this post at @innovations »