La société MedXL Conf+ a confié la refonte de son site de préparation aux ECN de médecine à l'agence bluedrop.fr. la plateforme e-learning, propulsée par Drupal 9, propose une architecture découplée avec ReactJS pour enrichir l'expérience des utilisateurs connectés, principalement des étudiants.
Nos missions
Une plateforme e-learning développée avec Drupal 9 et ReactJS
Le site conf-plus.com propose des contenus et une plateforme de préparation aux épreuves classantes nationales (ECN) de médecine depuis 2012.
Le projet de refonte du site a consisté dans la reprise des contenus pédagogiques, la réfection des parcours utilisateurs et la refonte technique de l'ensemble de la plateforme. L'agence bluedrop.fr a par conséquent pris en charge :
- La direction de la redéfinition de la charte graphique web et de son design system ;
- Le développement technique avec Drupal et React ;
- La conception des maquettes UI ;
- La refonte des parcours utilisateurs ;
- La reprise des contenus et utilisateurs accompagnés de leurs permissions ;
- L'hébergement du site ;
- La maintenance préventive, corrective et évolutive du site.
La charte graphique et la reprise des parcours
La refonte de charte graphique a été conduite en collaboration avec Gweno, qui a proposé une nouvelle identité au site (logotype, couleurs et positionnement de la marque). Efficace et moderne, sa déclinaison a été prise en charge par notre équipe de conception.
Les parcours utilisateurs ont été largement étudiés et évalués lors d’ateliers de design studio. Ils ont permis de confronter les bonnes pratiques UX avec la connaissance des utilisateurs de l’équipe de conf+ :
- La découverte des offres ;
- L’abonnement et le tunnel de vente ;
- Le parcours messagerie ;
- Le parcours « Dossier Progressif » ;
- Le parcours de consultation des fiches (apprentissage, question au conférencier) ;
- Le parcours « QI - Questions isolées » et leurs corrections ;
- Le parcours « TOPOS » ;
- Le parcours « Trousse du docteur ».
L’agence bluedrop.fr a pris en charge la création du design system et le déploiement des maquettes wireframes et graphiques, disponibles sur figma.
Le développement et la migration des contenus
L’équipe technique a profité de la puissance de Drupal dans la gestion des permissions pour configurer une plateforme avec de multiples rôles d’intervenants, du correcteur au contributeur, en passant par l’administrateur de la boutique et le client (l’étudiant ou son représentant). Nous retrouvons parmi les principales configurations :
Les interfaces d'apprentissage et de validation des connaissances découplées avec ReactJS
L’espace de travail, pour les étudiants, a fait l'objet d'un soin tout particulier pour garantir fluidité et adaptabilité des comportements. Si les contenus proposés aux utilisateurs anonymes sont construites dans la boite de Drupal, l’espace de travail des étudiants est généré par ReactJS, nourri par le module Json API désormais intégré au Core de Drupal
Ressources :