Design systems help reduce digital carbon emissions
Lewis Wake explores the relationship between digital sustainability and design systems, highlighting how they can work together to reduce carbon emissions and create more efficient digital products.
Understanding digital sustainability
At its core, digital sustainability is about being aware of and reducing the carbon emissions generated by digital product usage.
This concept might seem straightforward, but as we delve deeper, it becomes clear that the digital world has a significant, often hidden, impact on our planet. How can we ensure our digital footprint is sustainable?
The hidden costs of digital content
Every time our University homepage is viewed it emits around one gram of CO2. While that may not seem like much, when the page receives two million views annually, the emissions quickly add up to two metric tons of CO2.
To put that in perspective, this is equivalent to your personal output of carbon emissions as a passenger on four transatlantic flights from New York to London.
This hidden impact demonstrates the importance of considering digital sustainability in our daily operations.
One of the primary challenges in digital sustainability is the sheer volume of content generated and stored online.
Many organisations treat the internet as an infinite resource, continuously publishing content without considering the long-term environmental impact. This behaviour has led to a growing mountain of digital waste that requires ongoing maintenance, storage, and energy consumption.
The internet is not an infinite resource.
A practical example of this issue is the use of unoptimized images on websites.
If a high-resolution image is uploaded without compression, it can significantly increase the page’s load time and CO2 emissions. A single 33MB image viewed 200 times in a week can generate 120 kilograms of CO2 — equivalent to three months of average car usage.
These hidden costs are often overlooked, but they contribute significantly to the overall carbon footprint of digital activities.
How design systems can help
Design systems play a crucial role in addressing the environmental impact of digital products. By creating a cohesive set of reusable components and guidelines, design systems can help reduce redundancy and optimise resources, leading to a more sustainable digital presence.
There are a number of key benefits.
Efficient resource use
Reusing components across digital platforms reduces the need for creating and serving redundant assets. This not only cuts down on data transfer and server load but also minimises the creation of unnecessary code and outdated assets.
Performance optimisation
Optimising digital assets such as images and code can lead to faster load times, lower energy consumption, and reduced data transfer. Clean, efficient coding practices enhance performance and reduce server demands, contributing to lower emissions.
Scalable solutions
Design systems provide scalable solutions that allow for easy updates and adaptation to new technologies without the need for a complete overhaul. This ongoing optimisation saves resources and ensures that digital products remain efficient over time.
Metrics and monitoring
A unified design system enables easier tracking of the carbon footprint of digital assets across an organisation. This data-driven approach allows for more informed decisions aimed at further reducing emissions and enhancing sustainability.
Tools and resources to aid digital sustainability
To support efforts in digital sustainability, several tools and resources can help measure and reduce the environmental impact of digital products:
- CO2.js: an open-source JavaScript library that helps developers estimate the emissions related to their digital products.
- EcoGrader: utilises CO2.js from the Green Web Foundation to estimate the carbon emissions of websites.
- Google Lighthouse: provides open-source page metrics to identify areas for improvement in website performance.
- Website Carbon Calculator: developed by Whole Grain Digital, this tool measures the carbon footprint of websites.
- SustainableWebDesign.org: a comprehensive resource for designing digital products with a focus on sustainability.
Aligning with organisation goals
Promoting digital sustainability aligns with broader organisational goals, particularly in educational institutions such as St Andrews, where sustainability is a key part of the strategy.
By adopting sustainable design systems, universities can enhance their reputation, reduce costs, and attract environmentally conscious students and staff.
Focusing on sustainability in digital products not only contributes to a better user experience but also positions the organisation as a leader in environmental responsibility.
This can be a powerful tool for recruitment and engagement, especially with the growing demand for sustainability from younger generations.
While the journey towards digital sustainability is complex, integrating design systems into this process offers a clear path forward.
By focusing on efficient resource use, performance optimisation, and scalable solutions, organisations can significantly reduce their digital carbon footprint. These efforts not only support broader sustainability goals but also create a more efficient and future-proof digital environment.
As awareness of the environmental impact of digital activities grows, adopting sustainable practices will become increasingly essential for organisations looking to lead by example in the digital age.