2023 – 2024 · Environnement / PublicADEME
La refonte de recherche.ademe.fr : la recherche de l'ADEME quitte une rubrique d'ademe.fr pour un site à elle, rangé selon sa stratégie 2021-2027 et construit sur le DSFRLe système de design de l'État français : une boîte de composants et de règles visuelles communes à tous les sites publics. Il garantit qu'un site de l'administration ressemble aux autres et se lit de la même façon..
En 2021, un chercheur devait ouvrir cinq dossiers pour trouver les appels à projets. Comment lui faire reconnaître son sujet avant de chercher son guichet ?
- UX UI
- Product design
Situation
Une rubrique parmi dix, cinq dossiers plus bas
En 2021, la R&D de l'ADEME n'avait pas de site. Juste une rubrique d'ademe.fr parmi dix, rangée entre « À l'international » et « Médiathèque », avec son propre menu de sept entrées et la programmation des appels à projets cinq niveaux plus bas.
Le fond posait le même problème que la forme. Qui finance quoi, sur quels thèmes, comment l'ADEME organise sa recherche : même les chercheurs et les doctorants avaient du mal à s'y retrouver. Ce sont pourtant eux qui déposent les dossiers, souvent sur des sujets très pointus. Le site les perdait avant le premier formulaire.
Il fallait aussi parler aux entreprises, aux collectivités, au grand public et à la presse. Et penser à un dernier utilisateur, plus discret : l'éditeur de l'ADEME, qui fait vivre le site au quotidien dans DrupalUn logiciel qui permet de gérer un site sans toucher au code : on y écrit, on y range et on y publie les pages depuis une interface d'administration. et doit pouvoir publier une page sans appeler un développeur.
- niveaux de dossiers jusqu'aux appels à projets en 2021
- 5
- rubriques d'ademe.fr pour toute la recherche
- 1 sur 10
2021ademe.fr
- Recherche et innovation
- Financer les thèses, la recherche, l'innovation
- Dossier
- Financer un projet de recherche
- Programmation des appels à projets
Aujourd'huirecherche.ademe.fr
- Financer ma recherche
- Appels à projets de recherche
Tâche
Les chiffres d'abord, la stratégie ensuite
Montrer avant d'expliquer.
Ce public lit les chiffres avant les phrases. Sur la page d'accueil, ce que la recherche produit passe donc avant la stratégie qui l'organise, et toute l'ArborescenceLe plan d'un site, dessiné comme un arbre : les grandes rubriques, puis les pages rangées sous chacune. C'est ce qui décide combien de clics il faut pour trouver une information. suit les quatre priorités thématiques de la stratégie R&D 2021-2027.
J'ai porté toute la conception, de l'Architecture de l'informationLa façon de trier, nommer et ranger les contenus d'un site pour qu'on y trouve ce qu'on cherche. Elle se décide avant le moindre écran dessiné. jusqu'aux MaquetteLe dessin précis d'un écran, avec ses couleurs, ses textes et ses images, tel qu'il sera construit. Les développeurs s'en servent comme d'un plan., comme Product Designer chez Luminess, en lien direct avec l'ADEME, l'équipe de développement Drupal et un chef de projet. L'essentiel de l'effort est allé à la page d'accueil, avec une incursion dans l'administration du site.
- 01
Le système de design de l'État
Le DSFR s'applique en priorité. L'interface peut être personnalisée, à condition de ne jamais sortir de son cadre.
- 02
Plusieurs publics sur un même site
Chercheurs et doctorants d'abord, puis entreprises, collectivités, grand public et presse, chacun avec sa raison de venir.
- 03
Un site tenu en interne
L'éditeur de l'ADEME assemble les pages lui-même dans Drupal. Ce qu'il manipule compte autant que ce que le visiteur voit.
Action
Un chercheur commence par son sujet
Les décisions sont nées en ateliers internes avec les équipes de l'ADEME, à partir du contenu existant. Cinq gestes, dans l'ordre.
Ranger le site selon la stratégie
L'arborescence suit le plan de recherche 2021-2027, thème par thème. Chacune des quatre priorités devient une porte d'entrée, de la préservation des milieux à la transition écologique et société.
Les quatre thèmes de la stratégie 2021-2027 servent d'entrées au site. Nommer les menus d'après ce qu'on vient faire
« Financer ma recherche » mène au calendrier des financements en deux clics de menu. En 2021 : cinq niveaux de dossiers.
Six entrées de menu, dont une qui dit exactement ce que vient faire un chercheur : financer sa recherche. Faire de l'accueil une vitrine chiffrée
Trois ordres de grandeur ouvrent la page. 27 millions d'euros de budget R&D, environ 122 projets financés en 2024 et une cinquantaine de thèses accompagnées chaque année : ce sont les chiffres que l'ADEME affiche aujourd'hui, juste sous le titre.
Personnaliser sans quitter le DSFR
Les composants viennent du système de design de l'État. Le reste était à concevoir, à commencer par la hiérarchie, le ton et l'ordre des contenus, que le DSFR ne fixe pas.
Dessiner les outils de l'éditeur
Des GabaritUn modèle de page ou de bloc déjà mis en forme, que l'éditeur remplit avec ses textes et ses images. Toutes les pages gardent ainsi la même allure. de sections et des formats d'images reproductibles dans l'administration Drupal, pour que l'éditeur assemble une page sans repartir de zéro.
Le dispositif
- Période
- 2023 à 2024.
- Cadre
- Product Designer chez Luminess, en lien direct avec l'ADEME, l'équipe de développement Drupal et un chef de projet.
- Ateliers
- En interne, avec les équipes de l'ADEME.
- Outils
- DSFR, Figma, FigJam.
- Rôle
- Toute la conception, de l'architecture de l'information jusqu'aux maquettes, avec l'essentiel de l'effort sur la page d'accueil et une incursion dans l'administration.
Résultat
En ligne, rangé comme la stratégie
Le site est en ligne sur recherche.ademe.fr, fidèle aux maquettes, et la recherche de l'ADEME a enfin une adresse à elle.
L'ancienne rubrique s'ouvrait sur deux paragraphes de présentation institutionnelle. L'accueil actuel commence par ce que la recherche finance. La stratégie vient après.
- clics de menu jusqu'au calendrier des financements, contre cinq niveaux en 2021
- 2
Ce qui n'est pas mesuréAucun test n'a été mené avec les publics finaux. Les décisions reposent sur les ateliers internes et sur le contenu existant, et c'est la limite du projet.
Ce que j'en retiens
Le système de design imposé fixait les composants, mais l'ordre du discours restait à concevoir. J'ai mis la preuve en premier, parce que les lecteurs cherchent d'abord un ordre de grandeur. Et j'ai conçu les gabarits de l'éditeur en même temps que les pages, sinon le site se dégrade dès la première mise à jour.
Projets suivants
- Identité et packaging d'un miel artisanalPtit Abeille · 2025Donner au miel d'un apiculteur artisan un packaging haut de gamme, posé à la main pot après pot.
- RESET, refonte de marque d'une plateforme de mode éthiqueRESET · 2022Créer l'unique marketplace française pour comprendre et acheter la mode éthique.
- TACITEMinistère des Armées (MINARM) · 2024Refondre l'outil de 2003 qui organise les déplacements de tout un ministère.
- Bien chez soi, par l'OCIRPOCIRP · 2023 – 2024Mieux orienter les personnes en perte d'autonomie vers les aides locales et les bons interlocuteurs grâce à un dossier déjà rempli.
