Software is Polluting the World

Sustainable UX: A design approach to reducing carbon emissions

"Please consider the environment before printing this email".

You have probably seen this line at the bottom of an email before. By now it's widely known that you should pay attention to what you print to reduce your carbon footprint. But how much does it cost sending this email in the first place?

What few people realise is that there is also something called digital pollution. When we send emails we are using computational energy; this energy usage increases our carbon footprint and can have a big impact in the long run. That makes "Please consider the environment before sending this email" a valid statement as well.

The Internet consumes large amounts of electricity in data centers, telecoms networks and consumer devices. If the Internet was a country, it would be the 6th largest polluter in the world. (Nature.com, 2018).

“If the Internet was a country, it would be the 6th largest polluter”

Carbon emissions and their impact on the environment are luckily widely discussed in the modern day. So much so, that a certain sense of embarrassment has arisen when becoming aware of your own carbon footprint. One of the new terms that has come from this is 'flygskam', the Swedish word that describes the feeling of shame that comes from traveling by airplane with the knowledge of how much pollution it causes.

How much is your entertainment worth?

When you binge-watch your Netflix series, group call on Houseparty (thank you, Covid-19) or buy Bitcoin, you are indirectly emitting carbon emissions into the world. Binge-watching shows on Netflix for a month straight contributes to as much carbon emissions as a flight from London to New York (Atmosfair, 2020).

And then you could ask, "Who binges Netflix for a month straight?", but that's besides the point. The Internet is a numbers game where even the slightest changes can have a big impact on the total.

“Binge-watching shows on Netflix for a month straight contributes to as much carbon emissions as a flight from London to New York.”

Take, for example, YouTube: the video giant has over 60 million-page views per day. According to researchers (Preist et at, May 2019) YouTube's annual carbon footprint is about 10Mt CO2e (Million Metric tons of carbon dioxide equivalent) — about the output of a city the size of Rotterdam (600.000 inhabitants).

Given the vast number of YouTube users across the planet, a slight optimisation of the UI adds up. That's 60 million times that the logo gets downloaded and displayed. With these numbers, even the slightest changes in design and engineering influence footprint. That's why nowadays, YouTube's displayed logo is only about 5kb (Der Funke, 2020). It's optimised to reduce energy usage and make the overall browsing experience as fast as possible.

Sustainability vs good design

With the rising awareness of carbon footprints, some designers also started considering sustainability in their work. Enter the term 'sustainable UX'. This movement "takes into account its responsibility to the environment and utilizing practices that reduce harm to the environment", (Rossul, July 2019).

Those in the tech industry have an important role to play, as they can tackle the problem at the source. We as designers have the choice to make more sustainable decisions in the work we deliver, or we could nudge our users into becoming more sustainable themselves. But if we focus on this, will we still be able to deliver good design?

Sustainable UX is a movement that is still in its infancy. Some companies, however, are already doing their part in creating a smaller carbon footprint for themselves and their users. These measures differ from big to small, but all show a certain awareness of digital pollution.

We identified two different ways designers and developers are pushing sustainability: small nudges, in which the user is (maybe unwittingly) prompted to choose more sustainable options, and content optimization, in which content is optimised as energy efficient. In this piece we will discuss both.

How small nudges can make a big change

Designers can use small prompts in their interface to reduce the carbon footprint of their users. They don't necessarily tackle the problem of pollution by changing their content; instead, they present it in a way that allows the user to make better decisions for the environment.

Starting out small

To reduce plastic waste, Deliveroo has introduced an opt-out option of plastic cutlery from the restaurant. Automatically, the option to receive cutlery is turned off with a small text as to why this option would be better for the environment. Users can still decide for themselves if they want to receive plastic cutlery by switching the toggle.

How we could do more

In Artiom Dashinsky's article 'Product Design for Sustainability' (2016), he proposes different ways in which existing interfaces could push for more sustainability, discussing "how small-effort improvements can affect the environment".

In a first example, Dashinsky presents a more sustainable way of printing documents. Sometimes, the last page of a printed document only contains a few lines. If the interface would give an option to scale down the document (or do this automatically), a lot of paper could be saved

For Google Maps, Dashinsky proposes to present more sustainable options of transport first. If the app promoted public transportation or biking over cars or cabs, people might be nudged into using the prior options, even though they would take longer.

Our Take: Messages & Image Compression

Similarly to Artiom Dashinsky, we challenged ourselves to look at apps we use on a daily basis and think about ways in which we could reduce our own carbon footprint without limiting ourselves in phone usage.

Nowadays, messaging apps go beyond the simple text message. We're constantly sharing data with others: from emojis to short videos. We love the fact that our contacts receive this data within a few seconds. But we probably forget about the real impact of this data-sharing.

45,000,000 images sent through iMessenger every day

When you send content such as photos such as through WhatsApp, it is automatically compressed. To the average user, this compression is visually unnoticeable. In contrast, images through iMessage are sent in full resolution. Even a random selfie to your best friend is sent in an unnecessarily pixel perfect quality. This requires extra computational energy resulting in a higher impact for the environment.

Taking inspiration from WhatsApp (automatically compressing photos) and the Apple Mail application (giving users the option to compress email attachments), we created a small UI change for iMessage.

Our suggestion provides the user with different size options in which they can send their photos. We decided to leave the choice of compression to the user because, sometimes, people still want to be able to send photos in full size and not lose any quality. To nudge people into sustainable behaviour, the smallest picture size option is automatically selected. Users can change this selection by simply clicking the option they would prefer.

Does such a small change in UX make any difference on a larger scale? Let's run some calculations.

According to research on Wonder (Wonder, 2016) an average of 1.8 billion digital images are loaded (globally) each day, totaling around 657 billion photos sent per year. Unfortunately, the percentage of images sent with iMessage is unknown. To make an estimation, we will use WhatsApp's statistics as a placeholder. 2.5% of the messages sent through their service are images. So on a daily basis, assuming this is the same for iMessage, 45,000,000 images are sent through the app everyday.

The CO-2 emitted from the images sent through iMessage each day is equal to 11,862 people flying from Paris to New York.

Taking the average size of phone images (13.18 MB (S. Hollister, CNet, 2015), this brings us to a total of 593,100,000 megabytes worth of data sent each day, or 593.1 terabytes. With this, we emit 11,862 tons of CO-2 per day, equal to 11,862 passengers flying from Paris to New York (Energuide, n.d.).

By compressing the images we send, we can bring this number back by about 40%. The rate of a JPG2000 compression is 1.72, which would make the total amount of data shared 345 terabytes. We could even take it a step further by using an AI-based compression. This could further reduce the data to 280 terabytes a day. Instead of 11,862 people taking that flight from Paris to New York, it would be around 5,600. All of these calculations are based on the paper 'Integer Discrete Flows and Lossless Compression' (Hoogeboom, 2019).

Friction vs. Seamless

As mentioned earlier, WhatsApp compresses images automatically, keeping the user out of the process. This is, partly, a financial consideration. After all, smaller picture sizes mean fewer servers, which means fewer running costs. This can be an important factor for a company that pays for their own servers while running a 'free' product. But, an even bigger consideration is that of design friction. Friction is anything that prevents users from accomplishing their goals or getting things done as quickly as possible. It is usually the opposite of being intuitive or effortless. However, it doesn’t mean that it’s always bad for users.

Are messaging apps supposed to hoist the sustainability flag?

iMessage and WhatsApp are all about seamless messaging. Sending a picture just works. Adding an extra interaction to stimulate sustainability adds an 'unnecessary' friction to that experience. But maybe this 'friction in the experience' is exactly what consumers need.

Up to now, consumers have not typically considered the computational energy needed to deliver their messages. The whole product is organised so that the end user doesn't have to care. By adding an extra interaction, you could let users realise that there is a downside of sending an image — you can make them aware. The question then remains: Is a functional messaging product like iMessage or WhatsApp created to spread such a message?

Content for Optimisation

"Data is the culprit behind the monster carbon footprint of our websites." In their article, Sustainable UX design: saving the environment with smarter websites, the tech company Parker Software discusses their views on the impact of data on the environment. They see that the ever-increasing creation of websites is demanding more and more energy. By making the right decisions in our designs we can improve this energy usage.

Lost in the web

When users visit a page, all of the data on that page has to be downloaded. Energy is used to receive all the necessary content and present it on the screen. Depending on the goal of the user, all of that loaded data might not even be interesting for them, causing a waste of energy. Webshops, in particular, are notorious offenders. When you navigate to a specific item, you have to click through category upon category and retrieve new data every time. With every click to open a new page, your website becomes less sustainable, so it's important to make your material as accessible as possible. But, how do we ensure the content is right there for the taking?

With every click to open a new page, your website becomes less sustainable, so it's important to make your content as accessible as possible.

On their website, Ikea is tackling it well. With a clear navigation panel and suggested products when searching, users are able to find items they're looking for as quick as possible. Like in most webshops, Ikea uses the navigation panel to let their users filter through different product themes. From a UX standpoint, this is clearly done to make searching for products in a huge database easier. But, it also avoids the necessity to load in product data that the user doesn't want or need to see.

When typing a product into the search bar, the Ikea website automatically suggests popular products that match this search term. By immediately presenting possibilities for the user, they can find the product they're looking for even faster. With this, Ikea also avoids that users load entire pages of, let's say, mirrors, and therefore an entire page of energy usage is spared.

Now make it smaller

To reduce the impact of our designs on the world, we need to start removing those extra bytes of data. A company that is really aiming for the smallest content size possible is Low-tech Magazine. With their solar-powered website they try to "radically reduce the energy use associated with accessing [their] content". They’ve made several choices in design to reach this goal. The website is fully static, and so, asks for less computational energy to load, avoids custom typefaces and logos, and images are converted with a 'dithering' technique.

Our suggestion: An optimal filter for Instagram

The biggest culprit of our daily data usage might just be Instagram. With its ever refreshing images & videos and its endless loop of stories, Instagram is a data polluter.

In 2015, Instagram updated their standard 640 px square picture format in order to support the vertical and horizontal formats (16:9). Since then, an Instagram Story picture has the dimension of 1080 x 1920 px, and a maximum of 30MB in size.

To reduce the size of the content shared in Instagram Stories, we created an environmentally conscious AR filter. For this, we were inspired by Low-tech Magazine and the way they dither images on their website. Our Instagram filter uses a halftone effect, which compresses images into dots rather than tones. A lot less data is needed to fill up the images, which makes their size significantly smaller.

With the use of the AR filter, we want to reduce the size of the Instagram Story at the source. The filter reads and creates a dithered image of reality in which some pixels won't have to be shown. The result is a remarkably smaller filtered picture size than the original. In fact, by using our filter, Instagram users can reduce the size of their original picture by over 50%.

With the introduction of a new sustainable filter in Instagram, we might have users unknowingly becoming more sustainable. We don't have to push any sort of choice for them, but can simply make the filter available for them to use. Optimisation in content doesn't have to be thrown in the user's face. It can be done in the background and still make a big difference.

The Sustainable Dot filter has launched on Earth Day, Wednesday 22 April and is available for all Instagram users. Simply go to the Instagram profile page of Master Digital Design (@master.digital.design) and check the middle filter icon just above the profile’s feed.

Good UX is Sustainable UX

In the article by Parker Software, it's proposed that badly executed UX design in a website could indicate that it isn't that sustainable. They might be right. A big part of good UX is making content easily accessible and speed, of course, plays a role in this. We see this too in the examples presented in our article. As designers, we have to avoid wasting the user's time with endless navigating or slow loading content.

With every design of a new page, we should be consciously considering what effect the addition of this content is going to have. First, the user's experience was our biggest motivation in this. How would people navigate to this page? How would they use it? Where could they go from here? Pages would be optimised to make the journey through products as easy as possible.

Now that we're actively, and almost naturally, making a seamless flow in our work, we could maybe take it one step further. How can we revise our work so much, that the impact we have on the environment is as little as possible?

Some closing thoughts

In this essay, we’ve touched upon the emergence of the field of Sustainable UX. It's a subject-matter that is still in its infancy. Most people have yet to realize that software can pollute our planet. A dirty factory chimney or a polluted car is easy to label as unsustainable. But the intangible nature of software makes pollution too abstract to get a grasp on. We simply can't imagine that sending a message from our phones has an impact too. Data moves from place to place through machines that are powered by electricity. These machines consume energy that emits CO2 if it doesn't come from renewable sources.

So what's the solution? Do we stop using digital tools altogether? In the world we’re living in, that’s difficult to imagine. We could start pointing fingers at streaming services, as they’re one of the biggest digital polluters, but we won’t stop binge-watching our favourite series. So, reducing emissions in digital products has to be tackled in another way. As designers, we can do this with a set of focus points for the next couple of years.

It starts with awareness

To fight the problem of computational energy usage, we need to create an awareness of data usage and its impact on the environment. We hope that this series of articles has already shed some light on the subject. If we, as designers, make each other aware of movements like Sustainable UX, we can actively consider the impact of our designs and how we can make them greener. We all share and use the web, just as we all share this planet, and can come together to fix it. By sharing knowledge through articles like these, we can actually use the ‘problematic’ data slurping Internet as a solution.

Measuring is key

To make sustainability more understandable we need better tools to measure Internet pollution. It's important to understand that measuring is much more complex than it seems. Sustainability acts in a system of actors that all influence each other. Measuring sustainability includes so many aspects that it’s not always easy to understand which decision is right sustainability-wise. There isn't yet a reliable model for energy modeling in interactive applications.

“We need better tools and methods to measure internet pollution.”

Participate

Designers, product managers, engineers, and entrepreneurs have the responsibility to consider the web as a polluter. It is up to us to create something that is good for the user as well as the planet. We can create good design by choice without compromising aesthetics and functionality. Good UX-design might equal sustainable UX-design. For the user experience, we strive to bring the user through our products in the fastest way possible. Now, we can bring it a step further. We have to consider how we can prevent our users from loading more data than needed and we can tweak our work accordingly. Reduced data leads to reduced energy consumption.

Scale does matter

From our own experiments this week and looking at what others have done in the field of sustainability, we have seen how small we can start out. The changes we make in our solutions are small but can have a big effect in the long run. Every conscious design choice helps in the reduction of our computational energy usage.

Small nudges in UX can go a long way. By presenting more sustainable options to our users clearly, we can help them make more environmentally friendly decisions. Options don’t have to be pushed, but can simply be presented (or even automatically selected). Unwittingly, people can make a choice to save the planet.

"The moment we create digital products or services we become part of the problem."

Even systematic changes to reduce small bits and pieces in an interface can massively change the emission rate. The simple compression of an image can have a big impact once it goes around the world. The internet is a numbers game and scale does matter. Think about what impact everything you design and build would have if 10 million people would use it.

You may wonder whether as a designer it is your responsibility to design more sustainably or to bring this awareness to the user. But from the moment we create digital products or services we become part of the problem. The question is whether you would like to be part of the solution as well.

Noted

  • This essay has been written together with Danique de Bies. Illustrations are by Matthijs Nolst Trenité. The development of the Instagram Filter and calculations are by Gabriela Onu.
  • Thanks to Cintia Taylor, and Freya von Noorden Pierce for reading drafts of this piece.
  • The title is a reference to the famous essay by Marc Andreessen called 'Why Software is Eating the World'.

This piece, published . Thoughts? Email me hi@kentdebruin.com.

Get an email when I publish something new.