Projects walkthroughs, tool teardowns, interviews, and more.

Articles tagged: D3

  1. What I Learned Recreating One Chart Using 24 Tools

    By Lisa Charlotte Rost

    Posted on

    Lessons learned from trying to create one chart with as many applications, libraries, and programming languages as possible.

  2. How (And Why) We Built A World Series Simulator

    By Chris Hagan

    Posted on

    We created a tool that allowed users to peek under the hood of the MLB playoffs by simulating the postseason as many times as they wanted, which we hope taught even baseball fans something new about their sport.

  3. Interactive Data Journalism: A One-Semester Syllabus

    By Jonathan Stray

    Posted on

    Data journalism draws on a remarkable array of skills—everything from statistics to graphic design to FOIA requests.

  4. Automating XKCD-Style Narrative Charts

    By Simon Elvery

    Posted on

    I’ve been exploring how to tell complex stories on the web for quite a long time. When presenting a complex story to an audience, the goal is often to simplify the complexity without sacrificing so much detail that important elements are lost. XKCD’s movie narrative charts do this in a novel and effective way. On one hand, they provide the ability to see the shape of the story in one easily digested image. While at the same time they allow you to drill deeper, getting into the structure and detail of the story.

  5. How We Made a Story That Changes Based on Your Birth Year

    By Lindsay Muscato and Soo Oh

    Posted on

    Vox’s recent interactive on teen health asks the user for their birth year and then, based on that, changes the text of the story. We thought it was a fascinatingly personal way to contextualize CDC health data, leveraging readers’ innate curiosity about how they stack up. We talked to developer Soo Oh about the process.

  6. How We Made “Failure Factories”

    By Nathaniel Lash and Adam Playford

    Posted on

    For several weeks, the Tampa Bay Times has been publishing Failure Factories, a series exploring the effects of the Pinellas County school district’s decision to resegregate its schools. On the web we decided to try something new: kicking off the series with a D3-powered graphic that used data to show readers how dire the situation is for black students in south St. Petersburg. We were aiming for a brief and engaging piece that would invest readers in the stories to come. In that sense, our experiment was successful. #FailureFactories was trending in the Tampa Bay region before the first day of the project ran. We heard from readers across the country that they were waiting anxiously for the series, and both the graphic and the 5,000-word first installment in the series have been among the most viewed stories we’ve published this year.

  7. Animating Maps with D3 and TopoJSON

    By Roman Kalyakin

    Posted on

    An exploration of an easy way to animate paths in SVG maps.

  8. Comparing the Net Cost of College

    By Soo Oh, Erika Owens, and Beckie Supiano

    Posted on

    The Chronicle of Higher Education set out to compare net cost of colleges and found an unexpected discrepancy. The team describes the piece they created to help explain the difficulty in comparing net costs.

  9. All About the WSJ’s Penalty Kick Interactive

    By Chris Canipe and Tom Meagher

    Posted on

    In the days before the World Cup’s knockout stages, with their potential for games to end in shootout finishes, The Wall Street Journal unveiled an app that visualized the tendencies of the top penalty kicks takers on the teams advancing in the tournament. Chris Canipe, senior news apps developer on the Wall Street Journal’s interactive graphics desk, talked with me about the thinking behind the project and how he and his colleagues put it together. What follows are edited excerpts from our conversation.

  10. Meet Bloomberg’s Dataview

    By Jeremy Scott Diamond

    Posted on

    One of our most recent works, “How Americans Die,” is an instance of what we call a “dataview.” The impetus behind dataview was a hope to provide clear and concise storytelling, while giving the supporting data more prominence and explorability.

  11. How We Made “NSA Files: Decoded”

    By Feilding Cage and Gabriel Dance

    Posted on

    The Guardian’s Gabriel Dance and Feilding Cage break down their process, from storyboards and video production to major design changes and development challenges.

  12. Mapping Made Simple, Now with Bonus UI

    By Alan Palazzolo

    Posted on

    Introducing the double-whammy of Simple Map D3 and Tulip, a new mapping app from MinnPost.

  13. Década Votada, a News App to Track Voting Records

    By Mariano Blejman

    Posted on

    In April 2013, Hacks/Hackers Buenos Aires hosted a hackathon on D3.js. As part of a project co-sponsored by the International Center for Journalists, Knight-Mozilla OpenNews provided seed funding to the winning project, an app called “Década votada” (q decade in votes).

  14. The NYT’s Visual Election Outcome Explorer

    By Mike Bostock

    Posted on

    Mike Bostock explains how he and Shan Carter created the 512 Paths interactive feature, from early sketches to complete implementation.

Current page