L'Université de Rennes nous a confié la refonte de son annuaire de formations, un outil essentiel pour les lycéens, étudiants et salariés en reconversion. Notre objectif : clarifier et fluidifier l’expérience utilisateur en repensant la hiérarchie d’information et en optimisant le parcours de navigation.
Les enjeux du projet
Le projet visait à répondre à trois grands enjeux :
- Clarification de l’offre : Permettre aux utilisateurs de trouver facilement les informations, valoriser l’offre de formations.
- Facilitation des candidatures : L’annuaire étant un levier d’inscription central, celui-ci doit simplifier le parcours des futurs étudiants vers la candidature.
- Outil interne pour l’université : Fournir aux équipes pédagogiques un outil qu’elles peuvent s'approprier pour mieux valoriser leurs formations.
L'ancien site souffrait d'un manque de hiérarchie de l'information, rendant la navigation difficile pour les utilisateurs. Ainsi, l'enjeu principal du projet a été de restructurer le site pour apporter davantage de clarté. Nous avons donc repensé l'architecture globale afin de permettre aux étudiants de trouver facilement et rapidement les formations et informations pertinentes, en quelques clics seulement.
Un enjeu secondaire mais tout aussi important concernait la gestion des contenus. Afin de garantir l’homogénéité et la qualité globale du site dans le temps, nous avons mis en place un système de rôles facilitant l’administration du site par l'organe central de l’université d’une part, et des responsables de formation d’autre part.
Notre périmètre
- UX design
- UI design
- Mise en place du moteur de recherche Elastic Search
- Automatisation des fiches formations PDF
- Fluidifier la gestion des contenus pour les équipes de l’université.
Intégration du site dans l'usine à sites de l'Université de Rennes, orchestrée par Aegir et passage à Drupal 10
Dans le cadre de ce projet, une contrainte technique majeure résidait dans l'intégration de la solution développée au sein de l'usine à sites de l'Université de Rennes, orchestrée par Aegir, et du passage des sites à Drupal 10.
Aegir est un outil conçu spécialement pour Drupal. Il permet de créer facilement des sites Drupal en utilisant des profils d'installation, soit des modèles de sites déjà configurés selon les besoins. Face à la fin annoncée du projet Aegir, nous l'avons modifié pour prolonger son utilisation, notamment avec Drupal 10 et php8.
Ainsi, l'Université de Rennes profite de cette contribution technique : elle utilise notre patch Aegir-Drupal10 pour effectuer la mise à niveau progressive de tous ses sites vers Drupal 10, une opération stratégique prévue pour un déploiement en production en mars 2025.
Repenser l’expérience utilisateur
Nous avons travaillé à offrir à chaque apprenant un parcours utilisateur adapté à leurs besoins. Pour cela, nous avons tâché de centraliser toutes les informations utiles aux étudiants et simplifier leur accès grâce à une approche optimisée en matière d’ergonomie, de hiérarchisation de l’information et de lisibilité des contenus.
Plusieurs étapes de travail nous ont permis d’atteindre ce but :
- Analyse des parcours utilisateurs en place par nos UX designers.
- Benchmark UX : identification de bonnes et de mauvaises pratiques.
- Atelier de co-conception du parcours de recherche de formations.
- Wireframes : réalisation de maquettes structurelles du site (non mises en forme).
Partant de là, nous avons conçu la maquette graphique du site (UI design) en nous appuyant sur les wireframes et la charte graphique de l’université. Précisons que le périmètre du projet ne nécessitait pas une création artistique poussée, mais plutôt une harmonisation avec l’identité visuelle existante. L’objectif était de garantir une cohérence graphique tout en optimisant le temps et les ressources alloués au projet.
Un catalogue de formations conjuguant clarté et exhaustivité
Pour la page du catalogue de formations, nous avons opté pour un système d’accordéons, conjuguant ainsi exhaustivité et clarté. Ce dispositif permet à l’utilisateur d’obtenir une vue synthétique des formations disponibles, tout en lui offrant la possibilité de déplier les sections qui l’intéressent pour accéder à plus de détails.
Une présentation de l'offre de formations logique et simple
Dans la même veine, pour la présentation des formations, nous avons mis en place une hiérarchisation claire des contenus à travers un sous-menu de navigation. Il permet de structurer l’information de manière logique et pertinente, facilitant ainsi la compréhension et l’accès aux différentes sections pour l’utilisateur.
Automatiser la génération de fiches de formation PDF
Nous avons intégré une fonctionnalité permettant de générer automatiquement des fiches PDF à partir de chaque description de formation, offrant aux utilisateurs une version téléchargeable des informations clés. Bien que cette option existait déjà, elle nécessitait auparavant un report manuel fastidieux du contenu. Désormais, tout est automatisé, rendant le processus beaucoup plus rapide et efficace pour les administrateurs.
Nous avons également ajouté un QR Code unique par formation sur les fiches PDF, facilitant le partage d’informations sur mobile.
Mise en place du moteur de recherche ElasticSearch
Pour offrir aux utilisateurs un accès rapide et intuitif à l’information recherchée, il nous a fallu choisir un moteur de recherche puissant.
Après étude du besoin, notre choix s’est finalement porté sur ElasticSearch qui est au cœur de la navigation de l'annuaire. Notre travail a consisté à mettre en place et affiner ce moteur, en y intégrant des fonctionnalités avancées comme :
- L’autocomplétion des termes ;
- La gestion des synonymes et des variations grammaticales ;
- Un tri par pertinence pour améliorer les résultats de recherche.
La simplification du back-office pour les contributeurs
L'Université de Rennes souhaitait un système de publication et dépublication ciblée sur certains champs, par exemple pour corriger une description de formation incorrecte sans dépublier l'intégralité de la page. Or, le budget et le temps alloué au projet ne permettaient pas de répondre à cette demande. Face à cette contrainte, nous avons proposé une alternative économique et efficace pour respecter le budget tout en répondant en grande partie aux besoins du client : la mise en place du module Content Moderation. Ce module permet de configurer un workflow entre différents rôles définis : Superviseur, Référent service central, Référent composante et Administrateur.
Grâce à cette solution, les responsables de formation, professeurs et autres contributeurs peuvent librement saisir du contenu lié à leurs formations. L'organe central peut quant à lui superviser le tout, garantissant ainsi la qualité et l’harmonie globale du site.
Vers la réussite de votre projet digital : contactez-nous !
Nous remercions chaleureusement l'Université de Rennes pour la confiance qu'elle nous a accordée tout au long de ce projet.
Si vous avez un projet similaire ou des besoins en matière de refonte numérique, n’hésitez pas à nous contacter. Notre équipe se tient à votre disposition pour échanger sur vos objectifs et vous accompagner dans vos projets digitaux.
- URL : https://formations.univ-rennes.fr/
- Date du projet : janvier 2024 - septembre 2024
- Périmètre : UX design, UI design, développement Drupal.
©Photo de couverture Dom Fou
Université de Rennes
Pour plus d’informations, vous pouvez consulter notre étude de cas sur le sujet.
Nous avons retenu bluedrop.fr pour conduire la refonte de l'annuaire des formations de l'Université de Rennes. Grâce aux compétences techniques des équipes de développement, nous avons pu livrer dans les délais impartis un outil qui répond parfaitement à nos attentes. Le projet s'est déroulé de manière fluide, sans accroc ni tension, ce qui est à mettre au crédit du professionnalisme et de la patience des intervenantes et intervenants de ce projet.
