Introduction : concevoir moins pour concevoir mieux

Le numérique n’est pas immatériel. Chaque page web chargée, chaque requête envoyée, chaque vidéo lancée consomme de l’énergie, sollicite des serveurs, use des terminaux. Le poids moyen d’une page web a été multiplié par six entre 2010 et 2018, et la tendance n’a pas fondamentalement changé depuis. Dans ce contexte, l’éco-conception n’est plus un sujet réservé aux militants ou aux grands groupes en quête de communication RSE, c’est devenu une exigence de qualité à part entière.

Ce qui est remarquable, c’est que les principes de l’éco-conception et ceux de l’UX design convergent naturellement. Sobriété fonctionnelle, simplification des parcours, suppression du superflu, accessibilité, performance perçue… Ces objectifs sont communs aux deux démarches.
Bien intégrée, l’éco-conception ne contraint pas le design : elle le discipline, le clarifie, et le renforce.

Cet article propose une lecture de l’éco-conception sous l’angle méthodologique UX, et un guide pratique pour en faire un fil rouge tout au long d’un projet numérique.

1. Le cadre de référence : le RWEB du Collectif Green IT

Avant d’entrer dans la pratique, il est utile de poser le cadre. Le référentiel de référence en matière d’éco-conception numérique en France est le RWEB, publié par le Collectif Green IT sous l’impulsion de Frédéric Bordage. Dans sa 5ème édition (juin 2025), il recense 119 bonnes pratiques couvrant l’intégralité du cycle de vie d’un service numérique, de la conception fonctionnelle à l’hébergement, en passant par l’UX, l’UI, le développement et l’optimisation.

Ce qui distingue le RWEB des autres approches, c’est sa structure par cycle de vie et par profil métier.
Chaque bonne pratique est associée à :

• Un niveau d’impact environnemental (capacité à réduire les impacts)
• Un niveau de difficulté de mise en œuvre
• Un degré de priorité (de 1 à 5)
• Le tiers impacté (terminal utilisateur, réseau, serveur)
• Le profil principal en charge (UX, UI, développeur, architecte, chef de projet…)

Cette granularité permet à chaque intervenant d’un projet de savoir exactement ce qui relève de sa responsabilité, sans avoir à lire l’intégralité du référentiel.

L’intégralité du référentiel est librement consultable sur rweb.greenit.fr, organisé par étape de cycle de vie et par profil métier. Une check-list téléchargeable est également disponible pour auto-évaluer la maturité éco-conception d’un projet.
Le RWEB est souvent utilisé en complément du RGESN (Référentiel Général d’Éco-conception des Services Numériques, publié par la DINUM), qui fixe un cadre institutionnel plus général, notamment pour les projets publics.
Les deux référentiels sont désormais mappés entre eux dans la version 5 du RWEB, ce qui facilite leur utilisation conjointe.

2. Éco-conception et UX : une convergence naturelle

Il serait faux de présenter l’éco-conception comme une contrainte supplémentaire imposée au designer. En réalité, ses principes fondamentaux sont les mêmes que ceux d’une bonne pratique UX :

• Partir des besoins réels des utilisateurs, et non d’hypothèses ou de tendances, un produit sobre répond à un vrai besoin
• Supprimer le superflu : fonctionnalités inutilisées, contenus redondants, interactions qui n’apportent pas de valeur
• Simplifier les parcours : moins de clics pour accomplir une tâche = moins de requêtes, moins d’énergie, meilleure expérience
• Favoriser la performance perçue : un site rapide et léger est un site agréable à utiliser
• Concevoir pour tous les terminaux : y compris les appareils anciens ou les connexions faibles, ce qui rejoint les enjeux d’accessibilité et d’inclusion

Comme le formule Frédéric Bordage dans ses travaux : « Plus on intervient tôt, lors de l’expression du besoin et de la conception fonctionnelle, plus l’effet de levier est fort en termes de réduction de l’empreinte environnementale. » C’est précisément là que l’UX designer joue un rôle stratégique : il est celui qui peut ancrer l’éco-conception le plus en amont possible, là où les décisions ont le plus d’impact.

3. Guide pratique : intégrer l’éco-conception à chaque phase du projet UX

Voici un guide phase par phase pour faire de l’éco-conception un fil rouge de votre projet, pas un audit tardif ou une checklist de fin de projet, alors que la majeure partie des décisions impactantes ont déjà été prises.

Phase 1, cadrage et expression du besoin

C’est la phase la plus déterminante.
Les choix faits ici, périmètre fonctionnel, cibles, modèle de service, ont une influence considérable sur l’empreinte finale du produit.

Les bonnes questions à poser dès cette étape :

• Ce service numérique répond-il à un besoin réel et justifié ? Existe-t-il une alternative non-numérique ou moins impactante ?
• Quelles sont les fonctionnalités réellement indispensables versus celles qui « font bien » dans un cahier des charges ?
• Qui sont les utilisateurs cibles, et sur quels terminaux naviguent-ils majoritairement ? (terminaux anciens = contraintes de performance à anticiper)
• Quel est le cycle de vie attendu du service ? Est-il conçu pour durer, évoluer, ou être jeté rapidement ?

Ce que ça change concrètement :

• On questionne le scope fonctionnel avant même de wireframer. La sobriété fonctionnelle commence ici
• On documente les choix retenus et les fonctionnalités explicitement exclues, pour ne pas les voir revenir « parce que ça serait sympa »
• On intègre des critères éco-conception dans les critères de succès du projet, au même titre que les KPIs business

Chez Ludotic, nous intégrons ces enjeux dans nos phases de cadrage.
En savoir plus sur notre approche UX Strategy

Phase 2 , recherche utilisateur

La recherche utilisateur est l’alliée naturelle de l’éco-conception. Elle permet de valider les hypothèses sur les vrais besoins, et d’éviter de concevoir des fonctionnalités que personne n’utilise.

Éco-conception et recherche : les points de vigilance :

• Identifier les tâches réellement prioritaires : quelles sont les 3 à 5 actions pour lesquelles les utilisateurs viennent sur ce service ? Tout le reste est secondaire, voire superflu
• Observer les contextes d’usage réels : les utilisateurs sont-ils souvent en situation de mobilité, sur réseau faible, sur un téléphone d’entrée de gamme ? Ces contraintes doivent orienter les choix de conception
• Auditer l’existant sous l’angle de la valeur : si vous reconfigurez un service existant, quelles fonctionnalités sont réellement utilisées ? Les analytics peuvent révéler que 80 % du trafic se concentre sur 20 % des pages

Livrable recommandé : une cartographie des usages prioritaires, qui servira de filtre pour les décisions de conception ultérieures.

Nos experts réalisent des études d’usage, des tests utilisateurs et des entretiens.
Découvrez nos prestations UX Research

Phase 3, architecture de l’information et parcours utilisateurs

C’est ici que l’éco-conception devient très concrète pour l’UX designer. L’architecture de l’information détermine le nombre de clics nécessaires pour accomplir une tâche, la complexité de la navigation, et la quantité de données chargées à chaque étape.

Principes clés :

• Réduire le nombre de pages et d’étapes dans les parcours principaux : chaque clic inutile est une requête de plus, une page à charger, une donnée à transférer
• Éviter le scroll infini et préférer la pagination, qui charge le contenu à la demande et permet à l’utilisateur de contrôler sa navigation
• Hiérarchiser l’information dès l’architecture : ne pas tout mettre au même niveau réduit la navigation et le temps passé à chercher
• Limiter les dépendances transversales : un parcours qui mobilise 10 ressources différentes (APIs, services tiers, scripts) est plus lourd qu’un parcours autonome

Question de cadrage à poser systématiquement : « Est-ce que cette page, cette étape, cette fonctionnalité peut être supprimée sans dégrader l’expérience ? »

Phase 4, conception UX : wireframes et prototypage

La phase de conception est celle où les décisions éco-conception se traduisent visuellement. Chaque composant, chaque interaction, chaque contenu intégré au wireframe a un coût.

Pratiques à intégrer dès le travail de wireframe :

• Design minimal : ne représenter que ce qui est nécessaire à l’accomplissement de la tâche. Pas d’éléments décoratifs sans valeur fonctionnelle
• Éviter l’autoplay vidéo et audio : charger une vidéo sans sollicitation explicite de l’utilisateur est une mauvaise pratique UX autant qu’éco-conception
• Limiter les animations et transitions : elles consomment des ressources côté navigateur et peuvent créer des problèmes d’accessibilité. Quand elles sont justifiées, les concevoir légères
• Anticiper la gestion des images : au wireframe, indiquer les intentions (image fonctionnelle, illustrative, décorative) pour guider les choix de format et de compression en aval
• Penser mobile-first : concevoir d’abord pour le plus petit écran et la connexion la plus faible force à prioriser l’essentiel

Dans les prototypes : tester les parcours principaux avec des utilisateurs réels pour valider que les raccourcis fonctionnels ne dégradent pas l’expérience. Sobriété et utilisabilité ne sont pas contradictoires, mais elles doivent être vérifiées ensemble.

Phase 5, conception UI : maquettes et design system

L’UI designer prend le relais avec des leviers éco-conception spécifiques , sans sacrifier l’esthétique ni la cohérence de marque.

Bonnes pratiques UI orientées éco-conception :

• Palette de couleurs limitée et cohérente : moins de valeurs différentes = design system plus léger, plus cohérent, plus maintenable
• Nombre de typographies réduit : idéalement 1 à 2 familles de polices, et préférer les polices système (qui n’ont pas besoin d’être chargées)
• Formats d’images optimisés : AVIF ou WebP systématiquement, dimensions adaptées aux contextes d’affichage, compression sans perte de qualité perçue
• Lazy loading prévu dans les specs : indiquer dans les spécifications que les images hors viewport ne doivent pas se charger immédiatement
• Éviter les fontes icon au profit de SVG inline pour les icônes , plus léger et plus accessible
• Mode sombre natif : s’il est proposé, il peut réduire la consommation des écrans OLED

Dans le design system : documenter les choix éco-conception comme des décisions de design à part entière, au même titre que les règles d’accessibilité. Cela les rend durables et transmissibles.

Nous accompagnons nos clients dans la conception de maquettes haute fidélité et dans la mise en place de design systems.

Phase 6, tests utilisateurs et itérations

Les tests utilisateurs permettent de valider que la sobriété fonctionnelle n’a pas été obtenue au détriment de l’utilisabilité. C’est une vérification indispensable !

Ce qu’on vérifie à cette étape :

• Les parcours raccourcis sont-ils réellement compris et utilisés avec succès ?
• L’absence de certains éléments (animations, contenus riches) crée-t-elle de la confusion, de la frustration ou une expérience trop austère ?
• Les utilisateurs trouvent-ils l’information rapidement, ou la navigation sobre est-elle devenue trop réductrice ?

Les arbitrages : si un test révèle qu’un élément « lourd » est essentiel à la compréhension ou à la confiance de l’utilisateur (une vidéo explicative sur un formulaire complexe, par exemple), il faut l’assumer , mais le traiter avec soin (chargement à la demande, format léger, transcription disponible).

L’éco-conception ne justifie jamais de dégrader délibérément l’expérience utilisateur. Elle exige d’être créatif pour obtenir la même qualité d’expérience avec moins de ressources.

Phase 7, handoff et collaboration avec les développeurs

La phase de handoff (processus de passation entre les designers et les développeurs) est cruciale : des spécifications bien rédigées avec l’éco-conception en tête permettent aux développeurs d’intégrer les bonnes pratiques sans devoir les déduire eux-mêmes.

Ce que le designer UX/UI peut transmettre :

• Les intentions de performance cibles (temps de chargement, Core Web Vitals)
• Les indications de lazy loading, de formats d’images et de compression attendue
• Les composants identifiés comme potentiellement lourds (cartes interactives, vidéos, scripts tiers) avec des alternatives ou des conditions de chargement
• Les fonctionnalités à charger de manière conditionnelle plutôt que systématique

Une bonne pratique : intégrer un designer ou un UX référent dans les revues de code, au moins sur les pages ou parcours critiques, pour s’assurer que les intentions de conception sont respectées , y compris sur les questions de performance.

Phase 8, suivi post-lancement

L’éco-conception ne s’arrête pas au lancement. Un service numérique évolue, et son empreinte avec lui.

Les indicateurs à suivre dans le temps :

• EcoIndex : outil open source qui évalue l’empreinte environnementale d’une page web (score, volume de données transférées, nombre de requêtes, nombre d’éléments DOM)
• Lighthouse / Core Web Vitals : indicateurs de performance qui corrèlent directement avec la sobriété technique
• Taux d’accomplissement des tâches : un service sobre mais inutilisable n’est pas un bon service ! La mesure de l’utilisabilité reste indispensable
• Suivi du périmètre fonctionnel : à chaque évolution, poser la question « cette nouvelle fonctionnalité est-elle nécessaire ? » , pour éviter l’accumulation de dette fonctionnelle

4. Les autres dimensions de l’éco-conception à ne pas oublier

L’UX n’est pas le seul levier. Un projet vraiment éco-conçu doit aussi traiter les dimensions suivantes :

L’hébergement : choisir un hébergeur alimenté par des énergies renouvelables, situé géographiquement proche des utilisateurs cibles (la distance entre le serveur et l’utilisateur influe sur la consommation réseau). Plusieurs hébergeurs français proposent aujourd’hui des offres engagées en la matière.

L’architecture technique : limiter les dépendances à des scripts et services tiers (analytics, publicité, réseaux sociaux), chaque appel externe étant une ressource supplémentaire chargée sur chaque page.

Le contenu : préférer des contenus texte bien rédigés à des contenus vidéo systématiques, compresser toutes les images, éviter les formats GIF animés, ne pas embarquer de ressources inutilisées (polices, bibliothèques CSS/JS).

L’accessibilité : accessibilité et éco-conception sont souvent complémentaires. Un service accessible aux personnes en situation de handicap est généralement un service sobre, bien structuré, et performant sur tous les terminaux.

La durée de vie du service : un produit numérique conçu pour durer (avec un code maintenable, une documentation à jour, et une architecture évolutive) a un impact moins fort qu’un produit refait de zéro tous les 3 ans.

L’éco-conception en UX Design, notre conclusion

L’éco-conception n’est pas une contrainte venue s’ajouter à la complexité de l’UX design . Elle en est, au fond, une expression cohérente : concevoir ce qui est utile, supprimer ce qui ne l’est pas, et vérifier avec les utilisateurs que le résultat fonctionne vraiment.

Intégrée dès le cadrage et maintenue comme fil rouge tout au long du projet, elle produit des services numériques plus rapides, plus clairs, plus accessibles, et moins impactants pour la planète. C’est rarement un choix entre l’expérience utilisateur et la sobriété. C’est le plus souvent une invitation à concevoir mieux.

Chez Ludotic, nous accompagnons nos clients dans cette démarche : de la recherche utilisateur à la conception d’interfaces, avec toujours l’humain au centre et de plus en plus, la planète en ligne de mire.

Vous souhaitez intégrer l’éco-conception dans votre prochain projet numérique ?
Contactez nos experts

Références et ressources :

• Référentiel RWEB , Écoconception web, 5ème édition (2025) : rweb.greenit.fr
• Collectif Green IT : greenit.fr
• RGESN , Référentiel Général d’Écoconception des Services Numériques (DINUM)
• EcoIndex , Outil de mesure de l’empreinte environnementale d’une page web : ecoindex.fr
• Guide des Designers Éthiques (Collectif Conception Numérique Responsable)