Image
Usine Drupal de la Clinique des Champs Elysées

Clinique des Champs-Elysées

Refonte graphique
Développement
Optimisation
Ergonomie & UX
Maintenance
Evolution continue

La Clinique des Champs Elysées est un groupe international avec une flotte de sites Drupal en mode usine, permettant de présenter chacune de leurs cliniques et leurs spécialités.

Lifting réussi pour le site de la Clinique des Champs-Elysées

Contexte

La Clinique des Champs-Elysées est un client fidèle de Koriolis, qui gère la maintenance de leurs sites depuis de nombreuses années. Afin de rajeunir son site, elle a nous a confié la refonte graphique du front-end de leur usine.
La stratégie SEO et la conception graphique ont quant à elles été confiées à l'agence Pixalione, qui a réalisé les maquettes avec une approche mobile first et un design système.

Image
Capture d'ecran de l'accueil mobile du site de la Clinique des Champs-Elysées

Les challenges

L'objectif principal de cette refonte était de moderniser le site et de mettre en avant ses différentes rubriques, avec une esthétique se rapprochant des standards des réseaux sociaux. Développé il y a plusieurs années par plusieurs intervenants avant d'arriver chez nous en reprise de maintenance, le site souffrait d'une dette technique qui complexifiait la TMA et les projets d'évolution. Nous avons saisi l'occasion pour revoir le code en profondeur, le nettoyer et l'optimiser afin de revenir vers les bonnes pratiques et faciliter son exploitation future.

Pour le thème du site, les nouvelles maquettes faisaient la part belle à une approche atomique design. Koriolis a donc choisi de développer un nouveau thème sans aucune dépendance avec l'ancien, ce qui nous libérait des contraintes de l'existant.

En somme, cette refonte graphique a été un défi technique pour Koriolis, mais la confiance mutuelle avec la Clinique des Champs-Elysées a permis de mener à bien ce projet et de le remettre sur de bonnes fondations.

80
Nouveaux templates
145
Nouveaux fichiers SCSS
30
Nouveaux fichiers JS

Une approche component

Le projet de refonte du site a adopté une approche basée sur le design atomique, offrant de nombreux avantages.

Elle permet de factoriser le code, de le rendre facilement maintenable et d'améliorer les performances du site. En effet, chaque composant du site appelle uniquement les ressources dont il a besoin, ce qui améliore considérablement l'efficacité globale du site. Les pages sont moins lourdes à charger. Les modifications d'un composant se répercutent sur l'ensemble des pages où il est appelé, facilitant ainsi les corrections et les évolutions.
 

Image
Métriques Core Web Vitals
Métriques des Core Web Vitals d'une landing page du site


Koriolis a développé une suite de fonctionnalités en nodeJs, permettant de créer un template de champs, de blocs, de vues, etc., avec les fichiers SASS et JS associés en utilisant une simple commande. Cet outil offre un énorme gain de temps, permettant ainsi de réduire la phase de développement.

En somme, l'adoption d'une approche atomique dans la refonte du site a permis à Koriolis de développer un site performant, facilement maintenable et de respecter les délais du projet.

Résultat

La refonte graphique de la Clinique des Champs-Elysées met en oeuvre les dernières bonnes pratiques de développement web avec Drupal. En reprenant le code en profondeur, nous avons pu l'optimiser et obtenir d'excellents résultats, que ce soit pour la fluidité de navigation pour l'utilisateur ou les scores de performances  de Google (Web metrics).
Après quelques semaines de recul suite aux améliorations de SEO, nous voyons le trafic qui augmente régulièrement, validant ainsi la stratégie résultant du duo formé avec Pixalione et toute sa mise en oeuvre.

 

Nous sommes très contents de ce projet de refonte. Nous avons reçu de nombreuses félicitations pour le nouveau site qui est bien plus performant et optimisé.
Cette réussite a été possible grâce aux équipes de Koriolis, notamment Kévin et Nadine qui ont été très impliqués sur ce projet et sont toujours de bons conseils. Nous les en remercions vivement !
Céline P. - Clinique des Champs-Elysées
Vous avez un projet ?
Développons le ensemble !
Vous voulez voir le site ? c'est par là
Un projet ? Une question ?
Prenez rendez-vous avec Sébastien !
Sébastien Lissarrague, expert Drupal et fondateur de Koriolis
Fondateur & Directeur

Ou vous pouvez tenter votre chance en essayant de l'appeler 

Image
picto phone

 

 

Nos derniers articles

Image
Images responsives, écrans rétina ready et format Webp
Responsive Image
Webp
Retina
Performances
Image
A quoi s'attendre avec Drupal 10
Drupal 10