Unquantifiable

This project is a collaboration with Cara Peralta-Neel, it consists on a data visualization around the topic of the Immigration Policies under Trump’s administration and its psychological effects on children and adults that are being separated in the border.

The problem

This project is a critique about the fact that some of the data is not being collected in an ethical way and also how the poor IT techniques are affecting the families that are currently being separated in the border. The main goal for the final project was to do a data critique so we decided to focus on displaying visually the way that some data is quantified, and at the same time to generate a contrast against those stories that can’t be quantified or represented by numbers, however the words are what makes them have an impact. With this project we are trying to answer, what is quantifiable? And especially, what happens with the data that doesn’t make it into a spreadsheet or a report? How might we visualize data that is unquantifiable?

Coming up with a solution

Ideation:

The process begun by establishing certain charts that we wanted to use in order to display specific data points that we found online, we knew that we wanted to accomplish a “Scrolytelling” look and feel and we wanted to divide the experience between the data that can be quantified and the data that can’t.

In the development process the first step was to create a shared collaborative document in which we could document our research and divide the information between the desired charts.

Being able to do this collaborative research process enables us to find news sources individually and then get together to discuss them and start trying to find ways to visually represent this information.

Visual Design:

In the design process I created a sketch file in order to translate the content into a visual representation so that we could try to accomplish the front end following the visual structure that I defined in a static wireframe developed in Sketch.

One of the first versions of the wireframe is displayed to the right, it was important for us to have the freedom to sketch and propose interesting and interactive ways to display the information that we had already decided we wanted to show.

In this proposal we were focussed on displaying different data points and making them all have a very representative visual language, however, during the development phase we decided that we wanted to focus only in one data point and be able to capture the user’s attention by reducing the complexity of the quantifiable data and bringing more attention to what we called the “unquantifiable” data, in this case, stories and phrases that we gathered from different news sources on the internet.

Front-end development:

The last phase of the project was to develop the front-end and actually code the website. Since we decided to use d3.js and neither of us was an expert on it, we had to cut back on some of the charts and implement a simplified version but always keeping the concept of dividing the quantifiable from the unquantifiable (which we decided to display as stories or quotes).

The coding process was done between both Cara and I by doing peer programming, we met multiple times and coded together, sometimes one will lead the computer while the other would observe and vice-versa, which allowed both of us to understand and learn a lot from the code.

My Role:

I focussed my efforts on creating the visual design, the information architecture and dividing the data into charts on a way that was easy to understand by the users. I also participated in the development phase by peer programming alongside with my teammate.

The Result:

The final result is a scrollytelling data visualization that displays the information when the user scrolls down, the data was divided in two categories, the one that can be quantified is displayed in a chart that uses rounded rectangles as data points and the second category is the unquantifiable data that is displayed as text and quotes from news articles from the internet.

visit website

View Code

Sources:

https://sph.umich.edu/pursuit/2018posts/family-separation-US-border.html

https://www.apa.org/news/apa/2018/border-family-separation

https://www.latimes.com/science/sciencenow/la-sci-sn-separating-children-psychology-20180620-story.html

https://www.newyorker.com/news/q-and-a/how-the-stress-of-separation-and-detention-changes-the-lives-of-children

https://www.pbs.org/wgbh/frontline/article/children-separated-from-their-parents-at-us-mexico-border-showed-increased-signs-of-post-traumatic-stress-us-report-says/

https://www.cbsnews.com/news/faces-of-family-separation-cbsn-originals/

This project was developed as part of my Data Art class during my third semester at ITP NYU.