A 3D digital twin to read Bordeaux Métropole's geothermal potential

Client
Bordeaux Métropole
Year
2024

The challenge

We support Bordeaux Métropole in developing an online platform for geothermal mapping and simulation. The tool builds on data and a mapping system specific to the metropolis and aims to encourage the use of geothermal energy, particularly among private actors, by offering drilling-cost estimates. It also helps raise public awareness of this renewable energy.

A 3D digital twin to read Bordeaux Métropole's geothermal potential

Project flow

01. Scoping and onboarding
02. Audit of the existing platform
03. Sitemap
04. Desktop and mobile wireframes
05. Desktop and mobile UI design
06. Art direction
07. QA and delivery

Study detail

Putting geothermal energy to better use thanks to data and 3D mapping

A 'digital twin' to reveal the geothermal potential of the territory

This digital-twin project was born from the observation that geothermal energy remains largely under-used, for lack of accessible tools to help the public and the construction and planning professionals concretely understand its potential. The goal of the platform is to roll out two strands in parallel:

  • a “public-facing” strand aimed at popularising this still little-known technology, which is often seen as complex,
  • and an “expert” strand, intended to encourage private and professional actors to adopt this renewable energy source.

The future ambition is to give users a level of detail going all the way down to reliable drilling-cost estimates. The main challenges identified are technical, human and strategic. No 3D solution has yet been developed in-house on this subject, and although the BM3D mapping by Magneto (a project we had the chance to work on) is powerful, it can’t be used directly because it would require significant adaptation work to meet the requirements of the metropolis’s visual identity. The platform has to rely on many internal data layers (350 layers, some of which go beyond the boundaries of the metropolis), drawn from varied sources (e.g. Keolis, BRGM), with constraints on reliability, freshness and readability. Finally, it has to strengthen Bordeaux Métropole’s autonomy in producing appealing 3D mapping interfaces, with a view to showcasing the territory and to technology watch.

Exploring, evolving, scripting: the key challenges

A two-pronged exploratory effort

From the very start of the project, two broad directions guide the design:

  • on one side, supporting the public in discovering geothermal energy and demystifying its principles,
  • on the other, building a decision-support tool for construction and planning professionals.

A base to question and improve

Initial mockups, built in Axure, serve as a base to question and improve. Three main journeys quickly stand out: discovering the topic, studying the geothermal potential of a zone or plot, and consulting the metropolis’s projects and resources. The challenge here is to evolve this structure without losing the readability of the initial information, while integrating the new needs that have been expressed.

Turning data into scenarios to better equip users

On the metropolis side, several upfront analyses are carried out. An in-depth study of the internal data layers (geological, thermal, cadastral), a benchmark of mapping and 3D tools, and the gathering of operational feedback. The requirement to offer a visually engaging experience from the first interactions with the platform comes through clearly in the discussions. The need for visual hooks and clear storytelling to guide the reading of the data leads the project team to favour in-house development, which is more adaptable to the requirements of user scenarios and visual representations: interactive zone sheets, 3D visualisations… The platform thus serves as an experimentation ground, to imagine the way to turn the business data into scenarios and above all to easily equip its users.

iMac displaying the homepage of the Bordeaux Métropole geothermal portal

Goal: making complexity accessible

Working with a segmented approach based on needs

To structure the experience effectively, we carry out a clear segmentation of the platform’s goals:

  • discovering geothermal energy,
  • studying the geothermal potential of a plot, an address or a specific municipality,
  • getting an overall view of geothermal energy across the metropolitan territory.

This segmentation guides the design of the journeys and the associated interactions. We define the key steps and the corresponding screens, from the home page through to the more specific cartographic visualisations. The approach is to offer a clear, progressive path to support users in their learning and in understanding complex data, through educational content, dynamic visualisations and study sheets. For instance, the home page presents a popularised introduction to geothermal energy, while the plot sheet offers two modes: public and professional, with a level of information detail tailored to each. This methodological choice directly addresses the project’s goal of making the platform easier to take up by very varied profiles, while ensuring technical and graphic consistency.

Screenshot of a Miro workspace showing a user-journey working board
Screenshot of a Miro workspace showing a user-journey working board

Offering data that is understandable and actionable

Allowing the user to turn exploration into decision

The platform design has to address the need to make geothermal energy readable, tangible and accessible to every audience: individuals, professional actors and local authorities.

To do this, we design an interface that adapts to different levels of expertise and intent. Each choice flows directly from this priority: making it easier to explore a technical subject, while effectively equipping users in their projects.

From the home page on, the platform offers different entry points based on the profile: individuals get more access to popularised content to understand geothermal energy, while professionals are directed straight to operational information such as the procedures, studies and technical data.

Beyond that, all the main features of the platform remain accessible outside the interactive map. An approach that ensures complete and inclusive navigation, particularly for users with a disability or those who prefer a more linear interaction.

A central search engine lets users run a search by entering an address, a plot number or by selecting a municipality. This single entry point simplifies access to the key features.

Project illustration

We place the interactive map at the heart of the experience. It lets the user display different layers of information: geothermal resources, existing projects, heat networks, cadastre, 3D buildings, grid layer (a gridding technique).

The map adapts to the user: it displays the whole metropolis in navigation mode and automatically zooms in when an address or municipality is entered, to offer the right level of detail.

In free-form exploration, the hatchings (green or yellow) on the map make the geothermal quality of an area immediately legible (excellent or good), while the location markers for existing projects and the heat-network routes provide concrete reference points. The project sheets accessible from these reference points extend this logic by displaying the associated technical and energy characteristics. The data is read in a progressive, personalised way, avoiding overload for users less familiar with the topic while still offering the possibility to go deeper for the more informed.

Mobile and tablet screens displaying the Bordeaux Métropole geothermal portal

For the user looking to go further with the information shown on a zone, when a cell in the “grid layer” layer is selected, a side drawer opens, offering a detailed study sheet. This sheet is designed with two levels of reading:

  • a public mode, simpler and more concise, displaying only the information accessible without technical background,
  • and an advanced mode, activated on demand, which reveals additional data such as flow rate, estimated power, proximity to a heat network, regulatory constraints or useful points of contact.

Each grid-layout sheet can be downloaded as a PDF, making it easier to use offline or in an administrative context. The aim of the feature is to ensure continuity between digital exploration and putting together a project file. Finally, the platform’s design isn’t just about usability or aesthetics: it is above all strategic, since it allows the metropolis to strengthen citizens’ ownership of the energy-transition challenges, while making reliable, actionable data available.

Mockup of a mobile phone displaying a sheet with technical information on geothermal energy
Mockup of an iMac displaying a sheet with technical information on geothermal energy
1 prototype
working

The user interface and the art direction

A dark design serving clarity

The art direction adopts a dark-mode interface, suited to today’s usage patterns.

The chosen palette goes from anthracite grey to deep purple, giving the whole a “technological” feel. It offers a welcome visual differentiation in a world where many interfaces look alike. These colours highlight the map elements in green and magenta as well as the geological core layers in brown and orange.

This contrast ensures optimal readability, even on low-brightness screens.

Project illustration

Mapping that’s accessible in dark mode

Accessibility requirements aren’t as strict for mapping as for more classic interfaces, but we wanted to push the map’s colour contrasts to meet the minimum values required for people who have trouble perceiving contrast correctly. A kit of working components and an element-usage guide are delivered with the project.

Integration into the metropolis’s visual identity

This dark-mode interface has to fit within Bordeaux Métropole’s visual identity. Platform users need to be able to identify where the data on display comes from. The metropolis represents an important mark of trust, reassuring users about the reliability of the information they’re consulting. The shape of the buttons, the typography, the iconography and the style of the BM illustrations are respected to fit within a visual continuity in the overall experience of the metropolis’s citizens.

Figma screenshot showing the colours used for the Bordeaux Métropole geothermal platform
Excerpts from the home page and a 'guide for professionals' page of the Bordeaux Métropole geothermal portal, in desktop version
77 screens
desktop and mobile delivered
Prototype
Mockup of a MacBook Pro displaying the Axure prototype of a Bordeaux Métropole mapping platform
Mockup
Mockup of a MacBook Pro displaying the graphic mockup of a Bordeaux Métropole mapping platform

Want to discuss your project?

Let's talk about your stakes, constraints and ambitions so we can build the best user experience together.

Contact us