Joe Hines Makes Stuff
Designer + Maker
Access Splash.png

Access

 

Access

 

 

ACCESS

A data visualization exercise exploring the relationship between a neighborhood's economic makeup and access to transportation.

 

 
 
 

PROJECT DETAILS_Access is a visualization exercise that looks to illuminate connections among data in ways that help viewers recognize, engage in, and think critically about their important relationships. Focused specifically on unpacking the relationship between economic status and access to transportation in the Pittsburgh Metropolitan Area, Access exists as a proof of concept for how to begin to communicate complex information and patterns.

TEAM_Joe Hines - Communication Design Studio

TIME FRAME_3 Weeks

METHODS_Excel, Sketch, Illustrator, Principle

 
 

 

How does a neighborhood’s economic makeup and population align with access to public transportation?

 
 
 

 
 

PROCESS + IDEATION

The development of Access relied heavily upon a user-centered and iterative design process. With the sole intention of making previously undefined relationships evident to users, the visualization utilized visual and temporal representations of the gathered data.

 
IMG_6829.png
Access_Process.png
 

PROCESS TIMELINE

The development of Access relied heavily upon a user-centered and iterative design process. With the sole intention of making previously undefined relationships evident to users, the visualization utilized visual and temporal representations of the gathered data.

 

 

THE DATA

In an effort to begin to answer my research question I gathered relevant data from the venues represented below. Using Data.Gov as a resource for recent census information surrounding population numbers and the Western Pennsylvania Regional Data Center for median income by neighborhood. All data surrounding the existing transit system was derived from Pittsburgh Port Authority resources. 

 
 
datagov.png

2010 Census Data - Population

2010 Census Data - Median Income

PORT.png

2017 Transit Map - Existing and Planned Lines

 

 

THE STORY

In order to help viewers of this visualization enter and move through the content, I established a linear story that slowly builds on layers of information. Giving viewers the opportunity to think critically
about the relationships being presented to them.

 

 
 

00. INTRODUCTION + QUESTION

The introduction screen serves as a tool to frame the information that viewers are about to see in reference to one overarching question.

 

 
 

01. PITTSBURGH

The first stage of Access, Pittsburgh, gives a geographical context to the the viewer. Thus grounding the information that will be represented in later stages of the visualization.

 
 

02. POPULATION

The second stage serves as a means representing population data by neighborhood within Pittsburgh. This is achieved through the use of a dot pattern that varies in density. In order to reduce complexity, the population data was broken up into three categories, low medium, and high population. Doing so allows viewers to draw conclusions about the data without needing to convey the exact population numbers.

 
 

03. INCOME

Much like the population data, the median income data was divided into low medium and high categories. But rather than relying on patterns, the levels of median income we communicated using three shades of green overlayed onto the dot pattern. However, the combination of these two layers can be difficult to read at times and presents an opportunity for further refinement.

 
 

04. TRANSPORTATION

The transportation layer is communicated using a literal overlay of the existing and proposed transit infrastructure within the city. Although this layer reveals dense pockets of infrastructure that exist within the system, it can be difficult to read all at once. To combat this, hover-states were integrated into the visualization, allowing users to hover over a neighborhood to see which transit lines come in contact with it.

 
 

05. COMPARISON

The stage allows viewers to select two neighborhoods within the city limits in order to make direct comparisons. By displaying the precise data that feeds into the visualization viewers can begin to draw conclusions about the information they are seeing.

 
 

06. SUMMARY

This final screen serves a reinforcement tool, prompting viewers to reflect on the information they have just seen. Doing so, allows the viewers to keep exploring using the comparison tool, or start from the beginning of the visualization altogether.

 

THE INTERFACE

The interface of the visualization is designed to contunally reinforce the linear nature of the story being presented to the viewer. Relying on a timeline and forward and back buttons to allow users to progress through the various stages of tool. 

 
 
Access Breakdown v2.png
 
Hoverstate.gif
 

HOVER STATES

The visualization relies heavily on the use of hover states to reduce the complexity of the information being represented. Once a user hovers over a neighborhood, only the graphical information relevant to that neighboorhood remains on screen. Additional information regarding the supporting data is presented to the viewer within a modal.

 

 
 
 

PROCESS BLOG

A blog post detailing my process working through the data visualization exercise.

medium.png