In the previous article, we explained the overall project to redesign the Loire-Atlantique department’s websites.
Read the rest of the article to gain a better understanding of the strategic directions taken during the project. We’ll look at both the major accessibility and Design System issues involved in this overhaul.
Large-scale project: defining your strategic focus
Initiate the project at the main site, then roll it out to other sites
Given the very broad technical and functional scope of the project, the priority target was naturally the Department’s main website. This site is the best known and most used by users.
The following sites have been redesigned to date:
Strengthen our support for customer teams
To adapt and ensure the success of the project deployment, the Digiwin team strengthened its support methodology to be closer to the customer. The pillars of the famous agile method helped shape the project’s new direction:
Agility in a project of this kind involves a number of different aspects. The new approach involves cascading the site redesign through the various internal and external project stakeholders, working hand in hand. In practice, the system implemented is as follows:
- Bringing Digiwin’s human resources into the Department’s premises for greater interaction between the various players and to bring more interaction and collaboration into the project,
- Redesign the sites one by one, starting with the drafting of technical specifications for each site by the Department,
- Redesign a site step by step with different sprints and readjust as you go along, using an iteration logic,
- Carry out each sprint through phases of design, development and validation, passing through various multi-skilled players to ensure that each stage is successfully completed,
- Take advantage of the redesign of the following sites to adjust the Design System and the various issues involved in the project.
Project completion becomes smoother, with less downtime, and more interactive and collaborative. What’s more, this way of working reinforces the human aspect of the project, bringing teams closer together.
Building a Design System to meet accessibility requirements
To adapt the templates, optimize content structuring and facilitate the contribution of each site, Digiwin planned to work on both the Jalios architecture and the Design System. In addition, the Département de Loire-Atlantique has chosen to make the site publicly accessible.
Focus on the Design System
Definition: The Design System is a library of components, visuals and principles in reusable code. It becomes the UX/UI reference kit.
Not forgetting that, as part of the project, this Design System must meet other requirements such as Mobile First design and accessibility (in its development and final visual rendering).
The advantage? Contributors create their own content without worrying about page layout: they choose only the page template. Each time the Design System is updated, all templates are automatically updated.
What are the steps involved in creating the Design System for this project?
- Design wireframes to structure the sample pages and a UI Kit for the web design of the various components,
- Create graphic guidelines to define the final graphic charter. Here, these ideas were tested and validated by a panel of people with disabilities (particularly visual impairments),
- Continuous development, cutting and testing of components by multi-disciplinary teams.
Focus on accessibility
Definition: Web accessibility refers to the set of techniques and best practices aimed at making a site or application accessible to all – and in particular to “disabled” people in the broadest sense of the term.
See our article dedicated to accessibility and RGAA4 requirements to find out more.
The choices made by the Département de Loire-Atlantique to maximize accessibility:
- Test the models with a panel of people with disabilities (particularly visual impairments),
- AAA style sheet design,
- Select the most structured framework available,
- Audit the various parts of the Design System several times during the design and development process,
- Publish the Design System and open source code online to inspire and help other communities with accessibility,
- Train contributors in accessibility, so that they can write in a way that is more comprehensible to all.