Wedding Data Viz: How We Designed for Feelings
Written by Amy Cesal and Zander Furnas
When you meet your spouse collaborating on data visualization, you sort of have to make data viz part of your wedding. At least, that is how we (Amy Cesal and Zander Furnas) felt. We met at the Sunlight Foundation and quickly found our groove working on dataviz projects together. When we started, Amy was a designer who quickly learned to ‘speak developer’ and interact with the data folks in the organization (she has since gotten an M.A. in Information Visualization), and Zander was a quantitative social scientist (he is currently pursuing a Ph.D. in Political Science).
Collaboration has been a central part of our relationship as it evolved from coworker, to friend, and ultimately life partners; and it was a real joy for us to collaborate on some wedding data viz for our big day.
We had a few goals in mind when we began brainstorming ideas for our wedding viz. We wanted the visualization to:
1) Serve as conversation pieces or icebreakers for our guests,
2) Be personal artifacts of our relationship to the people important to us,
3) Show off our skills to family or friends who don’t always understand what we do.
Wedding Guest Badges
The first thing we settled on was making guest badges that would function as name tags and conversation starters. Here, we were inspired by Georgia Lupi’s abstract Chernoff face-esque badges from Eyeo festival last year.
We decided on a simpler design because our audience (wedding guests) were less likely than Eyeo attendees to be comfortable with complex multivariate visualizations. For our guest's badges we focused on two characteristics:
- How long each of us had known the guest,
- How we knew the guest.
Because this differed for each dyadic relationship — (Amy, guest), (Zander, guest) — the result was four variables to visualize for each guest. Our data looked something like this:
That meant that we had two ratio scale variables (how long Amy and I had each known the guest) and two categorical variables (how we each knew the guest) to visualize.
We decided to make each relationship one lobe of a heart, with the size of the lobe indicating the length of the relationship and the color of the lobe indicating the type of relationship. The left side of the heart corresponded to Amy’s relationship to the guest and the right side corresponded to Zander’s relationship to the guest. We settled on a set of seven categories to classify how we knew our guests. The key for the visual, which we displayed at the wedding, is shown below.
If we had been interested in making a strictly informative graphic, the heart shape would have been an impractical, and frankly, poor choice to display this data. Comparing the size of asymmetric shapes is difficult, and it is unclear if the variable scales linearly with the diameter of the shape or non-linearly with the area of the shape.
But, we were more interested in creating a feeling. We wanted it to be clear if someone was on the bride or groom’s side and whether we had a really long-standing relationship with them or they were a newer presence in our lives. However, some level of obscurity was desirable for our purposes. We were uninterested in facilitating minute comparisons of “who has known us longer” or in representing comparatively new relationships in a way that might feel minimizing to those guests. We decided to set a minimum size for the heart lobes to make sure that the badges of guests who we had only recently met still looked fun and welcoming.
There were a few other design touches that were important to us for these badges. We used coloring and typography that was consistent with our overall wedding palette. We wanted our guest to feel comfortable wearing them with their fancy clothes, so we opted for magnetic backing rather than a pin back. Because of the magnetic backs, the badges also work as nifty fridge-magnet keepsakes.
The Creation Process
To make the badges we began by filling out a spreadsheet for all of our guests, like the example table above. Zander then tidied the data a bit (converted from wide to long) and used ggplot2 in R to make a large pdf figure of small multiples.
library(tidyr)library(ggplot2)
badge <- badge %>% gather( key ="Person", value = "Years", ZanderYears, AmyYears)badge$Relationship[badge$Person == "ZanderYears"] <- badge$ZanderRelatioship[badge$Person == "ZanderYears"]badge$Relationship[badge$Person == "AmyYears"] <- badge$AmyRelationship[badge$Person == "AmyYears"]ggplot(badge, aes(y = 3, x=Person, color = Relationship, size = sqrt(Years))) + geom_point() + facet_wrap(~name) + theme_void() + guides(color=FALSE, size = FALSE)
The result of this was a small plot for each guest labeled with their name and two dots: one for their relationship to Amy and one to Zander. The dots were sized and colored according to the data we had compiled.
Amy imported this into Adobe Illustrator and went to work. She stretched the dots into heart lobes, rotated and re-positioned them, re-colored according to our palette and laid everything out so that each small multiple could be cut out separately and made into a button.
We then printed the buttons on card-stock, cut them out with a circle cutter and used a button maker to achieve our final product. It was a lot of steps, but worth it.
Network Graph of Guests
From the beginning, we were set on the idea of making a network diagram of all of our wedding guests. We really liked the idea of a big banner that guests could look at to see who they knew, how everyone knew each other and get an overall sense of the communities that were important to us.
Additional reasons why a network chart made sense for us:
- Zander has worked with network data and visualization professionally since 2012,
- We collaborated on several network features together at the Sunlight Foundation,
- Weddings are fundamentally about relationships, and networks are the best way to represent relational data.
The wedding was about strengthening our relationship with each other and bringing people together from disparate parts of our lives. We wanted a way to represent all of this coming together and connectedness visually.
To do this we needed to make a spreadsheet of who knew whom at our wedding — not just who knew which of us, but whether they knew each other. With 125 attendees that meant that there were 15,500 potential dyads [a dyad is a pair of connected people in a social network]. Going through these one by one and trying to remember if those two guests in fact knew each other or not seemed like a daunting task (especially since we had so much other stuff on our wedding to-do list!).
We opted for a slightly less accurate, but much easier solution: we created an affiliation graph, in which each guest is tied to a group of people within which we assume everyone knows each other.
For example, Zander’s Dad might be included in the following groups with the assumption that he would know everyone in each:
- Zander Immediate Family
- Zander Dad Family
- Zander Mom Family
- Zander Family Friend
- Zander Childhood Friends
- Amy Immediate Family
We then created a network connecting the guests to each other based on the assumption that everyone tied to the same group knew each other. This involves a bit of simple matrix math on the network data which you can read more about here.
That process gave us rough edge-list — a network data structure which simply lists all of the edges (connections) in the network as dyads (Person1, Person2) — of about 1,300 connections. We went through this list by hand deleting and adding connections that our first approximation did not capture. We added in weights to these edges, so that connections would appear stronger between parent-child relationships, siblings and couples.
After the data creation and cleaning, Zander toyed around with a variety of layout algorithms and display options in Gephi (a GUI network visualization tool). Network layout is essentially arbitrary; there are innumerable algorithms and the position of each node (circle representing each guest) is a function of how the algorithm interprets the network rather than an intrinsic property of the graph structure. The goal is to create a visualization that highlights the aspects of the structure that the analyst wants to make salient — so we felt free to tweak this to our specifications.
We wanted the Amy and Zander nodes to be central and prominent, wanted to keep family and social groups together, and, importantly, didn’t want guests that only knew one or two other attendees to be forlornly stranded out by the edge of the graph. Again, we didn’t want to make anyone feel like they didn’t belong! Good design thinks about context, and weddings are a particular context.
Ultimately, Zander settled on the Force Atlas 2 layout algorithm (PDF) and then manually tinkered with the positions to prevent overlap, increase readability, highlight some of the structure we wanted, and make sure everyone fit inside the banner layout. Zander used Gephi to export a large PDF to Amy, who went to work in Adobe Illustrator.
Amy first separated each of the components (dots, lines, names, background) to its own layer so that selecting one to change the design would be easier. She played with different color schemes from the wedding palette and increased the line weight between dots so the final product would print well.
Finally, we printed the network on a 4’ X 6’ fabric banner with seams and corner grommets through UPrinting. A call to customer service and some express shipping got the final banner to us just in time.
Next, is where our two data visualization projects came together. It is common at weddings to display name cards with seating assignments somewhere prominently so guests can grab them as they enter the reception. We had our name badges serve double duty by putting table assignments on the back with stickers. We made the circles representing each guests node on network the same size as the badges (2.5" diameter). We stuck magnets to the back of each circle on the network banner. Day of the wedding, friends then stuck the badges to the network where each guests corresponding node was. This way, the network map served as the display for badges/table assignments, and the badges served as the labels on the network diagram.
We decided not to print the names on the banner because it felt like too much information. In retrospect, we think names would have helped the network graph be more interesting after guests removed their badges.
Concluding sentiments
This project was a lot of work on top of the already full plate of planning a wedding. At one point, while he was hand generating network data for the second or third time, a mere two weeks prior to the wedding, Zander definitely questioned our sanity and decision-making. But we are so glad that we did this. Our guests had a blast, almost everyone wore their name badges, and it made our wedding unlike anyone else’s.
The name tags were a nerd viz delight — each a position fixed as if by sextant to the stars of the wedding, and a worthy reminder that the quantified life doesn’t end at the skin.
— Dave (one of our lovely guests)
We love having that now we have these artifacts of connection and community that we created together. As our officiant noted:
There’s an incredible thing about a wedding. All of these people are here because we love you, we support you, we’re rooting for you, and we’ve got your back.
We are ordering a large format canvas print of the network graph to hang in our home, a constant reminder of the community of love and support that gathered around us to celebrate our love.
