ABORTION DATA IN ILLINOIS - Interactive Graph
Our interactive graph presents the change of abortion counts according to age from 1995 to 2012. View Code.
My Contributions: Wireframe with Axure, interactive graph using d3
Objective
This visualization aimed to convey the shifts in distributions of the number of abortions in Illinois per age group, year to year. Our intention for this graphic was for people to explore various years and think about what kind of factors would influence shifts in counts per age group every year.
Process
We looked at two ordinal variables, age and year, presented with a series of bar graphs.
The choices made when creating this graph were based on Kosslyn’s (Kosslyn, 2006) principles and Yi’s taxonomy (Yi et al., 2007).
Kosslyns’ principles are grouped by three main goals:
Connect with your Audience
Direct and Hold Attention
Promote Understanding and Memory
For Yi’s taxonomy, we had two fully supported interactions:
Explore
Abstract/Elaborate
Wireframe
We first created a visual representation of what the graph would look like using Axure. This gave us the chance to make visual representation of the graph discuss how our graph and interactions follow Kosslyn’s principles and support Yi’s taxonomy.
Analysis: Final graph
Goal 1 : Connect with your audience
Given the prevalence of abortion rights in the contemporary political arena, this data held a strong ethos at the time of this project. The assumption that we held for people viewing this data is that they were largely unfamiliar with the age distribution of abortions in the state of Illinois. A technical assumption was that they would be able to comprehend that the data points carried relative heights, and that they could notice the y-axis changing.
Goal 2: Direct and Hold Attention
Reducing the number of visual elements on the page supported a simple aesthetics: directing focus to the information present on the page. Since the dropdown containing the year variable was a primary control for the interactive visualization, the placement underneath the narrative about the graphic aimed to drive the viewer towards exploring the dropdown. The subsequent changes in the graphic that result from the year variable were noticeable due to the subtle animations in the graph, as opposed to instantaneous changes. This aimed to encourage a degree of playfulness, with the hopes that the viewer would decide to view several years’ data.
Tooltips carry an orange border stroke, which opposes the blue found on the graph’s bars. The complementary color pallet helps call attention to the tooltip and reinforce interactivity across the graph.
Following conventional grouping laws, we separated the bars in the graph enough to show that there was no continuation between their corresponding data; each age range stood independent from one another. Though none of the age ranges have any affect over one or the other, we did still keep all the bars the same color because they represent similar data types and carry similar units.
Goal 3: Promote Understanding and Memory
An individual’s ability to take in information at any given time is inherently limited. Our data presented 162 data points (9 age groups * 18 years), which were sequential across the 9 age groups; this arises our design challenge, one of our primary goals was to show how the relative proportions of the distributions changed over time.
Offering the information one year at a time mitigated information overload, in turn, preventing the viewer from going past their processing capacity. The added interactivity provided light animation to demonstrate the changes in relative counts from year to year, supporting recognition over recall. Adequate axes labeling further reinforced the information’s context.
The potential drawback of the interaction patterns in this visualization was the lack of option for the user to directly compare two or more particular years side to side.
Types of Interactions
Supported Interactions
Explore. The dropdown control encouraged viewers to explore certain datasets from different years.
Abstract/Elaborate. The viewer was able to look at the data in a more general sense by selecting the overall average from the drop menu. Discrete data information was available through tooltips, which could be summoned by hovering over specific bars. These tooltips would change between years and allowed users to view exact values.
Partially Supported Interactions
Connect. When changing between subsets of the data the graph animates from one graph to the next, illustrating the change between those two specific years.
Filter. Each year could be classified as a “filter” for data, since each year carried discrete sets of values for each age range.
Not Supported Interactions
Select. There were no annotations available on the graph.
Reconfigure. Controls do not shift the data representations.
Encode. Axes labels and units remain the same.