August 26, 2015

Written by:

Topics:

In honor of Women’s Equality Day, we released a new No Ceilings visualization exploring how disparities in wealth engender gaps in primary school completion. Girls from low-income households are often at the greatest disadvantage in their access to basic education, most predominantly in Middle Eastern and African countries. For all of the inequalities that exist in the U.S. school systems, there are millions of girls around the world who don’t have the opportunity to graduate elementary school, let alone attend it.

In Yemen, a country with one of the greatest educational disparities between genders and income levels, just one girl for every five boys in the lowest income group finishes primary school. The gap widens when comparing between Yemeni girls: seven girls from the highest income group complete primary school for every one girl at the lowest. The academic outlooks, career goals, and familial health of girls from low-income households will all suffer as a result.

While yes, the disparities in primary school enrollment are closing, many schools experience a large drop-off by the time students enter secondary school. Gender bias and cultural norms, in addition to economic disparities, often hinder students from making the transition, regardless of the policy protections in place.

Take a look and spread the word. We can’t change the numbers unless we know them.

August 17, 2015

Written by:

Topics:

As anyone who has recently taken a road trip can attest, there are a lot of places in the United States with very distinctive names. Many of us at Fathom are fascinated by geography and the subtle oddities around us, so it seemed only natural we create Place Poetry. The playful mobile application enables people to arrange strangely named cities into poems, while simultaneously plotting the location and distance of their journey.

phonepics_blog_final_larger

The United States has the third-largest area of any country (second only to Russia and China), and as pioneers expanded outwards, many places were in need of names upon settlement. Some places were named after preexisting locations in Europe and around the world. Others were named after powerful leaders – kings and presidents, local mayors, and often for the founders themselves. Many place names across the United States are vestiges of the native cultures stamped out or displaced during colonization. Towns were also named after nature, colors, weather, famous authors, and relative geography. Yet with all these common themes to pull from, some town founders went above and beyond.

icons_forblog

When Ben created his original zipdecode project, he worked with a list of every uniquely-named town in the United States. This list contains 19,053 names, and provided the framework for Place Poetry. Many names on the list are highly inventive. Some names tempt fate (Waterproof, Smackover, Tornado) while others are seeped in vanity (Superior, Radiant, Cashtown). Some places reflect a founder’s disregard for the town (Blowing Rock, Hurdle Mills, Idiotville) and others leave you wondering how it was that such a name came into use (Bitely, Peculiar, Cut and Shoot, Oblong).

We narrowed down the original list of names into a select set of favorites, and sorted them into thematic categories. As these words are dragged from different bins into the composition space, the city’s location is plotted on a map. When the poem is complete, the author can see how many miles long his or her poem runs, and can also share it on social media or via email. Take a look, share a poem, and may your inner poet flippin zap peculiar aromas.

Note: Place Poetry is built for mobile devices, so please visit placepoetry.us on your phone or tablet!

August 12, 2015

Written by:

Topics:

We’re excited to announce the launch of the Fathom Watch Faces, a collection of interactive watch face designs for the Android Wear collection, which is part of Google’s Android Experiments. The experiments are designed to bring developers together on a common platform to push the capabilities of Android tablets, phones, and watches. We focused on using the internal components of the watches, such as their accelerometers and pedometers, to create delightful user feedback at every glance, and to really explore the information people can gain from a wearable device attached to their wrist.

Given our previous work with activity tracking, we wanted to use the project to explore the role of wearables—specifically watches—in giving people useful information throughout the day. We played with the balance of information a user can gain from a watch, and looked at the stories they might learn from quantifying elements of their day-to-day. The designs we landed on experiment with ideas of activity tracking, play, and self-awareness.

 

Coubertin Rings
The Coubertin Rings watch face motivates users to improve their daily activity. The model uses built-in sensors on the watch to display playful interactive rings that represent daily step counts. As users hit step milestones, the rings get bigger, change color, and scale up to quantify higher step counts (e.g. 10 steps, 100 steps, 1,000 steps). Splashes of color reward users for achieving certain levels, and motivate them to get to the next ring,

Paying homage to Pierre de Coubertin, the father of the modern Olympic Games, the watch references the rings of the Olympic logo which was designed in 1912 by Coubertin himself. The Olympics are a symbol of goals and achievements, and the Coubertin Rings watch face is meant to promote daily activity performance.

Pierre de Coubertin, 1925

Bouncing Isaac
Inspired by light and physics, the Bouncing Isaac uses the watch’s built-in sensors to display playful, interactive, geometric patterns and colors that change throughout the day. As users move their wrists, various color patterns and forms emerge. The background color changes every hour, and the triangles are based on a sliding spectrum of highly saturated colors. The colors overlap one another as the leading point of the triangle hits one of the walls of the watch face.

The watch design pays tribute to Isaac Newton’s laws of motion and his experiments using a prism to refract white light to create a spectrum of color.

A portrait of Isaac Newton in 1689

Gaze Effect
The Gaze Effect watch face displays mysterious eyes that gaze back at users when they look at their watch. The more they check their watch, the more the eyes look back. In the later hours of the day, the eyes grow tired, and they move and blink less. At special times throughout the day, the eyes get especially eerie.

The design alludes to Jacques Lacan’s psychological term “Gaze,” or the realization that we are objects being looked at just as an inanimate object can be looked at. The Gaze Effect watch face is a quirky reference to self-awareness, and our relationship to personal devices and time.

French psychoanalyst, Jacques Lacan

The Android Experiments are open source, and the code for our watch collection is available here. We hope the source code makes it a little easier for others to get up and running with watch development, and acts as an example for using watch sensors.

Hardware and software are changing so quickly for wearables, which made the project feel like an introductory test-run. At this early phase of wearables, we designed to the limitations of the hardware. A year from now, the design considerations will change drastically. With the potential for improved battery life, faster processing power, and new user interfaces, this project will have an entirely new set of design guidelines. Regardless, working on the experiments at such an early phase enabled us to see what the watches are capable of, the subtle differences in each model, and the ways users can gain personal insight from wearable devices.

August 07, 2015

Written by:

Topics:

I found Fathom through a data visualization course at college that was taught by a statistics professor, so my first exposure to information design was through the lens of statistical analysis. I spent most of my time in that class making sure the data was not misrepresented, and working through particularly challenging pieces of code. The more complicated the analysis or the code, the better I felt about the project, and I wanted that complexity to show in my end product. If the code worked and did something cool, then I was happy.

Contrary to what Twitter suggests, I learned more this summer than just how to use a hammer drill. A couple weeks ago, I showed James some slides from a presentation of my work this summer. One of his initial comments was, “This needs some design love.” I had sort of known that, but it hadn’t felt like a priority to me. I was just trying to produce the necessary content clearly. For James, design is an integral part of any work. As a newbie to design thinking, this was one of the moments that started changing how I evaluate my work.

A comparison of my slide on the right to James's more elegant version on the left.
A comparison of my slide on the right to James’s more elegant version on the left.

When I started work at Fathom in June, I was immediately struck by how different the work flow is from the environments I was used to. Instead of focusing on the technical or analytical side of information design, the big questions were always design ones: Who is the audience? What are they most interested in? How can this tool be more intuitive for them to explore? And most importantly, what is the story in the data? I had never thought about conveying data as storytelling before. Handling data was always fairly black and white to me; you look for an answer in the form of evidence to prove your hypothesis true or false. Information design at Fathom isn’t like that. The process obviously still involves rigorous exploration and analysis of the data, but it’s focused on allowing humans to navigate the data with ease.

Thinking of information design as storytelling was huge for me. I was originally drawn to computer science because it felt similar to creative writing; it’s the same sort of creation, just writing in a different language. Code produces apps in the same way that sentences conjure images. I have often thought that I should apply the same rigorous logic used in coding to writing essays, and now I am realizing that the creativity and insight involved with writing should also transfer to my code. Just as nobody wants to read a book with non-stop action and no plot, nobody gets anything out of a bouncy technicolor bar chart.

Growing up, my English teachers told me not to use contractions in my writing, so I was surprised when my English professor last semester went through my first short story and contracted words wherever appropriate. I had been blinded by what I thought was a “rule,” when in reality the lack of contractions sounded unnatural for the characters and was distracting from the story. Similarly, I realized that my instincts to follow statistical “rules” would overwhelm many users with distracting or unnecessary information, instead of empowering them to explore.

In school, my computer science classes are focused on code. The work we submit is source code, and evaluations are based more on how that code is written than on what it produces. Entrenched in the source code, the focus is on theory and algorithms. At Fathom it’s not enough to stop there. Code is a tool to create, but particularly cool or complex code should not be driving the process. The driving force is the vision of the end product, an insightful tool.

August 06, 2015

Written by:

Topics:

Last Thursday, we joined the studios of Design I/O and Sosolimited for a second annual gathering. All three teams met in Salem at the historic House of the Seven Gables, and spent the day sharing recent projects and discussing topics centered around the convergence of art and technology.

gables2

I worked on a visual identity for the conference, and wanted to develop something that combined technology and design with our location in Salem, Massachusetts. I started with sketches of bitmapped black cats, which evolved into a typeface and gifs of a cat that coughs out data hairballs and binary code. The event schedules were delivered in customized black envelopes, and the bitmapped cats made their way on to people’s name tags. This year the conference was entitled ‘DeSoFa,’ which combines the first two characters of the names of the studios.

desofa_hairball_600pxbranding

It was really interesting to see what everyone has been working on. SOSO shared their Innovation Clock with us, which sparked an interesting discussion about sifting through the noise of Twitter for meaningful dialogue.

soso

Design I/O spent an hour walking us through their interactive installation, Connected Worlds, which was recently unveiled at the New York Hall of Science. Design I/O and their collaborators created an entire digital ecosystem of an astonishing scale and scope.

io

I also really enjoyed hearing more about the Global Animal Trade interactive piece our team did for National Geographic. Though I had some familiarity with this project, it had wrapped shortly before I joined the office, and it was fun to hear the early stages of the project discussed in greater detail. A lot of the animal trade statistics were in completely different metrics, and there is no easy conversion between “centimeters of whale,” and “metric tons of caviar” – so a lot of work was needed at the outset to sift and organize the information. (Alex now has a fascinating reservoir of information on what strange and obscure animal parts are traded for even more strange and obscure reasons, which made for a very lively discussion at lunch.)

natgeo2

One of the highlights of the day was the Fast Ferry from Salem back to Boston, which was true to its name. It raced back to Long Wharf at such a fast clip that many of us were nearly blown overboard. Regardless, we clung to the rails of the prow to see the expansive views of the coastline and glowing summer sky.

boat1salem3harbor

With one more design gathering for the books, I’m looking forward to next year’s adventure!

July 28, 2015

Written by:

Topics:

Last Friday, we had a chapter of Girls Who Code, a group of 20 girls between the ages of 15-18, in the studio for a visit. They shared great tips on how a succulent garden could really liven up our studio space, and gave a convincing discourse on why the chocolate chip is superior to the raisin, but more importantly they asked tons of really thoughtful and insightful questions about our projects, process, and goals here at Fathom.

IMG_4662

Girls Who Code is a national organization working to close the gender gap in technology and engineering by giving girls the skills and resources needed to pursue opportunities in computing fields. We were lucky enough to have the group of twenty in our office. They were a bright, motivated, and making some serious headway through their summer coding curriculum.

Their visit was particularly relevant given our ongoing work on No Ceilings, which measures the progress and challenges facing women and girls around the world. As we’ve spent many an afternoon discussing explanations for the dearth of girls pursuing math and science, it was really exciting to see so many girls fired up about coding.

Thanks again to the Girls Who Code group for taking the time to swing by (and roll-y chair through) our office last week. Their curiosity, excitement, and zeal to learn code through the summer were certainly something worth aspiring towards.

July 21, 2015

Written by:

Topics:

From digging into data visualization libraries to exploring the capabilities of custom shaders, folks at Fathom are always looking for ways to improve their computing skills. This summer, several of us are learning Python.

Teaching isn’t completely new to me—I spent the last two years researching computer science curricula for kids—but leading a class full of information designers certainly is. As the Summer 2015 Python Friday instructor, I’ve been exploring creative ways to teach high level programming to Fathomites with limited formal coding experience.

Rather than focusing on how certain projects are coded up, the Python Friday lesson series takes a “bottom up” approach with a focus on combining “powerful ideas” with “language design.”

Powerful ideas are concepts that appear in many programming languages and environments, including Python. Common paradigms like conditionals and iteration, each a powerful idea, serve as fundamental building blocks of computation.

blog1

These ideas are particularly powerful in combination. For example, say we have a list of city populations. With iteration, we can do useful things like print all of the populations, sum them, or find their average. But if we add conditionals to our computational repertoire, we can solve more specific problems like printing all the populations within a certain range, finding the average population of the cities in a specific region, or determining the two cities nearest each other out of the list’s one hundred most populous.

During lessons, when we approach a new problem with Python code, we discuss which powerful ideas will be required to arrive at a solution. We also think about the scope of what is “computable” with the set of powerful ideas we’ve covered, and how they can be brought to life with Python’s syntax and keywords. By highlighting these ideas, I hope that students can use them to break down problems into manageable parts as well as recognize which tools are necessary to solve them.

blog4

The second theme of these lessons is learning to think about a programming language as the result of many design decisions. I was particularly excited about this topic because many Python Friday students are professional designers!

One aspect of programming that can bother beginners is the equals sign. “I never saw anything like x = x + 1 in my middle school math classes!” Why use an equals sign when it already stands for something familiar?

It turns out that some programming languages actually use the notation := instead of =. From a design standpoint, the additional colon helps denote that := means something different than = and could perhaps make learning programming a bit easier for first-timers. However, from the perspective of a practitioner that writes lots of code, typing := thousands of times per day is much less efficient than simply typing =. It may also be easier to read a program without hundreds of colons on the screen.

Programming languages aren’t perfect—far from it—and they aren’t very old either. By engaging with these design tradeoffs and their history, I hope to help my students become both proficient and critical programmers that view languages as systems that can be improved with their participation.

Currently, we’re four sessions deep and the Friday crew has plenty left to learn. Despite this, some of them are already realizing Python’s immediate potential as a language for writing quick programs on the fly. In the past week I’ve been delighted to see little Python projects popping up around the office (check out the Processing sketches in Python mode above!). Who knows? Maybe a student project will inspire its own blog post down the road…

July 07, 2015

Written by:

Topics:

In between the release of No Ceilings and working on Space Monkeys & Tiger Wine, I visited Kew Gardens, home to the most diverse collection of plant species in the world. While reading up on the gardens in preparation for my trip, I came upon a recent paper by four female researchers looking at the gender gap in the field of botany.

The researchers took every plant name in the International Plant Names Index (IPNI), and determined the gender of the original botanist who discovered and named each species. The results showed that while “approximately 20% of scholarly authors between 1900 and 2000 were female…female authors account for 5% of the new plant species names published during that time period.” In total, fewer than 3% of land plant species have been named and published by women.

The gender gap in botany is particularly interesting because botany has historically been seen as a “feminine” science. As noted in the paper, women’s lack — or flat out denial– of access to publication services and resources may have contributed to the infrequency of their new naming publications. Beatrix Potter, for example, was forbidden from presenting her paper, On the Germination of the Spores of Agaricineae, at the Linnean Society in 1897, since women could not attend Society meetings. The gender gap in botany still persists, however it has become one of the smallest gaps in the sciences, with female botanists naming about 4 species for every 5 named by their male counterparts.

It would be great to see more research published within this vein, and used as a reference point for how the gender gap persists in access to academic resources, research opportunities, and availability of publishing and distribution.

On a related note, the data source for our most recent National Geographic project keeps record of international plant trade. In our early explorations for the project, we looked at both animals and plants and found that Woronow’s snowdrop (Galanthus woronowii), named in honor of Russian botanist Georg Woronow, was the most traded plant in 2013.

Snowdrops in general (Galanthus spp.) contain the substance galantamine, which can be used in the treatment of Alzheimer’s disease. Though I missed their blooming season, I was able to find the common snowdrop (Galanthus nivalis) in the Kew Gardens Rock Garden.

The common snowdrop can be found in the Rock Garden at Kew Gardens.
The common snowdrop can be found in the Rock Garden at Kew Gardens.

A lot of our work digs deep into one area of expertise, so it’s pretty amazing when we can find ways they intersect. Who knows, maybe our interest in food will combine with our love of television next…

July 02, 2015

Written by:

Topics:

We’re pleased to announce the release of the No Ceilings data… in 3D. Yes, we know everything is cooler in 3D (the IMAX, Jurassic World, printing, real life), but our decision to represent the No Ceilings map as a 3D globe for mobile devices is better attributed to the design and processing limitations of phones rather than an attempt at enhancing our street cred.

For those unfamiliar, we recently launched a project for the Clinton Foundation and the Gates Foundation titled No Ceilings: The Full Participation Project, which measures twenty years of the progress and setbacks of women and girls around the world. In addition to the series of data-driven visualizations, the desktop version contains a map populated by roughly 850,000 data points from more than 190 countries over 20 years. Though the site is responsive to mobile screen sizes, we had yet to find a solution for making the exploratory map experience work on the phone.

The 3D globe takes a subset of well-populated indicators from the No Ceilings dataset, and represents the information from country to country on a spinning, zoomable globe. By sliding your finger across the screen, you can rotate the globe east, west, north, or south to see how stats vary by location. You can pinch and release your fingers to zoom in and out, and swipe across the top of the screen to select from a variety of topics.

The globe uses color differently to summarize both numeric and categorical data. Looking at numeric data like, say, the representation of women in national parliament, you can see that countries with bright green coloring (e.g. Rwanda, ringing in with the all-time high of 56.3%) have higher percentages of women in parliament, whereas countries with the dimmer blue tones (e.g. the U.S. at 17.8%) show areas with less female representation. The color gradient represents the fluidity of the scale, from high values (bright green) to low values (dark blue).

The categorical data, on the other hand, uses less of a gradient, and better demonstrates classification differences from country to country. Taking availability of paid leave as an example, countries are divided into three different groupings: those where paid leave is available for both parents (teal), for mothers only (blue), and those where it’s not available at all (yellow). Yellow is used to indicate countries where paid leave is not provided for by the government, and calls attention to the lack of important legislation.

Building the map as a rotating globe with zoom allowed us to design around the narrow spatial restrictions of a mobile screen. The globe was developed for WebGL using the Three.js library. In addition to letting us project the globe in 3D, WebGL allows us to maximize performance on mobile devices with low powered processors. This keeps the globe’s animations snappy and responsive to user interaction through thousands of calculations per second.

An increasing number of people use their mobile phones as a source of immediate on-the-go information, so while the available surface area and processing capacity may be smaller than a desktop computer, it’s important we design and develop websites, tools, and applications that are better catered to the ways that audiences consume information. While we certainly wouldn’t expect a user to explore all 850,000 data points from a mobile device, finding ways to tailor information to the mobile experience remains a priority. As devices are getting smarter, design and development need to move in parallel. So grab your phone, take a spin, and check out the progress.

June 23, 2015

Written by:

Topics:

In celebration of the 40th anniversary and special re-release of the famous movie that made us afraid to swim in the ocean, we present Jawsography, an interactive app that analyzes the cinematography of the 1975 film, Jaws.

I’ve always been fascinated by the art direction and cinematography in Spielberg’s classic film. While he executes many amazing filmmaking techniques throughout the movie, the strong compositional shifts from the left, center, and right hand side of each frame are striking. 

I wanted to see if the actual compositional shifts were as strong as my initial memories watching the film, so we built a tool that allowed us to look at all the frames of the movie. We started by looking at 1 frame per 10 seconds of film, but we ended up with too many transitional frames. The final app pulls 1 frame per minute of film.

Jaws at 1 frame per minute

The compositional patterns started to emerge pretty clearly. We built another tool that allowed us to cycle through the frames quickly, and mark which ones had left, center, or right visual weight. In due time, we began describing the positioning with nautical nomenclature: Port and Starboard.

I had so much fun swiping through the frames and determining which compositional weight was the strongest that I managed to wrangle most of the office into another boondoggle. I was determined to bring the app into reality. Quickly Jawsography was born. Take a look on your mobile device (or laptop) to see the cinematography of Jaws in a whole new way. Dive in!