Ho trascorso oltre due decenni nelle trincee dello user experience design. Ricordo il passaggio dai layout basati su tabelle ai CSS, il perno del responsive design con il lancio dell’iPhone e l’ascesa dell’“economia dell’attenzione”. Ma mentre ci muoviamo verso il 2026, il settore si trova ad affrontare il cambiamento più significativo mai visto finora. Stiamo passando dall’era del “design ad ogni costo” all’era della UX sostenibile. Non è qualcosa a cui pensano la maggior parte dei designer, me compreso, finché non mi è stato suggerito di sentirne parlare come concetto. Per anni abbiamo trattato Internet come una nuvola eterea e senza peso. Abbiamo ipotizzato che i prodotti digitali fossero “verdi” semplicemente perché non erano stampati su carta. Anch’io lo pensavo, e prima che emergesse il concetto di cambiamento climatico, si trattava più di salvare gli alberi. Avevamo torto. Il cloud è un’infrastruttura fisica, una vasta rete di data center, cavi sottomarini e sistemi di raffreddamento che ronzano 24 ore su 24, 7 giorni su 7. Sebbene i data center incentrati sull’intelligenza artificiale corrispondano al consumo energetico delle enormi fonderie di alluminio, la loro elevata densità geografica crea una tensione ambientale ancora più intensa e localizzata. Come progettisti UX, siamo gli artefici di questo consumo energetico. Ogni immagine hero ad alta risoluzione, ogni video di sfondo a riproduzione automatica e ogni animazione JavaScript complessa che approviamo è un'istruzione diretta a un processore di consumare energia. Se vogliamo costruire un futuro che duri, dobbiamo smettere di progettare per “wow” e iniziare a progettare per l’efficienza. Modalità oscura Agli inizi degli anni 2000, gli sfondi bianchi erano lo standard perché imitavano la familiarità della carta. Tuttavia, l’hardware si è evoluto e la nostra filosofia di progettazione deve seguirlo. Il passaggio dalla tecnologia LCD a quella OLED (Organic Light Espiring Diode) ha cambiato radicalmente il modo in cui il colore influisce sull’energia.
La logica A differenza degli schermi LCD tradizionali, che richiedono una retroilluminazione sempre attiva (anche quando viene visualizzato il nero), gli schermi OLED illuminano ciascun pixel individualmente. Quando un pixel è impostato sul nero vero (#000000), quel diodo specifico viene completamente spento. Non consuma energia. Progettando interfacce che privilegiano tavolozze più scure, non stiamo solo seguendo una tendenza; stiamo riducendo fisicamente il fabbisogno energetico del dispositivo dell’utente. I dati Il risparmio energetico è tutt’altro che trascurabile. Uno studio fondamentale della Purdue University nel 2021, che è diventato lo standard di riferimento per questa discussione, ha rivelato che con una luminosità del 100%, il passaggio dalla modalità luce alla modalità buio può far risparmiare in media dal 39% al 47% della carica della batteria. Su scala globale, se tutte le principali app passassero per impostazione predefinita alla modalità oscura, la riduzione della domanda di rete sarebbe astronomica. L'obiettivo progettuale Nel 2026, la modalità oscura non dovrebbe più essere un “tema” secondario nascosto in un menu delle impostazioni. Dovremmo progettare con una mentalità “Dark-First”. Ciò non significa che ogni sito debba assomigliare a The Matrix, ma significa dare priorità ai temi scuri ad alto contrasto come stato predefinito preferito dal sistema. Ciò prolunga la durata dell'hardware del dispositivo e riduce l'impronta di carbonio di ogni interazione. Personalmente preferisco la modalità luce per la lettura, quindi ha senso avere a disposizione sia la modalità luce che la modalità buio. Ci sono anche considerazioni sull'accessibilità nel fornire entrambe le opzioni. Ottimizzazione di immagini e video Siamo diventati designer pigri. Con il 5G ad alta velocità e la fibra ottica, non dobbiamo più preoccuparci delle dimensioni dei file. Il peso medio della pagina mobile è aumentato di oltre il 500% negli ultimi dieci anni, in gran parte a causa di risorse visive non ottimizzate. La logica Il “grasso digitale” di un sito web (quelle foto Unsplash da 4 MB e i video di sfondo da 15 MB) è il principale contributore all’energia di caricamento della pagina. Ogni megabyte trasferito da un server a un client richiede elettricità per la trasmissione, l’elaborazione del server e il motore di rendering dell’utente. Quando utilizziamo file di grandi dimensioni, stiamo essenzialmente “bruciando” energia per mostrare un’immagine che avrebbe potuto essere altrettanto efficace anche se di dimensioni molto più ridotte. Per non parlare del fatto che stai anche fornendo un'esperienza utente migliore con una pagina che si carica molto più velocemente.
I dati Secondo l’HTTP Archive, immagini e video rappresentano costantemente la parte del leone sul peso totale di una pagina. Tuttavia, il passaggio ai formati moderni come AVIF e WebP può ridurre il peso dell'immagine fino al 50% rispetto a JPEG, senza alcuna perdita percettibile di qualità. Anche se questi formati non mi sono familiari come JPG e PNG, non vedo l'ora di usarli per ridurre le dimensioni della pagina. ILObiettivo di progettazione Recentemente ho guidato una riprogettazione di una piattaforma di sicurezza informatica. Implementando un controllo “Prima e dopo”, abbiamo scoperto che la loro home page caricava 5,5 MB di dati. Sostituendo la fotografia ad alta risoluzione con la grafica SVG (Scalable Vector Graphics) e utilizzando gradienti CSS intelligenti invece delle risorse immagine, abbiamo ridotto il carico a 1,2 MB. Si tratta di una riduzione del 78% del carico energetico! Come designer, la tua prima domanda dovrebbe sempre essere: "Ho bisogno di una foto per questo, o posso ottenere la stessa risonanza emotiva con il codice?"
Movimento intenzionale: tagliare animazioni "rumorose". Viviamo in un'era di "scroll jacking" e di complessi effetti di parallasse 3D. Sebbene questi possano vincere premi su Awwwards.com, spesso sono disastri ecologici. La logica L'animazione non è gratuita. Per eseguire il rendering di un'animazione complessa, la GPU (Graphics Processing Unit) del dispositivo deve funzionare a capacità elevata. Ciò aumenta la temperatura della CPU, attiva le ventole di raffreddamento (nei laptop) e scarica rapidamente la batteria. Le animazioni "rumorose" che vengono eseguite costantemente in background o attivano massicce ridipinture del browser sono l'equivalente energetico di lasciare l'auto al minimo nel vialetto.
I dati Le linee guida di Material Design di Google enfatizzano il “movimento significativo”. Sostengono che l'animazione dovrebbe essere utilizzata solo per orientare l'utente o fornire feedback. Inoltre, l'utilizzo di WebP anziché JPEG può far risparmiare il 25-50% dei dati su una pagina. L'obiettivo progettuale Dobbiamo adottare un movimento significativo. Se un’animazione non aiuta un utente a completare un’attività o a comprendere una gerarchia, è uno spreco. Dovremmo favorire le transizioni CSS rispetto alle pesanti librerie JavaScript come GSAP o Lottie, ove possibile, poiché i CSS sono accelerati dall'hardware e molto più efficienti da calcolare per il browser. Come progettista UX, non posso sostenere questo approccio. Ciò non solo aiuta a ridurre lo spreco di dati, ma migliora anche la UX per i nostri utenti. Impostazione di un "budget dei dati" per ogni progetto Nei miei oltre 20 anni di UX, i progetti di maggior successo sono stati generalmente quelli con i vincoli più severi. Proprio come un progetto ha un budget finanziario, dovrebbe avere anche un budget per il carbonio e i dati. La logica Un budget dati è un limite rigido alla dimensione totale di una pagina (ad esempio, "Questa pagina di destinazione non può superare 1 MB"). Ciò costringe il team di progettazione a fare scelte difficili e intenzionali. Se desideri aggiungere un nuovo script di tracciamento o un peso del carattere fantasioso, devi “pagare” per questo ottimizzando o rimuovendo qualcos’altro. Ciò impedisce che lo “spostamento delle funzionalità” si trasformi in “spostamento del carbonio”. I dati Il modello Sustainable Web Design, sviluppato da pionieri come Wholegrain Digital, fornisce una formula per calcolare la CO2 per pagina visualizzata. Il sito web medio produce circa 0,5 grammi di CO2 per visualizzazione. Per un sito con 1 milione di visualizzazioni mensili, si tratta di 6 tonnellate di CO2 all’anno, equivalenti a guidare un’auto per 15.000 miglia. L'obiettivo progettuale La lista di controllo della UX sostenibile
Riduci le immagini Metti in discussione la necessità di ogni immagine e utilizza la risoluzione più piccola e i formati di file più efficienti (come AVIF) per ridurre al minimo il trasferimento dei dati. Ottimizza i videoElimina i media a riproduzione automatica e dai priorità ai loop brevi e altamente compressi per garantire che l'energia venga spesa solo sui contenuti che l'utente intende visualizzare. Limita i caratteri Utilizza un massimo di due pesi di caratteri Web o atteniti ai caratteri di sistema classici per rimuovere richieste del server non necessarie e rendering ingombrante. Ricicla le risorseRiutilizza una singola immagine o un video più volte utilizzando filtri CSS e sovrapposizioni per creare varietà visiva senza aumentare il peso totale della pagina. Scegli Green Hosting Ospita i tuoi prodotti digitali su server verificati da The Green Web Foundation per assicurarti che siano alimentati da fonti di energia rinnovabile. Riduci al minimo la distanza dei datiSeleziona posizioni server geograficamente vicine al tuo pubblico principale per ridurre l'energia necessaria affinché i dati viaggino attraverso l'infrastruttura fisica.
Il business case per un design ecocompatibile Alcuni potrebbero obiettare che “Green UX” sembra un compromesso sulla qualità. Al contrario, è un vantaggio competitivo. Il design sostenibile è design prestazionale. Quando riduci il peso della pagina, il tuo sito si carica più velocemente. Quando il tuo sito si carica più velocemente, i tuoi Core Web Vitals migliorano. Quando i tuoi Core Web Vitals migliorano, il tuo ranking SEO aumenta. Inoltre, gli utenti che utilizzano dispositivi più vecchi o piani dati più lenti (soprattutto nei mercati emergenti) possono effettivamente accedere al tuo prodotto. Questa è la definizione di “design inclusivo”. Riducendo il “grasso digitale”, creiamo un web più snello, più veloce e più accessibile. Ci stiamo allontanando dal “design usa e getta” degli anni 2010 verso aun’architettura digitale più permanente e rispettosa. Conclusione: il futuro del design “pulito”. Nei miei due decenni di design, ho visto molte tendenze andare e venire. Scheuomorfismo, Flat Design, Neumorfismo: erano tutte scelte estetiche. Ma la UX sostenibile non è una tendenza; ora è una necessità. Siamo la prima generazione di designer che deve fare i conti con le conseguenze fisiche del nostro lavoro digitale. La UX sostenibile è una soluzione vantaggiosa per tutti. È meglio per il pianeta perché riduce il consumo di energia. È meglio per l’utente perché si traduce in interfacce più veloci e reattive. Ed è meglio per l’azienda perché riduce i costi di hosting E migliora i tassi di conversione. L’era dei “pixel illimitati” è finita. Nel 2026, il design più sofisticato è quello che lascia l’impronta più piccola. Non siamo più solo designer; siamo i guardiani della batteria dell'utente, del suo piano dati e, in definitiva, dell'ambiente. L'invito all'azione Ti sfido a controllare solo una pagina del tuo progetto attuale oggi. Utilizza uno strumento come il calcolatore del carbonio del sito web per verificarne l'impatto. Quindi, cerca i “rifiuti invisibili”. Quell'immagine può essere un SVG? Può quel video essere un eroe statico? È possibile mettere a tacere quell'animazione "rumorosa"? Inizia in piccolo. La soluzione più elegante è spesso quella con il minor numero di byte.