City Monitor by Graphicacy
Nonprofit groups and smaller businesses may not have what qualifies as “big data,” but their data still has important stories to tell. Centre for Cities is one such organization.
A leading nonprofit think tank, Centre for Cities is dedicated to improving the economies of the United Kingdom’s largest cities and towns. Each year, the organization publishes its flagship City Monitor to depict the economic performance of — and disparities among — the country’s 63 largest urban areas.
The data has been useful, but its static presentation, in print and PDF, has not had the desired impact. In October 2020, Centre for Cities contacted Graphicacy for help developing a bespoke visualization tool that would bring City Monitor’s wealth of data to life and make it more accessible and attractive to a wider audience.
Given their small staff size (fewer than 20) and minimal technical resources, Centre for Cities needed their powerful solution to be a simple one as well — one they could easily update and operate themselves. They also needed their data to go live within three months.
Graphicacy accepted the challenge and delivered an engaging do-it-yourself visualization powered entirely by a familiar database system.
From dull to dynamic
“Data is a big part of our brand — it sets us apart,” said Lauren Orso, Centre for Cities’ digital and audience manager. “But economic data can be very dry and turn people off. It’s hard to make a compelling case about regional inequalities using number tables. We wanted something exciting that fit how people consume information now. We also wanted it to feel real so people could see how their city compared to their neighbors.”
Graphicacy recognized an opportunity to apply an open-sourced frontend engineering method: a custom visualization that links to a database built on Google Sheets. “This setup operates much like a Content Management System and enables practically anyone on the client side to update the data and the visualization with little technical competency required,” said Christopher Lanoue, director of engineering and innovation at Graphicacy.
First, Graphicacy needed to design a front-end visualization worthy of the data’s mission. After presenting a few directions, the team chose a spider-style design that showed each city’s performance across 18 economic indicators, including population, employment, earning, environment, housing, digital connectivity, and COVID-19 impact.
“We were floored when we got their wireframe back,” said Orso. “We didn’t even know what we really wanted at first, but Graphicacy gave it shape and understood what we were trying to do. They made it something very exciting.”
The uniform design allows Members of Parliament, policymakers, municipal leaders and others to quickly determine a city’s economic strengths and weaknesses, as well as how it compares to other cities in the UK. Hovering over indicators will produce a pop-up window with data details. Users can also create their own table views of cities based on region or indicators, or they can dive deeper into any individual city profiles.
“Before, we had a data tool tailored to an analyst audience. This new visualization is an entry point for many other important stakeholders and city leaders,” she said. “This is the type of tool we need to help drive policy change.”
Built for simplicity
Graphicacy’s visualization tool gives Centre for Cities access to a cloud database without building a new on-premise application. Staff can focus on telling impactful stories with their data rather than storing and managing it through integration with Google Sheets.
Now, all pertinent information in the Centre for Cities database lives in three easily managed tabs:
• The metadata tab sets rules for displaying the data, such as date range, whether high values are good (i.e., average weekly earnings) or bad (i.e., CO2 emissions per capita), or if any COVID impact should be indicated.
• The data tab houses the economic indicators as raw numbers that can be updated or changed at any time. Staff can simply cut and paste data from other sources into the appropriate fields. The visualization automatically draws from the data tab without any developer intervention.
• The colors tab allows staff to change the visualization theme colors at any time at the touch of a button.
Whenever they have updates, staff can opt to have changes appear either instantly in the visualization with no vetting or in a preview portal prior to publishing. A rollback function provides an added safety net.
“Graphicacy has developed a unique method that allows our visualizations to incorporate data from Google Sheets in real time,” said Lanoue. “That makes all the difference.”
Further, the visualization is intuitively built by Graphicacy to fit the metadata and make the graphics visually appealing under countless different conditions. For example, if Centre for Cities changes the number of indicators from 18, the graphic automatically adjusts for even spacing and symmetry.
For cost efficiencies, the new tool operates on an AWS serverless cloud and runs only on demand when services are needed. Static data storage enables fast retrieval and low latency. Moreover, Centre for Cities can increase scale through AWS at the click of a button and never worry about server maintenance.
“It’s neatly set out so that even someone fresh can use it,” said Orso. “A researcher doesn’t even have to go through me to make updates. I can send them a link and have them do it themselves.”
Adding to the advantages of a more intuitive database, Graphicacy’s design has changed the way Centre for Cities and its audience view the data. According to Orso, the new design has already inspired much more engagement than previous iterations.
Orso added that ranking cities from 1 to 63, rather than simply displaying the top-10 and bottom-10 cities for each category, has inspired their researchers, as well.
“Seeing the information presented this way made us revisit our data, both in terms of what we collect and how we present it,” Orso said. “Some of the things we were looking at weren’t actually relevant. I’m now getting information from researchers that reflects the way it is displayed in the city profiles tab.”
Centre for Cities’ experience was capped by their relationship with Graphicacy, who delivered a solution above and beyond expectations within a tight timeline. “We really enjoyed working with their team,” said Orso. “They quickly understood who we are and what we needed for our internal team and our main audiences. The speed at which they moved from the initial ask to the final delivery — even amid holidays, a presidential election, and a pandemic — speaks volumes.”
CreditsShing-Yun Chiang, Senior Data Visualization Designer & Analyst / Graphicacy Christopher Lanoue, Engineering & Innovation Director / Graphicacy Josh Nerpel, Managing Director / Graphicacy Jeffrey Osborn, Creative Director / Graphicacy