Petite histoire du design responsable

L’éthique est le nouveau leit­mo­tiv de nos socié­tés : depuis plusieurs années les scan­dales envi­ron­ne­men­taux, éthiques et sociaux se multi­plient sur les réseaux sociaux et dans les médias ; ils nous font prendre conscience petit à petit de l’im­pact de nos actions sur notre monde.

Un vent de chan­ge­ment souffle et s’ins­talle dans notre manière de consom­mer : coopé­ra­tives, produc­teurs locaux, compen­sa­tion de l’em­preinte carbone, retour au DIY, etc… En d’autre termes : consom­mer moins pour consom­mer mieux tout en prenant soin de nous et du monde qui nous entoure.

Ces chan­ge­ments profonds impactent toutes les couches de la société, y compris le design. Comment agir en tant que desi­gner ? C’est une ques­tion à laquelle nous allons tenter de répondre.

Comprendre, pour commen­cer à agir.

La révo­lu­tion numé­rique a permis une accé­lé­ra­tion dras­tique du rythme d’évo­lu­tion et de consom­ma­tion, pour le meilleur mais aussi pour le pire.

Gafa, Netu et consorts font désor­mais partie de notre paysage,  mais l’im­pact envi­ron­ne­men­tal du numé­rique n’est pas toujours bien connu. Voici, quelques chiffres pour comprendre l’am­pleur du phéno­mène :

Une nouvelle pollu­tion

La déma­té­ria­li­sa­tion a intro­duit des tech­no­lo­gies éner­gi­vores qui vont à l’en­contre de la promesse faite aux consom­ma­teurs : réduire la pollu­tion notam­ment en rédui­sant la quan­tité de papier. Para­doxa­le­ment, plus on déma­té­ria­lise plus on utilise de matières, plus on minia­tu­rise et complexi­fie les compo­sants plus on alour­dit l’im­pact envi­ron­ne­men­tal.

Le bilan est sévère ! Une nouvelle forme de pollu­tion est appa­rue : la pollu­tion numé­rique, engen­drée en grande partie par la fabri­ca­tion de nos diffé­rents devices. Toutes les étapes du cycle de vie d’un objet, depuis l’ex­trac­tion des matières premières qui le composent, jusqu’à son élimi­na­tion en fin de vie, génèrent des émis­sions de CO₂. Ces cycles sont ceux qui demandent le plus d’éner­gie, de trai­te­ments chimiques, de métaux rares, et sont plus polluant que le fonc­tion­ne­ment en lui même de l’ap­pa­reil.

Qui sont les pollueurs ?

Il serait diffi­cile de tous les énumé­rer tant ils sont nombreux, mais voici les prin­ci­paux pollueurs :

Les datas centers :

Derrière chaque plate­forme que nous utili­sons se cache un data center permet­tant de stocker, gérer et distri­buer le contenu que nous consom­mons. Ce sont des centaines d’or­di­na­teurs fonc­tion­nant sans inter­rup­tion à pleine puis­sance,  qui, pour éviter la surchauffe ou la panne ont besoin d’être refroi­dis en perma­nence. Ces centres sont de véri­tables gouffre éner­gé­tiques consom­ma­teurs d’éner­gies fossiles (majo­ri­tai­re­ment du char­bon). En plus d’être polluants, ils ont un impact supplé­men­taire sur l’en­vi­ron­ne­ment à cause des produits chimiques néces­saires à leur fabri­ca­tion (batte­ries, proces­seurs…). Ils repré­sentent 2% du total des émis­sions de gaz à effet de serre, autant que l’avia­tion et l’in­dus­trie. Actuel­le­ment la plupart des géants d’in­ter­net cherchent à être plus respec­tueux de l’en­vi­ron­ne­ment en se tour­nant vers des éner­gies renou­ve­lables, des système d’éva­po­ra­tions, le contrôle de tempé­ra­ture, une réduc­tions des serveurs en heures creuses ou encore en construi­sant des centres dans des pays au climat natu­rel­le­ment froid. Google a, pour sa part, implanté un de ses centres en Finlande, où les serveurs sont refroi­dis grâce à l’eau de mer, glaciale. Dans les faits ce type de solu­tions reste margi­nal, de plus en plus de pays exigent que leur données soient stockées sur des serveurs situés sur leur terri­toire, notam­ment en raison de la légis­la­tion sur les données person­nelles (comme en Europe avec RGPD).

Si vous voulez en apprendre plus sur les Data center, nous vous invi­tons à lire l’ar­ticle paru dans Le Big Data sur ce sujet : ”Comment réduire l’im­pact des data center sur l’en­vi­ron­ne­ment“, afin de comprendre les enjeux liés aux data centers.

Le strea­ming vidéo et la vidéo à la demande :

Vous êtes vous déjà demandé ce qui se cachait derrière les plate­formes comme Netflix, Amazon Prime vidéo ou encore Youtube ?

Le strea­ming vidéo repré­sente aujourd’­hui 60, 6% du trafic global sur inter­net, que l’on peut décou­per en 4 grands types de conte­nus :

• La vidéo à la demande (Netflix, Amazon Prime, Open Load…) occupe 34% du flux de données mondiales de la vidéo en ligne,
• La porno­gra­phie repré­sente 27%,
• Les tubes (vidéos courtes héber­gées sur des plate­formes comme YouTube) repré­sentent 21%,
• Les vidéos héber­gées sur les réseaux sociaux repré­sentent 18%

Bon à savoir : 10h de vision­nage de vidéo HD en ligne polluent autant que l’en­semble des articles Wiki­pé­dia en ligne ! Netflix à lui seul repré­sente 13% de la bande passante mondiale et 25% en France!

Toutes ces plate­formes sont de plus en plus éner­gi­vores, en grande partie à cause de l’ac­crois­se­ment de la qualité vidéo, mais égale­ment par les ressources qu’elles mobi­lisent (équi­pe­ment, réseaux, data centers…). Il appa­raît clair que la pollu­tion liée à la consom­ma­tion de vidéos en strea­ming va s’ac­croître, la demande étant gran­dis­sante. En tant que consom­ma­teurs, vous comme moi, il serait inté­res­sant de réflé­chir à une doctrine concep­tua­lisé par Frédé­ric Bordage : la sobriété numé­rique. Ce terme désigne la démarche qui incite à un usage modéré du numé­rique et qui alerte sur l’em­preinte carbone de ce secteur, et notam­ment sur la consom­ma­tion éner­gé­tique.

Le cloud :

C’est devenu un outil indis­pen­sable au quoti­dien : stocker, parta­ger, avoir accès à tout moment à nos fichiers depuis n’im­porte quel device a changé notre manière d’or­ga­ni­ser nos données. Le revers de la médaille, c’est que le cloud ce sont… des data centers. La boucle est bouclée.

Les mouve­ments émer­gents

Forts de ces constats, de nombreux cher­cheurs intro­duisent depuis plusieurs années la notion envi­ron­ne­men­tale dans leur réflexion et leur manière de conce­voir. L’ap­proche du design est en train de subir une muta­tion à suivre de près.

L’ex­pé­rience utili­sa­teur : premier rempart au gaspillage d’éner­gie

Donald Arthur Norman, cher­cheur en sciences cogni­tives, est l’un des précur­seurs de l’UX. Il intro­duit la notion “d’ex­pé­rience utili­sa­teur”, dans un livre inti­tulé “The Design of Every­day things” publié en 1988. Contrai­re­ment à ses prédé­ces­seurs (concen­trés sur le système et le look and feel), Norman concentre ses recherches sur les besoins de l’uti­li­sa­teur. Il défi­nit l’UX comme une façon de conce­voir le monde en mettant l’ac­cent sur la fabri­ca­tion de produits utili­sables et compré­hen­sibles, souhai­tant couvrir au maxi­mum tous les aspects de l’ex­pé­rience qu’aura une personne avec le système.

De nos jours ce terme s’est large­ment répandu : l’UX, en privi­lé­giant l’ef­fi­cience de l’ar­chi­tec­ture de l’in­for­ma­tion et les besoins de l’uti­li­sa­teur, s’ins­crit dans une démarche d’éco-concep­tion visant à élimi­ner le super­flu, pour ne garder que l’es­sen­tiel et donc limi­ter la consom­ma­tion d’éner­gie. Permet­tant ainsi à l’uti­li­sa­teur d’op­ti­mi­ser son temps, et de trou­ver plus rapi­de­ment les infor­ma­tions voulues. L’ex­pé­rience utili­sa­teur en ne conser­vant que l’es­sen­tiel, permet aussi de réduire les coûts de déve­lop­pe­ments.

Le saviez vous ?

Une des premières traces de cas pratique écrite, de ce que nous appe­lons aujourd’­hui l’ex­pé­rience utili­sa­teur date­rait de 1430. Léonard de Vinci, fut chargé de conce­voir la cuisine pour une fête orga­nisé par le duc de Milan ; De Vinci imagine, conçoit et réalise des bandes pour trans­por­ter les aliments jusqu’aux prépa­ra­teurs. Même si cette expé­rience fut un désastre en termes d’in­gé­nie­rie, cette histoire porte la trace des pratiques de concep­tions d’ex­pé­rience utili­sa­teur à venir.

Un nouveau terme émerge très lente­ment : le Green UX !

Quelle diffé­rence avec l’UX me direz-vous? Les grandes lignes direc­trices du Green UX sont les suivantes :

• Réduire la pollu­tion dans notre proces­sus de travail
• Comprendre l’in­fra­struc­ture Inter­net et comment le design façonne la consom­ma­tion d’éner­gie,
• Ajou­ter une dimen­sion durable à la concep­tion des produits et travailler avec les compor­te­ments, les croyances et les atti­tudes humaines.

Il s’agit plus simple­ment de prendre en compte l’im­pact envi­ron­ne­men­tal avant de commen­cer la concep­tion et de le garder à l’es­prit tout au long de sa concep­tion., que ce soit par le choix de l’hé­ber­geur, du trai­te­ment des images, ou encore de propo­ser des fonc­tion­na­li­tés qui permettent d’agir sur un facteur polluant. Un exemple concret : Uber eats propose de ne pas ajou­ter de couvert en plas­tique à sa commande. Une petite fonc­tion­na­lité et un petit geste qui à long terme permet de réduire les déchets !

Le Circu­lar Design

Le Circu­lar Design est un concept qui est né chez IDEO, une des premières agences de design créée en 1991 aux États-Unis, égale­ment à l’ori­gine du désor­mais célèbre Design Thin­king.

Basée sur les prin­cipes de l’éco­no­mie et de l’éco­lo­gie circu­laire, il consiste à créer une de chaîne de consom­ma­tion durable, où un produit, au lieu d’avoir seule­ment un schéma clas­sique (créa­tion, vie et mort) s’ins­crit dans une chaîne d’uti­li­sa­tion ou de réuti­li­sa­tion. Ce concept invite à réflé­chir et à se remettre en ques­tion sur toutes les étapes de fabri­ca­tion, de distri­bu­tion, de vente, l’in­fluence du produit conçue sur les autres produits (autre­ment dit penser à l’éco­sys­tème du produit) et sur le rôle de tous les acteurs inhé­rents au projet. Ainsi, gâchis, déchets, dépenses inutiles, surcon­som­ma­tion sont évités ou au moins maîtri­sés. Ce modèle vous intrigue ? Rendez-vous sur le site dédié !

Le mouve­ment Green IT

Le mouve­ment Green IT a vu le jour en 1992 en réac­tion à l’im­pact envi­ron­ne­men­tal gran­dis­sant de l’IT. L’objec­tif de ce mouve­ment est de réduire l’em­preinte écolo­gique, écono­mique et sociale des tech­no­lo­gies de l’in­for­ma­tion et de la commu­ni­ca­tion (TIC) en prenant en compte les contraintes et les coûts en éner­gie des maté­riels infor­ma­tiques afin de mesu­rer et d’amé­lio­rer la consom­ma­tion d’éner­gie produite par notre envi­ron­ne­ment infor­ma­tique.

Green IT est égale­ment une commu­nauté, créée en 2004 par Frédé­ric Bordage, expert français du numé­rique respon­sable. Des acteurs du numé­rique respon­sable s’in­té­ressent à divers thèmes dont la sobriété numé­rique, l’éco-concep­tion des services numé­riques ou encore à la lowtech. Plus large­ment ils réflé­chissent et agissent pour un futur numé­rique alter­na­tif et respon­sable. Ouverte à tous, cette plate­forme encou­rage le dialogue, partage des conseils et des outils, pour que chacun puisse agir à son échelle.

L’éco-concep­tion et ses enjeux

De toutes ces influences et sphères est apparu le drapeau de l’éco-concep­tion, défi­nie par l’AFNOR en ces termes : l’éco-concep­tion c’est « Inté­grer l’en­vi­ron­ne­ment dès la concep­tion d’un produit ou service, et lors de toutes les étapes de son cycle de vie”. Il convient donc d’in­té­grer cette notion dès les prémices ! Une bonne éco-concep­tion comme une bonne UX demandent de se concen­trer sur l’es­sen­tiel et l’usage.

En plus des objec­tif écolo­giques ou écono­miques, l’éco-concep­tion promeut des valeurs sociales comme l’ac­ces­si­bi­lité physio­lo­gique et maté­rielle. Il faut consi­dé­rer que tous les utili­sa­teurs ne sont pas égaux et inté­grer les facteurs humains dans le proces­sus de réflexion : concrè­te­ment cela revient à faci­li­ter l’ac­cès aux appli­ca­tions numé­riques aux utili­sa­teurs en situa­tion de handi­cap, en rédui­sant par exemple le nombre d’ac­tions et les features super­flues.

Cette démarche intègre égale­ment les inéga­li­tés tech­no­lo­giques entre les utili­sa­teurs : qualité de connexion, ancien­neté des devices, et tout autre critère étant vecteur d’une utili­sa­bi­lité partielle ou totale en raison de facteurs externes divers.

Un des premiers avan­tages de l’éco-concep­tion est évidem­ment la réduc­tion de l’em­preinte carbone, une valeur ajou­tée appré­ciée des consom­ma­teurs comme gage d’in­té­grité éthique. Un autre aspect inté­res­sant est de limi­ter la concep­tion aux fonc­tion­na­li­tés essen­tielles, afin d’ob­te­nir un service qui se démarque de ses concur­rents en leur propo­sant une expé­rience simple et effi­ciente, sans features déve­lop­pées inuti­le­ment car inusi­tées.

Cette démarche présente égale­ment un avan­tage écono­mique pour les annon­ceurs : Il s’agit ici de limi­ter les coûts de concep­tion. Que ce soit en rédui­sant les dépenses en matières premières non néces­saires, ou dans le cadre d’un service numé­rique en rédui­sant ou suppri­mant les fonc­tion­na­li­tés super­flues, tout le monde y gagne ! Les frais de déve­lop­pe­ments sont maîtri­sés, l’ex­pé­rience utili­sa­teur est éprou­vée, les frais d’hé­ber­ge­ment sont plus faibles, les temps de char­ge­ment meilleurs, et les feuilles de style plus légères.

Les bonnes pratiques

Le chan­ge­ment commence par des petits gestes et des petites actions. Nous vous livrons quelques bonnes pratiques pour inté­grer l’éco-concep­tion dans nos métiers.

Dans la concep­tion tech­nique, et l’en­vi­ron­ne­ment profes­sion­nel :

• Choix d’un héber­geur “vert” : Les héber­geurs de ce type ont la parti­cu­la­rité d’uti­li­ser unique­ment des éner­gies renou­ve­lables pour faire fonc­tion­ner leurs data centers, mais aussi de les refroi­dir (le plus possible) par des moyens natu­rels.
• Utili­ser une élec­tri­cité verte : L’élec­tri­cité utili­sée pour le projet doit être produite à partir de sources d’éner­gies renou­ve­lables. Le plus simple pour y parve­nir est d’ache­ter des certi­fi­cats EECS / RECS pouvant être four­nis par votre four­nis­seur d’élec­tri­cité.
• Utili­ser des serveurs virtua­li­sés : mutua­li­ser les ressources machines en mettant en place la virtua­li­sa­tion. Une seule machine physique pourra se compor­ter et offrir la même souplesse que 2 serveurs. Le proces­seur et la mémoire vive seront utili­sés de façon opti­male tout en consom­mant moins d’élec­tri­cité que 2 serveurs physiques. Cette démarche permet égale­ment de réduire la quan­tité de déchets élec­tro­niques géné­rés par le site.
• Instal­ler le mini­mum requis sur le serveur : Suppri­mez tout ce qui n’est pas indis­pen­sable.
• Testez votre site, ou celui de votre choix pour voir son impact avec Ecoin­dex
• Choi­sir les tech­no­lo­gies les plus adap­tées : Il est essen­tiel de choi­sir l’ou­til le plus économe en fonc­tion de ses besoins et contraintes métier, parmi les 5 grandes familles de solu­tions

Pour la concep­tion et le design

• Élimi­ner les fonc­tion­na­li­tés inutiles, ou du moins les limi­ter. En effet plus une inter­face est dépouillée plus elle est simple d’uti­li­sa­tion ! Cela permet aussi de se concen­trer sur les vrais besoins de l’uti­li­sa­teur.
• Flui­di­fier le proces­sus en rédui­sant le nombres de pages, d’in­te­rac­tions ou d’étapes au stricte néces­saire. Cela réduit le temps néces­saire à l’uti­li­sa­teur pour atteindre ses objec­tifs ; le temps gagné c’est de l’em­preinte carbone en moins.
• Créer un site respon­sive qui s’adap­tera à la taille du device, pensez à aller plus loin en épou­sant la stra­té­gie “Mobile first” qui présente l’avan­tage de ne pas lais­ser de place à une multi­tude de features par forcé­ment utiles.
• Préfé­rez un design simple et épurée en vous appuyant sur les possi­bi­li­tés de l’HTML5 et du CSS pour conce­voir. Conce­vez en atomic design : Cela permet une concep­tion évolu­tive & homo­gé­néi­sée, et allège les feuilles de styles et le déve­lop­pe­ment.
• Si vous utili­sez un CMS, choi­sis­sez le léger : La plupart des thèmes privi­lé­gient l’es­thé­tique et la richesse fonc­tion­nelle au détri­ment de l’ef­fi­cience, de l’ac­ces­si­bi­lité, et de l’éco-concep­tion. Avant de choi­sir un thème, il est indis­pen­sable de véri­fier ses prin­ci­paux para­mètres tech­niques : taille du DOM, poids, et nombre d’al­lers-retours avec le serveur. On préfè­rera un thème mini­ma­liste – pas d’images ou d’icône pour l’in­ter­face, pas de compo­sants impor­tants tels que carrou­sel et Google Maps dyna­miques, etc. – quitte à rajou­ter des fonc­tion­na­li­tés essen­tielles en fonc­tion de son usage.
• Limi­ter le nombre et les styles de polices, au delà de l’as­pect esthé­tique cela limite la consom­ma­tion de données, préfé­rez les glyphes aux images (exemple les listes). Pour tout savoir du choix de police : c’est par ici
• Au niveau du CSS : Regrou­per les images de petite taille (inter­face du site par exemple) dans un ou des fichiers communs. Ce procédé permet de réduire signi­fi­ca­ti­ve­ment le nombre de requêtes HTTP. Beau­coup de services en ligne gratuits permettent de géné­rer ces spri­te­sheets.
• S’ap­puyer sur un ensemble de CSS plutôt que sur une seule CSS. Appe­ler unique­ment les CSS utiles en fonc­tion du contexte. Cela permet de limi­ter le poids de la page lors du premier télé­char­ge­ment, d’éco­no­mi­ser de la bande passante et de réduire la charge CPU. Pensez à four­nir un CSS print le plus dépouillé possible
• Au niveau des images : Pensez à adap­ter la qualité de vos images et à ne pas en abuser, en bref opti­mi­sez vos images ! Il en va de même pour les vidéos Redi­men­sion­ner les images en dehors du HTML (ne pas utili­ser les attri­buts “height” et “width”).
• Recy­cler des éléments : Une image peut servir à plusieurs endroits, ou être de nouveau utili­sée avec des filtres CSS pour en modi­fier l’as­pect.
• Opti­mi­ser les fichiers SVG. Le fichier a deux avan­tages : le premier est qu’il peut être modi­fié sans dégra­da­tion de qualité et il est moins lourd que les images Bitmap. De nombreux outils de réduc­tion et d’op­ti­mi­sa­tion sont dispo­nibles tels que Compres­sor.io, SVG Clea­ner, SVGO, etc Si vous pouvez, rempla­cez les images BITMAP par des CSS, des pictos, des glyphes ou des icônes four­nies par une webfont
• Privi­lé­giez les SVG , qui s’adapte mieux aux diffé­rentes dimen­sions d’écran.
• Pour décou­vrir les 115 bonnes pratiques pour l’hé­ber­ge­ment, le déve­lop­pe­ment, etc : c’est par là !

Pour conclure et aller plus loin

L’éco-design est un sujet riche et complexe, regrou­pant de nombreuses infor­ma­tions et acteurs à consi­dé­rer. Le plus impor­tant est de prendre conscience des impacts de nos gestes au quoti­dien et agir quand nous le pouvons, et ce même dans notre métier. On ne peut pas tout chan­ger radi­ca­le­ment du jour au lende­main mais pas à pas, chacun peut agir à son échelle tout en faisant le moins de mal possible à notre planète.

• Un livre de réfé­rence : Eco concep­tion web : les 115 bonnes pratiques, rédigé par Frédé­ric Bordage, un spécia­liste français du numé­rique respon­sable. Il partage à travers cet ouvrage des recom­man­da­tions simples et précises que vous pouvez appliquer à votre prochain site pour réduire son impact envi­ron­ne­men­tal.
• Un site (si vous n’êtes pas trop livre) : créée en 2004, GreenIT.fr est la commu­nauté des acteurs du numé­rique respon­sable et vous propose une check­list basé sur le livre de Frédé­ric Bordage, ainsi que des conseils !
• Un docu­men­taire sur l‘éthique dans le design réalisé par Gauthier Rous­silhe. On y retrouve le témoi­gnages de 12 desi­gners qui conçoivent avec des méthodes éthiques. Ce docu­men­taire apporte des éléments de réponses sur la respon­sa­bi­lité des choix du desi­gner et les valeurs éthiques, morales et humaines.
• Mesu­rer son empreinte carbone perso : Faire le test
• Des confé­rences vidéos pour l’ins­pi­ra­tion: James Chris­ties fonda­teur de Sustai­na­bleUX propose une confé­rence annuelle gratuite pour les concep­teurs UX et Web qui veulent lutter contre le chan­ge­ment clima­tiques.
• Un outil : Click­clean pour vous aider à savoir si vos appli­ca­tions favo­rites sont écolos
• Une appli­ca­tion : Greenly pour mesu­rer et suivre son impact via ses dépenses, simple intel­li­gent et effi­cace !

Prêt à chan­ger ? Vous avez envie de refondre votre site web pour en réduire l’im­pact sur l’en­vi­ron­ne­ment ? N’hé­si­tez pas à nous contac­ter