ONA winner highlights 5 ways to create interactives that inform & engage readers

Around the same time this summer that North Carolina voted to ban same-sex marriage, the Guardian published an interactive that showed just how differently each state defines gay rights.

The interactive displays information in ways that a traditional story never could — by using color wheels to show how gay rights vary from state to state and region to region. The wheels help organize what would otherwise seem like an overwhelming amount of information, and they offer readers a visual representation of just how divided America is over gay rights.

I talked by phone with Guardian Interactive Editor Gabriel Dance and Interactive Designer Feilding Cage about the project — which has since won a 2012 Online Journalism Award — and asked them to share advice about what goes into creating an effective interactive.

Tackle an ongoing news story

When deciding whether to turn a story into an interactive, the Guardian’s four-person interactive team considers whether the story’s subject matter has staying power. If it does, Dance said, then the interactive probably will too.

He noted that topics like gay rights, women’s rights, gun control and the death penalty work well for interactives because they regularly come up in the news.

“If I’m going to have a team member work on something for two or three weeks, we don’t want it to be only be for one day or one event,” Dance said. “We want to make it an evergreen, living reference so that as these topics come into the news again and again, the interactives will still be timely, contextual and relevant.” Whenever gay rights comes into the spotlight, The Guardian can resurface the interactive and help extend its shelf life.

One of the challenges of tackling an ongoing news story is that there’s often a lot of research involved. It helps, Cage said, to look for organizations that track the kind of information you’re looking for.

“Researching this project was an incredible challenge; each state has their own definitions and they often vary widely,” he said. “I did a significant amount of reporting on my own and discovered late in the process that several organizations keep track of variations of what we were looking for.”

Create something unpredictable

More often than not, state by state data is displayed on maps. Cage wanted to take an unpredictable approach, though, so that the interactive would stand out.

“I originally went into this project with the goal of telling the story of gay rights without using a map. There are many maps of gay rights on the Web, and they do a good job of looking at one aspect,” said Cage, who spent about three weeks working on the interactive. “I ended up going with the circle because I was able to convey the regional aspect of the story while addressing many types of rights at the same time.” (Here’s a detailed piece on how he actually created the circles.)

The main wheel in the interactive breaks down gay rights by certain topics. The bold colors represent the states with the most rights.

The Guardian interactives team places a strong emphasis on taking different approaches to tell stories visually. The goal, Dance said, is to design interactives in a way that not only informs, but generates interest and engagement.

“We strongly believe that one of the most effective ways to communicate information is to do it in a way that interests the reader,” Dance said. “This interactive could have been done in a table. Could that table have been more effective from a purely data standpoint? Maybe. But nobody wants to look at a table of data. We’re much more interested in what’s going to engage the audience.”

Make it easy to share, personalize

Cage didn’t just want readers to engage with the interactive; he wanted them to share it and personalize it. The interactive lets readers connect to Facebook to share gay rights stats for their state, and it lets them see the stats for states where their Facebook friends live.

“It was really neat to see the feedback loop on Facebook and Twitter, and see what people were getting from [the interactive] and the connections they were making,” Cage said. “Some of it was stuff that I hadn’t even noticed, and I’d been staring at the data for weeks.”

It helped, he said, to tap into the knowledge of others at the Guardian; he and Dance worked closely with Guardian Open Editor Amanda Michel and her team to brainstorm ways to integrate social media into the project.

The interactive ended up being one of the most-read stories on the Guardian’s site for a few days after it was published, and people are still sharing it on social networks 10 to 20 times a week, Cage said.

Dance attributes the popularity to the execution of the interactive and the subject matter. “Gay rights is an issue a lot of people feel passionate about,” he said.

When I interviewed Online Journalism Award Co-Chair Josh Hatch about the project, he too said the interactive works well because of the subject matter. Many of the ONA finalists’ projects this year are diversity-related. Hatch doesn’t know for sure why this is the case but thinks it’s a reflection of a diverse group of judges — and the fact that stories about diversity often resonate with people.

“We know that people are drawn to stories that are unique or that connect with the reader in a personal way. It’s possible … that stories that zero in on diversity-related issues might resonate particularly well on both of those counts,” Hatch said. “Almost by definition, stories that focus on underrepresented subgroups — LGBT community, various minorities, etc. — are unique, and because so many people so closely identify with these various groups, then those stories also offer that personal connection. One can imagine a reader thinking, ‘Hey, here’s a story about *me,* (or my brother or sister or son or daughter) and I *never* see that!’”

Integrate it with the rest of the site


Too often, interactives and long-form narratives get lost once they leave a site’s home page. One way to extend the life of an interactive is to link to it in related stories, and to retweet links to it from time to time.

The Guardian’s gay rights interactive appears in all articles that have the gay-rights tag, making it easy for people to find.

The site’s content management system also allows for a deeper level of integration.

State names in gay rights stories are all highlighted. When readers scroll over the state name, a circle pops up and prompts them to click through to the interactive, which will show them data for that particular state. 

“It’s more powerful than a related tag and related article; we get into the copy, analyze the word and add deep links and further context on a word by word basis,” Dance said. “I give a lot of credit to our content management system; it provides the flexibility to do that.”

In this excerpt from a story about how gay rights affects foreign aid, the word “Texas” is highlighted. When you click on it, you’ll see a pop-up that links to the interactive.

Update the interactive

Shortly after the interactive was published, Cage and Dance heard from readers who said they wanted more information about states that don’t recognize same-sex partners.

Based on this feedback, Cage updated the interactive to include data on relationship recognition. In November, Cage plans to update the interactive to reflect gay rights initiatives that several states are considering.

When doing research for the project, he had asked a LGBT association — the Movement Advancement Project (MAP) — to add him to their monthly newsletter so he could be aware of their latest research and update the interactive as necessary.

“When I was talking with the folks at the MAP project, it was a conversation about their definitions and research, but I was able to contribute and am still encouraged by them to share research that’s relevant,” Cage said. “Google News alerts are incredibly useful for monitoring a topic. In our case, the data doesn’t change frequently, but it’s useful to know what’s coming.”

Winners of the Online Journalism Awards will be announced Saturday night at the ONA convention in San Francisco.

We have made it easy to comment on posts, however we require civility and encourage full names to that end (first initial, last name is OK). Please read our guidelines here before commenting.

  • Page Grossman

    I think this article shows how journalists are using the technology of today to increase their audience’s interest, awareness and depth of understanding. Creating interactive graphics that pull the reader in and let them explore the information that they’re interested is beneficial to the news organization and to the readers. I’m also impressed by how The Guardian is using this infographic. Unlike many news organizations, they didn’t just place it on their website and hope that the audience found it. They took an active to role to promote the graphic and to continue to update it and promote it on other relevant stories. Great ideas!