Behind the Scenes Q&As

How animated data visualizations helped the Economic Innovation Group explain the impact of skilled immigration

How do you measure the economic impact of skilled immigrant workers in the United States?

The Economic Innovation Group (EIG), which describes itself as a bipartisan organization focused on public policy, recently published a multipart scrollytelling project titled “Immigration Policy Is Innovation Policy” that not only answers that question, but also presents the information in a creative format that is not often seen with immigration data.

Skilled immigrants are generally defined as those who primarily come to a country for employment and usually have prior high-level education and work experience. There are several statistics to consider in terms of their impact on the U.S. economy, from the jobs they have created to the technology they have spearheaded.

The project is divided into two large sections: data on the impact of immigrants and video profiles of immigrant entrepreneurs or founders. The data is further divided into sections on entrepreneurship, innovation, revitalizing communities and a bipartisan way forward.

EIG worked with Graphicacy, a design agency in Washington D.C, to execute the design and data ideas behind the project.

Storybench sat down with two creators who worked on the project: Amelia Sandhovel, EIG’s senior communications associate, and Jeffrey Osborn, a creative director at Graphicacy. Together, they discussed their intentional design process and how the project paints a comprehensive picture of skilled immigration.

The following interview has been edited for clarity and length.

How did this project come about?

Sandhovel: Skilled immigration is a research and policy issue that EIG has been working on for a few years now. But this was probably our largest project in the area to date. We really wanted to pair the empirical data that we were seeing on the impact of skilled immigration, particularly immigrants’ local economic impacts, their propensity to be entrepreneurs and form startups. We wanted to highlight all of those statistics and pair them with the human element to take what tends to become a very abstract policy debate.

DON’T MISS  Using GIFs to tell the story of Oakland’s black barbershops
Sandhovel and other team members spent a lot of time sifting through the data available on the impacts of skilled immigration to decide what to highlight. (Screenshot courtesy of the Economic Innovation Group.)

What does Graphicacy’s workflow look like?

Osborn: We try to start with a really robust discovery phase. We want to make sure that we understand the core user groups, the stakeholder needs on the client side. That usually involves one or two online workshops where we look at the needs that we need to design towards. From there, we document the takeaways from that. Part of that discovery also involves talking about style and tone, which was actually a very important part of this particular project. 

Then, we often go through a couple of rounds of analyzing the data, some simple sketching of the data and then wireframing with tools, either Figma or Adobe XD. Refining those in discussion with the client and then finally coming up with something that not only demonstrates, in this case, the narrative, the style, the kinds of charts that we plan to use for the data, but also because this was a scrollytelling feature, [the sketch] doesn’t fully replicate but suggests the animation that we’re going to code into it. So, we need to do that for the client and also put together something that we can hand off to our development team that makes sense as well.

How did you choose what data to prioritize?

Sandhovel: ​​We really tried to focus on spreading out the benefits of immigration and showing the benefits for entrepreneurship, for job creation, for local geographies and really make a case that can resonate with any American reading the page on why immigration can be beneficial for their community and why it’s beneficial for the U.S. economy as a whole. [Statistics] that are easy to visualize were also an important part.

What kinds of tools did Graphicacy use to create these data visualizations?

Osborn: This was a React app that was embedded into the WordPress site. Specifically, [Eduardo Velez, lead data visualization engineer] was using IntersectionObserver and Scrollama to optimize performance in terms of what’s being served up as you move down the page with triggers.

DON’T MISS  How The Daily Show sifts through hundreds of hours of TV to find the funny

Also, he was using something called React Spring, which really helps with the fluidity of the animations. There was a lot of complex interaction that was scroll-triggered, where we have not only animated charts but also visual elements, collage elements that are being triggered as well.

The team from Graphicacy intentionally used waffle charts to highlight the humanity behind the data. (Screenshot courtesy of the Economic Innovation Group.)

Why was it important to combine the data with aspects of humanization?

Sandhovel: For any policy debate, and particularly about immigration, which is a person-centric policy, it can be easy to lose the impacts that it has on people. That was a guiding design principle for us that Graphicacy understood from the start, that we wanted to incorporate imagery of people, of workers, of people who would be your neighbor, would be in your community to really get at people’s hearts and make it feel like it was a familiar thing to them. That was a really core aspect of this project.

Osborn: Even our choice, toward the bottom of the scroll, using waffle charts. Those could have been bar charts, they could have been pie charts. Having those little individual squares representing 100% also creates that feeling of a group and actually is a very subtle humanizing factor as well.

Pavithra Rajesh

Leave a Reply

Your email address will not be published. Required fields are marked *

Get the latest from Storybench

Keep up with tutorials, behind-the-scenes interviews and more.