Inspiration

If we want data to move people enough to reduce their carbon emissions (or encourage their cities to do so), it needs to be designed in a way to:

  1. Encourage an action
  2. Be easy to understand
  3. Compared against other data

Data related to the climate crisis is often not accessible to the average citizen, or leaves an individual feeling hopeless. We wanted to tackle this problem by creating a dashboard that is super simple to understand, and uses game design techniques to encourage citizens and cities to take action.

What it does

Pixel Cities is a leaderboard ranking cities based on both C02 Emissions and Transparency. Its purpose is to present the information in a format that is easy to understand, gamify the reduction of C02, and provide tangible action steps for cities to raise their scores.

In the future, it’s likely that C02 emissions will affect potential home buyers, so it would certainly motivate cities to try and make the list. Citizens can also easily understand how their own cities rank, and urge their representatives to take steps in transparency and C02 reduction.

How we scored cities

Cities were scored across both GHG emissions outputs and reporting transparency, weighted evenly and combined to create an overall score and ranking. All data used was from the Carbon Disclosure Project’s (CDP) global dataset including municipal greenhouse gas emissions data submitted to CDP between 2016 and 2020.

The emissions outputs score is an even combination of the city’s total emissions and their per capita emissions. In each category, cities that did not report emissions data were assigned at the mean, and then the top third of cities that reported received a max score of 5, the middle third of cities that reported received a score of 3, and the bottom third of cities that reported received a score of 0.

Reporting transparency was measured by the frequency of reporting, the most recent available data, if the city uses the GCP or ICLEI protocol for measurement, and how many GHGs they measure. In each category, cities received either a 5, 3, or 0 depending on if they met the standards of the category. For instance, cities using the GCP or ICLEI received a 5, cities using another protocol for measurement received a 3, and cities reporting no protocol use received a 0. Each category was weighted evenly in calculating the city’s transparency score.

How we built it

We built this project completely in HTML, JavaScript, and CSS. Art was created with the pixilart editing tool and D3.js was used to help organize the data.

Challenges we ran into

We ran into challenges in normalizing the dataset for use. The frequency of and length of time cities report emissions data for differs greatly, and the way each city measures that data varies. The combined result made it difficult to determine which cities are ranked the highest and which the lowest in their efforts to reduce carbon emissions. As neither of us are subject-matter experts in carbon emissions, we went with an adaptable middle-of-the-road approach that allows us to easily re-weight the scores based on expert advice.

We also ran into challenges reading the csv data file on the client side. Many of the technologies we were familiar with for reading csvs are server side libraries and we opted to keep our application lean instead. In the end, we used d3.js to read our csv and append values onto our leaderboard.

Accomplishments that we're proud of

We completed a working prototype! And it was both of our first hackathon!

What's next for Pixel Cities

Looking to the future, Pixel Cities would award cities with achievement badges in addition to the high score leaderboard to encourage specific steps in becoming a more green city. This would be good PR for a city to have, for example, achievements in “Green Energy” or “Local Food Systems”, etc.

Additionally, we would like to further build out opportunities to connect cities with ways to improve their score, potentially including mentorship, peer-groups, and a more robust resource page.

We would also have the table populated through a database that can be updated on an annual basis, and a data tab in the top nav that explains more information about where the data comes from and how cities are scored.-------

Built With

Share this project:

Updates