With more than 1,100 candidates, 507 races, top-line campaign finance data and poll averages for select races, the 2014 midterm elections forecast app we launched in early September is probably the most complex mash-up of data, APIs and home-grown content yet from our Interactive Applications team at Gannett Digital.
We’re really happy with the results — even more because the app is available not just at USA TODAY’s desktop and mobile web sites but across Gannett properties. With the rollout of a company-wide web framework this year, we’re able to publish the app simultaneously to sites ranging from the Indianapolis Star to my alma mater, The Poughkeepsie Journal.
What’s in it? Every U.S. House and Senate race plus the 36 gubernatorial races up in November. For each candidate, we have bios, photos, total receipts and current poll averages. For each race, USA TODAY’s politics team weighed in on a forecast for how it will likely swing in November. Check out the Iowa Senate for an example of a race detail page.
Finally, depending on whether you open this with a desktop, tablet or phone, you’ll get a version specifically designed for that device!
Building the backend
This was a large project with equal heavy lifts on design/development and data/backend coding. As usual, I handled the data side for our team with assists from Sarah Frostenson.
For the data, I used a combination of three APIs and home-grown content:
— The Project Vote Smart API supplies all the candidate names, party affiliations and professional, educational and political experience. Most of their photos are via Vote Smart, though we supplemented where missing.
— The Sunlight Foundation’s Realtime Influence Explorer API supplies total receipts for House and Senate candidates via the Federal Election Commission.
— From Real Clear Politics, we’re fetching polling averages and projections for the U.S. House (USAT’s politics team is providing governor and Senate projections).
The route from APIs to the JSON files that fuel the Backbone.js-powered app goes something like this:
- Python scrapers fetch data into various Postgres tables.
- A basic Django app lets the USAT politics team write its race summaries, projections and other text. Postgres is the DB here also.
- Python script queries Postgres and spits out the JSON files, combining all the data for various views.
- We upload those files to a cached file server, so we’re never dynamically hitting a database for anything.
Meanwhile, at the front
Front-end work was a mix of data-viz and app framework lifting. For the maps and balance-of-power bars, Maureen Linke (now at AP) and Amanda Kirby used D3.js. Amanda in particular spent a chunk of time getting the polling and campaign finance bar charts to flex well for mobile web, tablet and desktop.
For the app itself, Jon Dang and Rob Berthold — working from a design by Kristin DeRamus — used Backbone.js for URL routing and views. Rob also wrote a custom search tool to let readers quickly find candidates.
In the end, we’re thrilled with the effort and the response from our colleagues across the company.