Represent: Reinventing a classic project with design thinking


By Allison McCartney and Derek Willis, ProPublica

Regular visitors to Represent, our interactive database that tracks Congress, will notice that over the past six months the app has undergone a major renovation. From new pages to new navigation, we used analytics and a reader-centered design process to reimagine the way Represent helps you keep track of lawmakers, even when Congress isn’t in session or during the federal government shutdown.

The first pieces of the project we now call Represent were created nearly 10 years ago as a project called “Inside Congress” at The New York Times. Parts of the project, including its robust API, also come from the Sunlight Foundation. We took over the Times’ project and relaunched it in 2016. Although it was an important resource not offered by other news organizations, it was difficult to use and navigate and was showing its age.

Six months ago, we set out to improve Represent. We undertook a process that started with imagining what problems we wanted to solve, who might benefit from an improved product and how best to redesign the app to reach them. The design thinking process was led by Tran Ha, a journalist and user experience consultant affiliated with the Stanford d.school.

We had an initial daylong design session in May that helped clarify our thinking and guided our decision-making and priorities for the rest of the year. At the meeting, we talked through where we wanted to be at the end of the year, and spelled out on sticky notes the outcomes that would “satisfy” and “thrill” the team. The goals we agreed on included making Represent tell a clearer, more cohesive story about each visitor’s representatives, and giving people the tools to “supervise” their elected officials.

That first meeting also established a plan to include current and potential users in the design process. We spent time interviewing some users directly, talking with congressional reporters, students, activists, nonvoters, congressional staffers, civic hackers, lobbyists, election professionals and local political leaders. We learned more about their information needs — where they got their news and data about the Congress, what information they felt they lacked, etc.

One of the themes that emerged from these sessions was how difficult it can be to keep up with the latest congressional actions, even for reporters who cover members of the House and Senate for a living. So we refocused member pages to include a running feed of a legislator’s latest activities.

We also added pages collecting entire state delegations. Those pages help people whose professional or political interests encompass a state. Those pages provide a list of each state’s senators and representatives, along with an activity feed of their sponsored bills, statements, leaves of absence and articles from Google News. The idea for these pages came from interviews with local reporters who were tasked with following their audience’s representatives and found it onerous to track each representative individually. It also led to our new state delegation overview page, which shows all of a state’s lawmakers broken down by party and indicates those who aren’t returning in the next Congress.

Image: ProPublica.

We took the activity feed idea from another ProPublica app, the Election DataBot firehose, and made it the main focus of lawmaker pages. The firehose makes it easier for users to get caught up on recent activity and to drill down into specific acts, like votes or bill introductions. And a cleaned-up layout with emphasis on mobile makes it easier to keep keep track of what lawmakers are doing.

We wanted the pages for individual lawmakers to help answer two questions: What is my representative doing and what does she really care about? To address the first, we de-emphasized our original focus on voting and elevated other congressional actions and news stories into a single feed. For the second question, news app developer Jeremy Merrill created a machine-learning analysis of press releases that highlights the distinctive issues lawmakers talk about, including who among their colleagues uses similar language.

Image: Bill pages, before and after.

A lot of what Congress does surrounds legislation. But when reviewing the analytics for Represent, bills stood out as some of our lowest-performing pages. People didn’t visit bill pages often and didn’t stay on them for long, telling us that there was room for improvement.

To make bill pages more useful to readers, we simplified the design and information without taking away the details useful to true Congress nerds. Take, for example, the tax bill signed into law in December. We restructured the page into card-like sections that make it less overwhelming to visitors, and created a new information hierarchy that makes bills easier to scan and understand. The bill actions feed now defaults to showing only the most important events in a bill’s timeline (with smaller bill actions still viewable with the click of a button) and bill statuses are more conversational and easier to scan. We added a page to see the statements lawmakers have made about a bill, and now list all bill co-sponsors by name.

Bills also got their own landing page and redesigned category pages, making it easier to browse recent legislation. We wanted to make Represent’s homepagemore timely and relevant, so we changed it from a reference page into one that showcased recent bills, votes and statements.

We also changed Represent’s typography and visual design system to match ProPublica’s new site design, which was launched earlier this year by David Sleight and our design department. And we added small but crucial features, like a subnavigation bar and improved breadcrumbs that help orient readers, and new tables that allow readers to sort the data in meaningful ways.

Six months ago, we asked ourselves who we thought Represent should serve and how it could be useful. Then we talked to those people and formed our ideas around their suggestions. The result of all these changes is a cleaner app that showcases the data in a way that helps reporters and the public keep tabs on what’s happening in Congress. We continue to believe that helping citizens keep daily tabs on what their representatives are up to is a key component in making representative democracy real and is a core responsibility of journalism. Stay tuned this year as we continue to add to Represent’s new lobbying registration database and other features that help you keep track of what your representatives care about and what they are doing on your behalf.

About the authors

Allison McCartney is a news apps developer at ProPublica working on Represent, ProPublica’s Congress app.

Derek Willis is a news applications developer at ProPublica, focusing on politics and elections.

Explore Represent here.

This article was originally published on ProPublica.