What is Sustainable UX?
A jumpstart guide with resources for the emerging frameworks of developing intentional tech for people, the planet, and the future.
You are probably familiar with sustainability in general and how it relates to the analog world. And maybe you even have an idea of what it may mean for the digital landscape, but what does that actually look like for sustainable product design and development?
Whether you are a designer, product partner, developer, or anyone in between, this article is meant to be a high-level overview of these emerging frameworks and help you find what tools you can use to start building sustainable tech today.
Sustainability is More than the Environment
While most conversations around sustainability focus on the environment, there are actually two other elements to consider when discussing any balanced approach to sustainable initiatives. Together these are known as the three pillars of sustainability:
- Environment: The most comprehensive and familiar pillar, it relates to the preservation and protection of natural resources, ecosystems, and the overall health of the planet. From reducing ecological footprints, conserving biodiversity, mitigating climate change, and promoting sustainable resource management, this pillar encompasses aspects such as renewable energy, waste reduction, conservation of water and land, sustainable agriculture, and ecosystem restoration.
- Social: The social pillar of sustainability refers to the well-being and equitable treatment of individuals and communities. It involves promoting inclusivity social justice, human rights, and fostering healthy thriving communities. This pillar encompasses aspects such as access to education, healthcare, fair employment opportunities, cultural diversity, and social cohesion.
- Economic: The economic pillar focuses on ensuring long-term economic prosperity while minimizing negative impacts. It involves creating economic systems that are efficient, equitable, and sustainable in the allocation and use of resources. This pillar includes considerations such as responsible business practices, fair trade, economic stability, job creation, income equality, and sustainable consumption and production patterns.
For the purposes of this article, we will mostly be focusing on the environmental pillar because of its novelty as a discipline. See the resources section if you would like to dive into the other pillars as they relate to sustainable design.
It is also important to note when discussing sustainability in general that we need to ultimately move into building regenerative systems over simply sustainable ones. Learn more about the difference between the two.
Everyday Best Practices
Unlike other design frameworks, there is not yet a world where sustainable guidelines are second nature to the design process, much like accessibility guidelines, when considering environmentally energy-efficient digital experiences.
This is partly because it is still emerging but also because a cookie-cutter solution is counter to the systems lens of sustainable design.
Meaning, not all of these best practices will apply or have the most impact depending on the unique circumstances of our problems, tech limitations, user needs, and stakeholders that make up our product ecosystems.
With discernment in mind, the following are some tangible areas to think about leveraging when developing products with a lower carbon footprint:
- Colors: OLED screens, while providing higher quality, also require more energy use depending on what color is used.
- Whites and blues use up more energy than reds, greens & dark colors.
- While a dark mode first approach is the sustainable ideal, it is a balance between energy efficiency and accessibility. - Fonts: Utilizing system fonts as much as possible decreases the energy used to load since they are already installed.
- If you want to use custom fonts, you can subset them to remove characters not being used and reduce use of weight & style variants
- Use the most efficient file types (Currently WOFF2) - Media: Media is one of the biggest energy users in the digital space.
- Use vector & CSS styling as much as possible.
- Optimizing media by using the smallest version & the most efficient file types (webP for photos & MP4 for videos)
-Avoiding GIFs, Autoplay & Video - Effects: Animations, transforms, masks & tracking all require more energy when loading. Use them intentionally & thoughtfully.
- Findability: The most sustainable thing we can do is keep users off their devices. We can leverage existing UX best practices to get users to information faster and more efficiently.
- Prevent dead ends
- Optimize SEO & User Flows
- Streamline User Journeys - Lean UX: Eliminating waste in our cadences and design processes is also important for establishing sustainable frameworks in our day-to-day.
- Adopt Agile and Lean UX Processes for rapid iteration and collaboration
- Favor remote research methods when possible
- Leverage Design Systems for more efficient work flows and development - Coding: Efficient coding uses less energy by having lighter file weights & lowering processing time for user devices.
- Write clean code
- Use less javascript
- Use tools like Accelerated Mobile Pages & Progressive Web App Technology - Engineering: Sustainable applications are often cheaper, more performant, and more resilient. Focus on optimizations that increase overall carbon efficiency like.
- Reducing the amount of data and distance it must travel across a network
- Moving on-premise workloads to the cloud - Web Hosting: A lot of energy can be used by websites in the data center and in the transmission of data to and from the data center. Careful selection of web hosting services has a big impact.
- Utilizing green energy web hosting
- Using data centers close to your users or Content Delivery Networks (CDNs)
Bigger Impacts through Systems Thinking
While low-energy best practices are a powerful place to start, they may not be the area where you can leverage the most impact. For example, maybe you are designing internal software for the drivers of a food distribution company. While designing that product utilizing low-energy principles will be great, maybe in this specific case you could have a bigger sustainable impact by implementing route optimization.
This is where the power of systems thinking and design comes in. The ultimate goal of which is to consider circular design and move away from the current take, make, and waste of the linear system of our physical and digital worlds and turn it into a use, reuse, repair, remake, and recycle system in a circular economy.
If we can map and understand systems, we can then identify the areas of those systems where we can be most influential. It gives us the power to zoom out and take into account the product’s entire life cycle from the extraction of raw materials to its production, shipping, use, and end of use. And yes, this applies to digital products as much as physical ones.
See the resources section for toolkits and guidance on diving deeper into systems design.
Transparency is Essential
Before wrapping up, it’s important to highlight the vitality of transparency when producing or assessing the quality of any sustainable work. While sustainability is at the center of many discussions, growing sectors and corporate initiatives, it also is a time of abundant greenwashing.
From information on data and impact to the accessibility of processes & solutions, documentation, and open source values, transparency is key to successful sustainable interventions because it enables credibility, accessibility, and inclusion.
Some examples of what transparency could look like in your projects:
- Don’t use visuals that mislead people into thinking your product is green
- Don’t rely on business associations
- Avoid being vague with our language
- Only make claims about your environmental performance that can be credibly backed up
- Don’t rely on basic information to make complex choices
Resources
While I hope you are walking away from this article with more understanding of what Sustainable UX is and how you can incorporate it into your design processes today, we have barely scratched the surface.
Dive in, learn more, and get involved with some of the resources below:
- General Sustainability
- UN Sustainable Development Goals
- Project Drawdown - Design
- Climate Designers
- SUX (Toolkit)
- Life-Centered Design
- Sustainable Web Design
- Unschool Disruptive Design (Systems Design) - Tech
- ClimateAction.tech
- Green Software Foundation - Tools
- Website Carbon Calculator
- Green Web Foundation (Green Web Hosting) - Books
- Sustainable Web Design
- Designing for Sustainability
- Sustainable IT Playbook
