Saturday, January 11, 2014

How we built the Austin Homicide Project

There has been plenty of great news applications that have focused on homicides, notably HomicideWatch.org and the LA Times' Homicide Report. The HomicideWatch folks have turned their site into a cottage industry, leasing their platform to other publications, like the Chicago Sun-Times, The Trentonion and others.

We wanted to do something similar in Austin ... to write about and follow each case of homicide in our area. Unlike Chicago and L.A., which can top 500 slayings a year, we typically have fewer than 30 each year in Austin. We usually write about each case, but we wanted to follow them better, hence the birth of the Austin Homicide Project.

Our police and courts reporters (Ciara O'Rourke, Julie Chang and Jazmine Ulloa) have kept a Google Spreadsheet with basic information about each homicide for the last couple of years, but to utilize that data in a news application, I wanted to control how the data was entered to keep it clean and consistent. That was a big part of the project ... creating the data management interfaces. But we also wanted to do something special with the display.

Our data interactives "team" is really just a pair at this point: myself and interactives designer/artist Rob Villalpando. We don't have a "developer" nor a model-view-controller infrastructure to build upon, so we pieced together a series of online tools to create our news app.

So, here is how we did it:

A responsive Foundation

Rob has been experimenting with different ways to make our interactive content more mobile-friendly, but we've always struggled to find a solution that works well within our content management system. Probably the best example is the fantastic brewery guide, where he used Foundation. But as we struggled with iframes and wraps, it's been made clear that we need to get out of the CMS to get the visual display we are seeking. This is our first Foundation project on a new (to us) server where I hope we can create some great work. Of course, without the CMS, we have to solve a lot of infrastructure we miss, like metrics, ad serving, access to content, etc.

Caspio for the data entry and display

I used the online database platform Caspio to build the data entry and storage system. We've subscribed to the service for a long time and it works pretty well as a tool to collect structured data and spit it back out, but it is search-engine hostile. Most of their data is invisible to Google. We used their SEO extension for the first time with this project, but it has many limitations and only scratches at problem. But it did allow us to build an application to collect details about victims, suspects and incidents that lead to each homicide, and build datapages to search and display those records.

Google Feeds API for news content

We wanted to utilize all the content we already write about these cases, so we created RSS feeds out of our content management system for each victim and suspect, and stored feeds in the homicide database. We use the Google Feeds API to display those headlines on the detail pages for each person.

Google Maps API for incident maps

As we record each incident in the database, we include a latitude and longitude so we can display an interactive map using the Google Maps API. I've been toying with the idea to make this a static map instead, especially for navigating on a phone. I've tested how to do it Static Maps API, and have considered showing for mobile only. What are your thoughts on that?

DocumentCloud for documents

The free DocumentCloud project is a great research tool for journalists, but the search display widgets also are handy for displaying specific document sets. With each document we upload, we include metadata that we also store with that person's record in our Caspio database, so we can customize the search widget on our display pages. I set the key:value pair as a javascript variable, so I can check for existence before drawing the document search results.

Fusion Tables for overall map

The big map of all the incidents is a standard Google Fusion Tables map. I wish we could publish a JSON output directly from Caspio to feed an online map, but it is simple enough to download the data out of Caspio and then upload it into Fusion Tables, and there isn't that much movement in the data anyway. I did have to tackle a CSS issue where the map tools were obscured, but found the solution on Zurb's site.

Highcharts for stats

Rob put together the statistics using Highcharts, which we already pay for. You could do the same kind of work with the free Google Charts API, which we've also used before, but Highcharts is prettier. This is also a hand-managed data set, and includes APD crime stats in addition to our own data.


0 comments:

  © Blogger template 'A Click Apart' by Ourblogtemplates.com 2008

Back to TOP