A carbon footprint calculator focussed on engagement (and emojis)
I built a website to try and nudge people towards less impactful forms of transport, but also to see if there are more relatable, engaging ways of expressing our CO2 impact. Users can visualise the impact of their commute in burgers, basketballs, sushi and more, and so far it’s been used in 85 different countries!
Making negatives engaging
No one really likes to be told how much they’re damaging the planet, and most CO2 calculators don’t make it any easier. The results are often intangible, difficult to act upon, and a bit dry, which means they can end up having little effect. With this in mind, I focussed on designing a highly visual, easily relatable, and comparative calculator.
By using a range of emoji examples I tried to increase the time users spent looking at something negative, and to also bring multiple perspectives to the same piece of data.
I aimed to be super fast and responsive with my testing, getting continuous feedback, making small iterations, and testing again. I used Reddit as a testing ground, which ended up being surprisingly constructive and enlightening, and it lead me to improve the site in three key areas...
This was the most major problem to address, and it refers to the navigation between the different emoji examples. Despite thinking the first iteration of the website was perfectly clear, it turned out that lots of people didn’t realise there were multiple options or pages they could click through. In response I tried out a number of navigation options, and was able to quickly get to a functionality that worked much better... I suppose that’s what testing is for!
My initial hunch was that the site would typically be used by people at work, surfing the internet on a laptop or PC. Google analytics revealed this wasn’t the case at all - it was being used predominantly on mobile, so I put much more focus on the mobile experience.
To an extent this problem still exists - should cyclists diets and the ‘extra CO2’ they exhale be counted in their impact? I’ve tried including and not including it, and ultimately not including it turned out to be the better option - it’s more understandable, and also the ‘extra CO2’ from breathing was not previously trapped in the ground, as it would be with fossil fuels.
I’m still working on understanding how effective the site is, but one early finding is that people want to see their feedback in an way that relates to them personally, and factors such as size, weight or volume are still too abstract to be useful. Users tended to prefer examples such as ‘you need to plant this many extra trees’ or ‘you need to do *something* less to be carbon neutral’.
To increase the functionality and effectiveness of the site, I’ve identified some possible new features:
More diverse and impactful examples
Currently working on it!
Built in journey mapping
Similar to Google Maps, where users enter their start and end address, and then select a transit method, giving far more detailed, specific data.
Location specific data
My data comes from London transit options, but what if certain locations have electric buses, or different kinds of transportation options? How can this personalisation be introduced?
Augmented reality could be a really powerful tool for visualisations, and I’d love to explore how it could be used in regard to sustainability and carbon footprint.
Design and code
Ultimately this site was designed to be super easy to use, fun, and hopefully effective. To get to the final build I went through quite a few processes, a lot of which were pretty new to me: