La Belle Déchette

Description

Depuis 2015, La Belle Déchette, propose des solutions et se met en action pour construire une société plus juste et durable. Elle est la première ressourcerie installée sur le territoire de Rennes métropole.

En 2022, ils ont souhaité refondre leur site web pour qu’il soit plus clair, lisible, fonctionnel et avec le moins d’impact possible sur la planète.

    Services

  • Conseil
  • Développement sur-mesure
  • Formation
  • Refonte totale
  • Site web vitrine
  • Ux design
  • Webdesign

Objectifs

  • Refonte du site web dans une démarche de sobriété numérique
  • Création d’un site fonctionnel, ergonomique et évolutif
  • Réservation de créneaux pour l’utilisateur-trice pour déposer des objets
  • Communiquer plus facilement, clairement sur le fonctionnement et les projets
  • Développer un espace d’administration simple et intuitif
intro visuel de la création de la belle déchette de Rennes Métropole

UX / UI Design éco-responsable

Avant la refonte du site internet, l’équipe de La Belle Déchette a réalisé l’arborescence. Je suis venu en conseils sur celle-ci pour l’optimiser au mieux pour l’utilisateur, travailler davantage le maillage interne pour le référencement et aussi réagencer certaines pages en une seule pour réduire son nombre total.

Après l’optimisation de l’arborescence, nous avons commencé les wireframes du site web pour un parcours utilisateur simple, utile, navigable, compréhensible, utilisable et accessible.

Concernant le design du site web, la ressourcerie rennaise souhaitait quelque chose avec des couleurs vives et un univers joyeux. C’est pourquoi je leur ai proposé un webdesign en néo-memphis. Un style avec des couleurs pop, des patterns et des contours très contrastés. Si vous souhaitez en savoir plus sur ce style, je peux que vous conseiller la vidéo de Basti UI.

Cependant, par rapport à leur identité visuelle ce style était trop impactant. Je suis donc parti sur un style plus soft répondant mieux à leurs attentes et à leur identité.

Typographies

typos pour le site web de La Belle déchette

Couleurs

couleurs du site web de la belle déchette de Rennes

Maquettes graphiques

Webdesign du site web en éco-conception de La belle déchette
mobile design de la resourcerie La belle déchette de Rennes
maquette design responsive et low-code créé par David-Daumer à la courrouze de Rennes
maquette graphique desktop à Rennes

Développement Web

Un gros travail a été effectué en amont pour les différents éléments graphiques du site web. Grâce au spritesheet que j’ai réalisé, nous avons pu réduire d’une vingtaine de requêtes le site web tout en gardant un aspect graphique en cohérence avec leur identité visuelle.

Malgré le soin de la recherche d’un système de réservation le plus sobre possible, la page des apports volontaires a été coûteuse en termes de requêtes et d’éléments du DOM.

Pour éponger la dette technique du système des apports volontaires, nous avons réduit davantage le nombre de requêtes et d’éléments du DOM sur les autres pages.

Performances Web

Performance éco à la mise en ligne :

• Ecoindex : catégorie A

  • Poids moyen des pages : 764,5Ko (Web actuel : 2286Ko)
  • Nombre moyen de requêtes par page : 27 (Web actuel : 71)
  • Taille moyenne du DOM : 238

• Website Carbon Calculator :

0,39g équivalent C02 à chaque visite du site (4.61g de CO2 en moyenne par page pour un site non éco-conçu selon Wholegrain Digital)

Informations des moyennes sur le web : Rapport de l’état du web de janvier 2023 du site https://httparchive.org

Performance globale sur la page d’accueil

  • Google Page Speed version ordinateur : 94/100
  • Google Page Speed version mobile : 99/100
  • Pingdom Tools : 99/100