Shom is a public administrative institution under the supervision of the Ministry of the Armed Forces. We are pleased to provide Drupal maintenance for the institution's websites, which we are gradually redesigning over time.
The Shom is responsible for the national hydrographic service and supports maritime and coastal public policies. In this role, Shom is in charge of managing the National Maritime Limits Portal (PNML) - limitesmaritimes.gouv.fr.
The Maritime Limits Portal (PNLM)
Established by Decree No. 2017-821, the National Maritime Limits Portal (PNLM) is the official portal for information on France’s maritime boundaries, in accordance with the United Nations Convention on the Law of the Sea (UNCLOS), also known as the Montego Bay Convention.
The founding principles of the portal are:
- Provide access to up-to-date regulatory texts (decrees) concerning maritime boundaries;
- Offer a geographic visualization with data access based on Shom data - https://data.shom.fr;
- Give access to a dedicated news section.
Since 2019, the PNLM Steering Committee, chaired by the General Secretariat for the Sea (SGMer), has planned to enrich the portal with new regulatory data not covered by UNCLOS, such as boundaries related to fishing zones, archaeological royalties, or traffic separation schemes.
The portal redesign project has therefore been set in this context of enhanced data, which also allows other data producers to contribute to the site (Marine Protected Areas, French Biodiversity Office, among others).
Redesign Objectives with Drupal
The redesign aims to address the necessary reorganization resulting from the integration of new regulatory boundaries and bringing the portal into compliance with the State’s new graphic charter (DSFR). The main objectives are accordingly:
- Through the integration of new (linear/area) layers from partners;
- By improving accessibility and the visibility of the portal’s maritime information;
- By enhancing the site’s architecture;
- By redesigning the user experience and applying the state design system;
- By offering a geographic interface right from the homepage;
- By meeting the requirements of the Government Information Service (SIG) specifications necessary for obtaining the .gouv.fr extension.
Scope of work:
- UX design
- UI design and DSFR deployment
- Drupal development
- Integration
- Testing and quality control
- Deployment
- Maintenance
UX and UI Design
Shom carried out an analysis of user expectations before issuing its call for tenders. This initial phase of meetings and feedback gathering from users of the old site helped focus attention on the main user journeys.
We subsequently conducted:
- A UX audit of the existing site, comparing it with the site's Analytics (statistics);
- Co-creation workshops for the wireframes;
- A user testing session following UI mockup creation.
Drupal Development
The site, developed with Drupal 9, has allowed for clearer data organization into four categories:
- Maritime boundaries;
- Boundaries related to marine environmental protection;
- Boundaries related to maritime traffic;
- Boundaries relating to use of the maritime public domain.
Regarding mapping, the current redesign project is limited to a map view sourced from https://data.shom.fr, produced by Shom. However, a migration project is under consideration, aiming for a “map library” type of visualization via OGC flows.
DSFR and Drupal Starter Theme
We took advantage of this first deployment of the French State Design System (DSFR) with Drupal to prepare a starter theme for our future projects. The theme is not yet finalized, but it aligns with our goal to practice atomic integration and use Storybook to allow integrators to work independently from backend development.
We also provide about ten user-friendly content paragraphs for contributors, who have access to a contribution interface that also uses DSFR, benefiting from its accessibility and clarity. The project also takes advantage of the stability of CKeditor5, now stable in Drupal Core.
Optimized Performance
With awareness of the page display performance requirements, the results have met the goals set at the start of the project.
The benefits for Shom are significant and can be summarized as follows:
- Easier publication of Shom geodata as open data that has not yet been distributed;
- Making regulatory data easier for everyone to visualize and use;
- Offering more varied regulatory data (from partners), supporting maritime and coastal public policies.
Thanks to the Shom teams for their cooperation!
Live release: 03/21/2023
Website URL: https://limitesmaritimes.gouv.fr/
Client testimonial – Marion Landart, project manager for the PNLM redesign:
“I wanted to thank you for your professionalism and responsiveness. Your analyses and skills allowed the PNLM redesign project to run smoothly. I remain available for any questions about this site.
Thank you again for your work.
Best of luck with Shom’s other projects
Congratulations to everyone 👏”
