B Lab

"Working on a comprehensive and in-depth approach to digital ecodesign is an experience in itself. It is a collective and unifying dynamic that requires discussions, back and forth, and compromises. And it touches on the entirety of the project: strategy, design, development, user experience. Engaging in digital ecodesign allows us to position the project at the heart of our societal and environmental concerns, and to give meaning back to our work."

Marion, Digital Consulting Director, 148 Agence Collective 

We conducted the "classic" design workshops for a redesign: structure, UX / UI. However, seen from the perspective of eco-design, it is a challenge at every step. UX and UI in particular required reflection around compromise. How to offer a navigation experience while forgoing the usual sophisticated elements that are costly in terms of eco-design criteria: sliders, images, videos, forms at the bottom of the page, etc.?

We therefore carried out these design phases with a common thread: to minimize, or even eliminate, the superfluous. Developers were involved very early in the project to assess and decide with us the impact and feasibility of our choices.

In a very open dialogue, we explored the path towards a solution that marries the strong commitment of a site focused on minimizing energy consumption with an educational approach.

Here, web design plays a major role: color, typography, the presence of graphic shapes and placeholders that compensate for the still unusual absence of visuals. A set of elements serving a fluid, intuitive journey, without “frills.”

On the technical side, among other things, no sliders, just one form, a reasoned use of JavaScript, the integration of an Analytics solution that does not require cookies. And to adapt to everyone's needs, the site incorporates a full accessibility solution (Facil’iti).

Natural SEO is worked on hand in hand between 148 Agence Collective and the B Lab teams, so that the site finds its place as a source of content on the label and the movement in the broadest sense. In this highly competitive theme, it was necessary to choose relevant keywords and work on precise semantic cocoons, without succumbing to jargon!

B Lab and 148 provided consistent and committed responses, but these do not always align with browsing habits, which can also be disrupted. To address this, we chose 2 complementary directions:

• education: quantifying energy savings and explaining the approach on a dedicated page accessible from a pop-up that appears upon arrival on the site and via a link in the header and footer: bcorporation.fr
• the possibility to disable the eco-designed mode: we created an off/on button that allows users to disable or reactivate the eco-design mode. What changes with this? The display of images in places where, by default, color placeholders are found.

This on-demand display is not found in the mobile version, where only the eco-designed version is offered. The mobile navigation aims to be as efficient and direct as possible... we had enough arguments to eliminate the superfluous completely.

"The teams from B Lab France and those from 148 Agence Collective collaborated openly throughout the redesign of our website. The concept of eco-design was particularly important to us, and the 148 teams were able to listen to this request to achieve the result we find truly satisfactory."

Louise, Communication Manager, B Lab France