k
She Should Run

In November 2016, we created First of Her Kind, a poster celebrating the 100th anniversary of the first woman to be elected to Congress and the first 94 women to be elected as Senators, Governors, and Representatives for each state.

Through organizations like She Should Run, we’ve seen an incredible increase in women running and being elected to office since the 2016 presidential election.

We’re honored to be included in this year’s She Should Run holiday gift guide. To support their mission of providing networks and resources for women to organize campaigns and run for office, we’ll be donating the proceeds of our poster to them.

You can read more about the inspiring women featured in First of Her Kind on our blog. We look forward to more women in office and to needing to update our poster as frequently as possible in the years to come.

k
Guest Lecturing at Harvard CS 171

Last week Mark and I had the opportunity to be guest lecturers at Harvard’s CS171 Data Visualization course. It’s always great to be able to get out of the office to talk with people about the work we’re doing.

The CS171 course focuses on data visualization theory and covering a lot of ground in terms of learning to program and the basics of interactive visualization. We like being able to guest lecture for this course because we always hear from students afterwards that they enjoy being able to see how what they’re learning can be used outside of the classroom. Afterwards, students still had some commonly asked questions, so we thought we could answer some of those here.

Where do you find data?

This is a question we get a lot, and unfortunately there isn’t an easy answer. With our client work, they’re generally the ones providing the data, but with our curiosity pieces, the data is often sourced ourselves or even self-generated. For Scaled in Miles, Mark was interested in Miles Davis’ career and found a database of all of his recording sessions and collaborators, which became the main data source for that project. For Rocky Morphology, James watched all of the Rocky movies and recorded – by hand! – what type of scene was going on at every 1 minute interval. (He did this without telling us, otherwise we probably would have built a simple tool!) The USGS and NASA are great resources if you’re interested in earth science data. The UN and World Bank provide lots of interesting global data (which is where most of the No Ceilings data comes from), and the U.S. Census is obviously a key resource for U.S. data. Don’t be discouraged if you’re having a hard time finding data you want to work with. Unless someone is providing you with data, it can take some digging to find an interesting data set to explore.

You don’t seem to use D3. What tools do you use?

For our initial explorations and desktop applications, Processing is our go-to tool. (Ben is still its primary developer, and many of its features exist because he wanted them for his own projects.) Once we’re done sketching with Processing, we might port to JavaScript (if it’s a web piece) or deploy the application to another environment. For instance, we might build an installation on here using mostly Macs, and then run it on a Windows machine for the actual installation.

For the web, we stay away from visualization libraries because our job is to provide bespoke ways of looking at data, which often makes using a library more of a hindrance than helpful. (Another way of thinking about it is that visualization libraries rarely solve the things that actually take the most time for us.) Primarily, we write our projects from scratch in JavaScript and include the typical UI libraries (JQuery/JQueryUI) when useful.

For analysis and data-wrangling, we often turn to Python. We also do a fair amount of server-side work with Python, sometimes Node, and even a little Java.

We try to use whatever tool best suited to the job, and makes us most efficient, often employing many different tools at various stages. The No Ceilings project, for instance, started with a custom-built tool created with Processing. That tool helped get a sense of what was in the quarter million rows of data, and once we found something interesting, that was exported to Excel, which was used to generate charts and short write-ups that were delivered as PDF documents. The final site uses a lot of JavaScript, but also D3 for a piece or two, and even three.js for a 3D globe for mobile devices.

What are the differences between using D3, p5.js, and Processing?

D3 is primarily a data visualization library. It is great for getting a quick view of your data and we’ve used it here for just that on many occasions.

Processing is a part language, part library, part environment, and often used for creative coding. The main version is Java-based (as a “language” it’s sort of a dialect of Java), so the work you create with it is not readily usable on the web. However, it has a lot more juice than your browser, so when you’re working with large datasets, it can make those initial iterations happen a lot faster. It also can export out to PDF, which makes it great for creating the data-driven pieces of any print work you may want to do.

p5.js is a project that builds on the ideas of Processing but rethinks some of its base decisions for the web. Primarily, it can help simplify the process of writing HTML5 canvas applications. It’s a great starting place for learning to code in general (it’s what’s used by Khan Academy, for instance), but it’s also helpful when you find yourself editing a D3 example so much that you’re writing more code to change it than the example itself. When you get to that level of customization, p5 and the HTML5 canvas can be your friend.

Are you hiring? What do you look for in a candidate?

Yes! We are always looking for curious, driven candidates. We are not looking for someone who can “do it all,” but people who can think creatively about how to apply their skills – whether that be coding, design, writing, or managing – to the work we do. We also have internships throughout the year. If you want to learn more, check out our careers page.

Related posts
MIT 4.s02: Information Design
Girls Who Code
MIT 4.s50: Information Design
k
Processing Community Day

Just a few weeks ago was the first ever Processing Community Day. As volunteers and attendees, we were lucky enough to be able to watch inspiring community talks, see new and old faces, and present our own work. In this post, Danielle and Olivia reflect on their experience.

After having a wonderful time volunteering at Scratch Day last year, Olivia suggested we should plan a similar event to celebrate the Processing community. Processing users have grown rapidly since its beginning in 2001, but there has never been an officially organized in person event. It was fitting then for the theme of the first inaugural Processing Community Day to be “convening for the first time.”

Organized by Taeyoon Choi, co-founder of the School for Poetic Computation in New York, over two hundred attendees met at the MIT Media Lab on October 21st to hear talks, demo projects, and participate in workshops by the Processing Foundation and Fellows, students, teachers, artists, and members of the Processing community. It was exciting to see people meet who shared an affection for Processing, and learn about the different ways it has been a part of their work – from engineering to art, from music to teaching.

One of our favorite talks was by Claire Kearney-Volpe and Mathura Govindarajan from NYU Ability Project. They spoke about their work using p5.js to create code “readers” and other programming tools for people who are visually impaired. Although p5/Processing is primarily a coding language for visuals, this work shows how it can be used in non-traditional applications as well. Because our work at Fathom focuses on accessibility through the means of visual presentation, it was a good reminder of how we might think about understanding data and information accessibility in other forms, and what those tools might look like.

Another one of our favorites was by Sharon De La Cruz, artist and educator at Princeton University. She spoke on taking ownership of feeling vulnerable in her work and art practice, in other words being comfortable being uncomfortable.

There were also tons of great cross-disciplinary speakers during the community lightning talks. Ari Melenciano is a multi-disciplinary artist who spoke about the importance of representation, and how she combines creative coding, music, and building her own musical instruments. Rosa Weinberg showed projects from her work at Nuvu studio and how she pushes students to think outside the traditional forms of engineering. Since we can’t highlight everyone, you should check out the post here to learn more about all the community speakers we had.

Another highlight was seeing demos of work in person that we had only seen online. Freeliner, a program made in Processing by Montreal-based artist Maxime Damecour, traces drawn lines and shapes with light projections in real-time, creating an interactive light installation on any blank surface with a marker and projector.

We’re thrilled to have seen many old and new faces at the first Processing Community Day, and we’re looking forward to the next one!

— Danielle and Olivia

k
MIT 4.s02: Information Design

Last month, all of us here at Fathom were busy wrapping up 2016’s projects, not the least of which was our second consecutive semester teaching Information Design: Exploration, Navigation, and Understanding.

In its final incarnation before being integrated into MIT’s D-Minor curriculum as a required course, the Fall 2016 section was taught as a graduate workshop. Just like last semester, we had a diverse group of students from the Media Lab, Computer Science Department, SA+P, and the Sloan School of Management, and we divided the semester into four main projects, each of which covered a different aspect of the subject material:

  • introduction to design and p5.js with clock faces
  • context of use with a weather application for mobile
  • finding a story within census data
  • tying everything together with a “choose your own adventure” final project

These assignments run the gamut from very directed at the beginning of the semester to very open-ended at the end of the semester. The census and final projects consistently reveal that some students thrive in the open-ended environment, while others struggle to find direction and manage their time. However, regardless of their learning style, all students deserve the support they need to learn effectively, so this Fall we began exploring different ways of guiding the students through the course and projects. Although the final deliverable for each of the assignments was largely the same as last semester, we directed the students in a different way. This provided them with a bit more support, and gave us the opportunity to focus on the didactic qualities of process and iteration. To demonstrate, here’s the evolution of one student’s final project, from conception to completion over the course of six weeks.

Xinhui Li (final project)
Xinhui Li (final project)

During the first week, Xinhui Li, along with the other students in the class, settled on a project idea and story. This semester, we asked the students to identify four candidate datasets that they would like to use, one for each of the following categories:

  • Personal: some type of personal data that you’ve collected
  • Research/class: information design questions around your research, other classes, or thesis
  • Explanation: a complex idea that’s data-centric, and make sense of it
  • Curiosity: finding a data set that you think is interesting, and telling us a story about it or providing people with a way to explore it

This helped students fully consider the story that their final project would ultimately tell, without becoming overwhelmed by the coding challenges. Xinhui suggested using her Hubway activity for the Personal dataset, land reclamation projects in China for the Research dataset, topics surrounding national unemployment in the US for her Explanation dataset, and transportation habits in a sharing economy for her Curiosity dataset. After presenting her ideas and gauging interest from the other students and instructors, she decided to pursue the topic of land reclamation in China.

Once students had decided on an idea, they were given a week to collect and parse data. Data parsing is a challenging, but extremely important, aspect of information design, and we again wanted students to focus on this crucial stage of their project without being distracted or overwhelmed by the other stages. Xinhui’s first p5.js sketch didn’t actually draw on the canvas at all. Rather, it printed to the console to demonstrate that her program could load and internally represent the data she wanted to use.

XinhuiParse

The next two weeks were spent creating an initial visual representation of the data. At this point, we asked students to provide paper sketches alongside their code, to encourage them to occasionally step away from the computer and consider the overall design and ultimate goal of their final project. After Xinhui sketched out her visual ideas on paper, she had a template she could follow to guide the layout of her first p5.js sketch that used the canvas.

The initial representation demonstrated Xinhui’s ability to incorporate the map, data, and icons that she had gathered for her project, but there were a lot more refinements that could be made in the two weeks before the assignment was due. At this point, we began to shift our focus toward design and interactivity, helping students refine and iterate on their initial representations.

Xinhui’s second design iteration implemented the timeline that she had drawn in her paper sketches, added a title to give the piece some context, and changed the scroll behavior so that the map always remains visible in the browser window.

For her third iteration, she implemented more of the functionality from her paper sketches, adding satellite images and detailed information about each item in the list. Demonstrating her understanding of hierarchy in information design, she designed the list items to be expandable and collapsable, so that the user only sees detailed information when it’s relevant. She also included a legend that reveals at a glance the intended uses of the various land reclamation sites.

XinhuiFinal3

Between the third and fourth iterations, Xinhui implemented animated transitions to further refine the user experience, redesigned her legend so that it makes better use of the space she has available, added a description of her project beneath the title, and made the list sortable so that users can browse the data more easily.

You can see Xinhui’s final project here, and a gallery of student projects here.

k
Charlie on the MTA

Fathom is excited to have Charlie on our team as an intern for the semester, here from the University of Connecticut. Coming from a journalism and radio background, we asked him some questions about what brought him to Fathom and his memories of his first concert (among other things).

_mg_1424-e-crop

How did you become interested in data visualization?

I made my first data visualization while I was interning at WNPR public radio in Hartford, Connecticut. I had recently switched my college major from biology and pre-med to journalism, and I thought I wanted to be a public radio reporter. Since I knew a bit of programming, I would help out with web tasks at the station when I had free time. I decided to teach myself D3.js, and ended up really liking building data visualizations. I think it’s kind of funny that my internship at a public radio station ended up pushing me to do something other than radio!

How do you like being in Boston so far?

I love it! Being in a city is a welcome change after two years in Storrs, Connecticut. Don’t get me wrong, Storrs is beautiful and I love UConn, but the thrill of passing farm animals as you walk across campus wears off fairly quickly. I grew up much closer to New York and I’m more familiar with that city, so I think I came to Boston expecting to still like New York more. I have to say that I’ve been pleasantly surprised. Lots of great food and cool neighborhoods that are easy to walk around.

The title for this post fits well because I loved the MTA song when I was little. Fortunately, I haven’t been trapped on the MTA yet, though it does sometimes feel like it when I get stuck behind a disabled train on the way home from work.

What do you enjoy most about working in journalism?

I think the best thing about working in journalism is that it forces you to constantly learn new things. I’ve written stories on topics like coastal erosion, brownfield sites, and a fight between Yale and UConn in the late 1800s. I didn’t know much about any of those things when I decided (or was assigned) to write about them, so it forced me to read and learn about things I might not have focused on otherwise. I also like the way reporting lets you to meet people and go places. I’ve had the opportunity to report from remote barrier islands off the coast of Louisiana, interview people in costume at a Connecticut comic con, and spend a day with a competitive lumberjack team.

What was your first concert?

The first time I remember actually going to to see music (as opposed to playing on the lawn with friends) was when I was eight or nine. My dad took me to see a band called Zox, which I guess you could describe as ska music with a violin instead of a horn section. A few years ago I realized that the concert was actually held in the auditorium of the high school in the next town over, which was weird because it definitely felt much cooler at the time.

After that I saw Creedence Clearwater Revisited, which is sort of a Creedence Clearwater Revival cover band, except with the original bassist and drummer. Let’s be honest—having the original bassist and drummer doesn’t mean a whole lot. Things got better the next year, though. I got to see the Rolling Stones with Kanye West as their opener. I don’t think I was old enough to fully comprehend how cool that was, but it was awesome nonetheless.

Founded in 2010 by Ben Fry, Fathom Information Design works with clients to understand complex data through interactive tools and software for mobile devices, the web, and large format installations. Out of its studio in Boston, Fathom partners with Fortune 500s and non-profit organizations across sectors, including health care, education, financial services, media, technology, and consumer products.

How can we help? hello@fathom.info.