Can we actually design for sustainability?
uxdesign.cc
4 strategies to improve a products eco-friendliness without losing usability.I have been bummed by the decision to withdraw the United States from the Paris Agreement. Climate change is real (and scary), and this treaty committed countries to take action to reduce greenhouse gas emissions. And as an individual, it feels I cant do anything to stop the harm being done to theplanet.When you think of greenhouse gas emissions, you probably think of harsh manufacturing plants and how reliant we are on plastics (especially in the UnitedStates).But do you also think of internet emissions?Ive always thought the digitization era was good for the environment with less physical waste and better resource management. But a lot goes into powering the internet and our digital products. Internet emissions are all-encompassing data centers, servers, devices, and power sources needed to load web-pages, store documents, or even checkemails.I didnt know how much the UX design industry contributes to internet emissions until I read Tom Greenwoods Sustainable WebDesign.UX designers want to create usable, efficient, and visually-appealing experiences so users continue to use our product more and more. But in reality, were just exacerbating the contributions to internet emissions. Our goals are not only to help users complete a task, but to get them to click more, consume more content, and spend more time in theproduct.This more, more, and more mindset is causing the average page weight to increase annually. According to the Web Almanac, the median page weight on desktop was 1080 KB in 2014, and increased to 2170 KB in 2022over 100% increase in 8 years. A heavier page weight requires more data transfer, also requiring more energy toload.Web Almanacs median page weight over time between 2014 to2022We have a dilemmado we continue to increase our engagement metrics for our products and intensify internet emissions? Or do we decrease engagement to lessen emissions, but lose ourjobs?There are strategies all UX designers can use (other than just stopping UX design altogether) to improve a products eco-friendliness without losing usabilitymaintaining user engagement and keeping stakeholders happy. Lets review these 4 strategies below, then look at real-world examples of these strategies being practiced.Table ofcontents4 strategies for sustainable designReduce medias energy consumptionDesign for low data consumptionOptimize userjourneysEncourage sustainable userbehaviorReal-world examplesNetflixAppleWebsite examples4 strategies for sustainable design1. Reduce medias energy consumptionI. Apply efficient fileformatsUse WebP format forimagesUse MP4 (H.264) format forvideosUse system fonts (like Arial) or WOFF2 format for webfontsII. Load content only whenneededUse lazy loading to load content when they become visible in the usersviewportDont auto-play videos or animations unless triggered by the user (I.E., user selects Play or Submitbuttons)Use tools like Pixelied to adapt images into web-optimized fileformats2. Design for low data consumptionI. Prioritize contentLimit videos and animations (they have the largest filesizes)Provide different resolutions for media to allow the users browser to select the most suitable size for the users device and connectionUse dark mode by default (have the user swap to light mode, ifoffered)II. Reduce customUIBuild and use design systems for reusable UI components andpatternsAvoid UX fads that are short-lived and will require a redesign lateronUse design systems, such as Atlassian, to recycle UI components throughout a digitalproduct3. Optimize userjourneysI. Reduce userstepsUse clear navigation and heading structure so users can easily find needed informationreducing unnecessary pageloadsMinimize user clicks and page loads by consolidating multi-step processes into fewer input fields orpagesII. Create mindful experiencesAdd intentional delays to the users journey (I.E., ask them if they want to continue after spending a certain amount of time in theproduct)Use caching to temporarily store copies of the web-page content to reduce HTTP requestsoptimizing page loadspeedsPatagonias navigation menu prioritizes intuitiveness and hierarchyallowing easy find-ability4. Encourage sustainable userbehaviorI. Offer sustainable optionsSuggest a Low-data mode or Eco mode for users to toggle on or label media that requires more energy for transparencyDisplay estimated energy savings to reinforce the users decision to choose low-data modes or simplified website experiencesII. Prompt users to takeactionMake it easy for users to identify and delete old files or messages taking up server or devicestorageEducate users with information to raise awareness about the products decision to prioritize web sustainabilityAvrils website includes a toggle for Low energy mode with an information tooltipadjacentReal-world examples1. NetflixNetflix includes their infamous Are you still watching? feature, which adds an intentional pause in the user continuing to consume their content (though it feels judgemental when youre binge watching).Netflix only offers a dark mode color paletteenhancing its visual appeal and sustainability efforts.Netflix recognizes its carbon footprint due to being a video-streaming service, and has a target to reduce their emissions by roughly half by2030.Netflix began caching content closer to their end-users and improving server hardware to reduce data transfer by 30% between 2018 and 2021decreasing overall energy consumption.Netflixs Are you still watching? feature adds a pause to the usersjourney2. AppleApple includes a Low data mode in the settings for iOS 13 that reduces background activity and video streamingdecreasing data transfers. This benefits users who are in low-connectivity areas as well as users who need to save on cellular datausage.Apple has environmental initiatives with Apple 30, which will bring their net emissions to zero by 2030. Though Apple is evolving both their hardware and software, they implemented the Supplier Clean Energy Program to reduce overall emissions.Apple provides a Low data mode option in the settings for Cellular dataoptions3. WebsiteexamplesC40 Cities: Their website redesign reduced their CO2 output from 6.7g to 0.34g per homepageview.Impact Management Platform: Their website only uses 0.19g of CO2 per homepage view while maintaining quality and performance.Good Energy: Their website is powered by 100% renewable energy and each homepage view uses 0.58g ofCO2.C40 Citys website; examples via RyteMagazineClimate change is happening, and the internets emissions heavily contribute to it. A lot goes into powering the internet, from data centers to our individual devices, but there is a large dependency on UX design that determines how sustainable (or not) a certain digital productis.Are the file formats efficient? Do videos and unnecessary content load automatically? Are users prompted to act more sustainably while using theproduct?All these questions can influence a products eco-friendliness without detracting its usability or visual appeal, but its up to UX designers to ensure its advocated for and implemented. By using strategies like designing for low data consumption and optimizing user journeys, products can reap the benefits of lowering their energy consumption and giving users faster and effective experiences.Instead of the standard more, more, and more approach found in UX design, lets implement an intentional mindset to design for sustainability while maintaining an ideal experience for ourusers.If you havent read Tom Greenwoods Sustainable Web Design, I highly recommend it!Can we actually design for sustainability? was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.
0 Комментарии ·0 Поделились ·61 Просмотры