Cancer Statistics Center

Previously delivered to the public as a printed annual report of the most current information about cancer, The American Cancer Society wanted to make the cancer statistics data available online, in an interactive format. Their goal is to encourage the public to explore, and interact with the data, and share cancer statistics with others to promote cancer prevention and control.

The Cancer Society, following on the success of The Cancer Atlas, once again partnered with Atlantic Media Strategies to tackle the challenge of creating a data visualization tool that would 1) allow normal users to view, and create custom downloadable maps, graphs and charts; Export data to Excel, and share specific statistics as well as, 2) allow the editors (admin users) to create data visualizations as a way to curate the content appearing on the site.

As design lead, my challenge was to design a dynamic user interface that is intuitive to use for both normal and admin users. An interface that would allow people to interact with 14,000 raw cancer data points in an engaging way. Some of biggest design challenges were: 1) making data visualizations – something inherently visual – usable for people across the spectrum of visual impairments, 2) a need for a reusable color system to support extensible data visualization system, and 3) creating a dynamic interface – everything from dynamically drawn SVG graphics to the interface that allows users to create those graphics.

This was the most mind-bending project, and also the most rewarding due to the complexity of the data and the user requirements. Designing this data visualization tool inspired me and my team to question whether following accessibility standards alone ensures usability. We dug deeper to find meaning in the data and as a result, evolved our design and development approach to integrate accessibility into our entire process. Tommy O’keefe, our developer, and I teamed up to give a talk about our evolving approach for an inclusive audience at our local Refresh DC event. With more resources, the one thing I would change is the editorial description in the maps for screen readers.

User flows and wireframes

We conducted user interviews to understand their needs and context for using and accessing the data. Then identified challenges that we can wireframe to solve and test against.

Mood board for a visual language system

The color system was based on The Cancer Atlas’s brand colors, but expanded to accommodate an extensible color systems for data visualizations and tweaked for accessibility. I used No Coffee chrome extension and sim daltonism tools to test for color contrast.

Curated data visualizations of interesting statistics on the homepage

The homepage is designed to make browsing data visualizations of the most interesting statistics easy. These data visualizations are curated by the editors and staff at The American Cancer Society.

Hero statistics

The most unique data in this site is the predictive data of the current year’s estimated new cancer cases and deaths. Through user research, we learned that the most requested data is also this data by month, day, and minute. Because of this research, we featured the predictive data as the hero of our story on the homepage. People can use the drop down feature to see the numbers broken down by month, day and minute.

Data Dashboard

The dashboards feature statistics by state or cancer types to help people who have specific interest in mind.

Analysis Tool

The analysis tool allow people to examine statistics in details and create their own visualizations.

Tool Box

The tool box include the ability to download the visualization as in image, download the raw data, share, and analyze the data in details using the analysis tool