Eco-design

Method

Towards digital sobriety

Eco-design is a new way of shaping interfaces. Sustainable design brings a wider view of the life cycle of the product or service you're offering, with a focus on energy impact. It's no longer a secret: digital pollutes. Energy-hungry servers, digital hardware tossed and replaced too often, video and streaming on a steep rise, and so on. The eco-design approach aims to reduce the digital impact of your site or service. Several routes are open to limit the impact or to make the website as "green" as possible.

What is eco-design for?

  • Reduce a service's environmental footprint across its whole life cycle, from design through to decommissioning.
  • Avoid shutting out users on older hardware or with a limited connection
  • Streamline user journeys and content, which also benefits organic search.
  • Put feature trade-offs on an objective footing, weighing their real usefulness against the resources they draw.
  • Make the approach verifiable, through an eco-design statement setting out the choices made and the objectives being tracked.

Why pursue eco-design?

  • To assess the energy footprint of your products and services
  • To surface your areas for improvement towards more digital sobriety
  • To optimise the performance of your website or mobile app

Good practices for UX/UI eco-design

Here is a non-exhaustive list of elements you can change or include:

01

Limit heavy content

Avoid carousels or sliders (or use them sparingly). Avoid videos as much as possible, and ban autoplay. Avoid infinite scroll, which is very resource-hungry.

02

Optimise visuals

Reuse the same images across the site as much as possible, to avoid overloading the server with too many visuals. Limit the use of photos by favouring icons; the .svg format is far lighter.

03

Design lightweight, responsive interfaces

Build mobile-friendly, responsive interfaces. Avoid autocomplete in text fields. Limit plugins and third-party services (and if you need to include any, offer users an on/off toggle).

04

Eco-friendly dark mode

Don't use absolute black #000000, which is very energy-hungry; favour a dark grey instead.

In practice

Committing to digital sobriety leads you to weigh complementary aspects of your products and services. You can go deeper on the topic by reading our blog article on digital eco-design and by downloading our eco-design checklist.

Frequently asked questions

A few of our case studies

High-fidelity mockups

High-fidelity mockups give the future screens their final form, to hand over to the project teams for integration.

Read more about High-fidelity mockups

Visual identity

The first element your users perceive, the visual identity conveys your industry and makes you easily identifiable.

Read more about Visual identity

Wireframe

A mockup with no graphic elements, describing the zones and essential components an interface should contain.

Read more about Wireframe

RGESN

The RGESN sets out eco-design criteria for digital services and serves as a reference for players in the sector.

Read more about RGESN

Opquast

Opquast gathers 245 web quality rules: accessibility, SEO, performance, security. Its standard and its certification give structure to practices.

Read more about Opquast

Digital accessibility

Digital accessibility makes products usable by everyone. In the digital field, the RGAA is the reference on the matter.

Read more about Digital accessibility

Ethical design

Ethical design factors in the impact on users from the design stage. It stands against dark patterns and raises the question of the designer's responsibility for their choices

Read more about Ethical design

Design system

A design system is a component library and the governance that comes with it. What sets it apart from a design kit, and when it becomes necessary.

Read more about Design system

Design pattern

A design pattern is a proven solution to a recurring problem: breadcrumb, modal, accordion. These conventions exist because they work for users.

Read more about Design pattern

Experience design

Experience design (UX design) shapes what the user encounters beyond the interface: journeys, emotions, contexts.

Read more about Experience design

User journey

The user journey breaks a process down into steps to surface user needs and expectations for a given goal.

Read more about User journey

Usability

Usability measures whether a product lets its users reach their goals with effectiveness, efficiency and satisfaction, as defined by the ISO 9241-11 standard. An essential component of UX.

Read more about Usability

Curious to learn more about us?

Everyone talks about user experience, service design, ergonomics...
It's not always clear, and you'd like to find out, or sharpen what you already know.

Let's talk