À Propos

Refonte d’Opigno LMS

Qu’est-ce qu’Opigno ? Opigno est une solution d’e-learning open source basée sur Drupal, développée par Connect-i. La refonte d’Opigno LMS vise à moderniser la plateforme, la rendant facilement personnalisable, avec un design flexible, capable de s’adapter aux besoins de divers secteurs. De plus, elle doit respecter les normes d’accessibilité (WCAG) pour offrir une expérience inclusive à tous les utilisateurs.

Thèmes
User Experience
Design sytem
Wireframe
Prototyping

Entreprise
Connect-i Sàrl

Période
Mai 2021 – Septembre 2021

Aperçu

Problématique

Design obsolète : Le design et l’interface utilisateur d’Opigno 2 étaient obsolète et n’étaient plus en phase avec l’image de marque du site web.
Non-conformité aux normes WCAG II : Le manque de respect des normes d’accessibilité posait des obstacles pour certains utilisateurs.
Absence d’interactions sociales : La plateforme ne favorisait pas les interactions entre utilisateurs, un besoin crucial dans l’e-learning moderne.
Non-optimisée pour mobile et tablettes : L’interface n’était pas adaptée aux appareils mobiles, impactant l’expérience utilisateur sur ces supports.
Ergonomie à améliorer : La navigation et l’expérience utilisateur manquaient de fluidité et d’harmonie, rendant la plateforme difficile à utiliser.

Objectifs du projet de refonte d’Opigno LMS

Harmoniser le design : Créer une cohérence entre le design de la plateforme et celui du site web principal.
Améliorer l’ergonomie et la navigation : Simplifier l’accès aux fonctionnalités clés tout en réduisant les frictions dans la navigation.
Ajouter des fonctionnalités de social learning :
1. Personnalisation des profils utilisateurs.
1. Mise en place d’un flux social pour permettre les échanges de médias et de messages.
1. Création de communautés pour encourager les interactions entre utilisateurs.
Créer un design neutre et personnalisable : Le design doit être adaptable à un large éventail de clients, tout en étant responsive pour les tablettes et smartphones.
Respecter les normes WCAG II : S’assurer que la plateforme est accessible aux personnes en situation de handicap.

Mon Rôle dans la refonte d’Opigno LMS

En tant que UX/UI designer principal sur ce projet, j’ai dirigé la stratégie de design, conçu les wireframes et les prototypes, et développé un design system complet. Mon travail a inclus :

Développement de solutions UX/UI pour améliorer l’intuitivité et l’engagement de la plateforme.
Design system modulaire pour permettre une personnalisation rapide et efficace selon les besoins des clients.
Rédaction des spécifications techniques des nouvelles fonctionnalités pour assurer une exécution conforme aux objectifs.
Collaboration étroite avec le Responsable des Ventes et le Lead Developer pour aligner les choix de design avec les attentes des clients et les contraintes techniques.

La première phase de conception pour Opigno 3.0 a duré trois mois, avec des améliorations continues jusqu’en 2024, pour offrir une solution adaptée aux besoins de chaque client et intégrant des choix techniques optimisés.

Analyse de l’existant

Dans cette phase de découverte, nous avons procédé à une analyse approfondie d’Opigno 2 pour identifier les points à améliorer en termes de design, d’ergonomie et d’accessibilité. L’analyse a révélé des limitations en matière de navigation, de cohérence visuelle et d’adaptation pour les appareils mobiles, nuisant à l’engagement des utilisateurs.

Le design du site web a été mis à jour, ce qui a créé une déconnexion visuelle avec les interfaces de la plateforme Opigno LMS, qui ne sont plus en adéquation avec le site opigno.org.

En recueillant les retours de l’équipe de vente et de la communauté Drupal, nous avons cerné des attentes majeures : davantage d’interactions sociales, une personnalisation accrue pour les organisations, et une interface accessible et fluide. Ces insights ont servi de base pour orienter les priorités de la refonte vers une plateforme plus moderne et personnalisable.

Le modèle économique de Connect-i repose sur la vente de nouvelles fonctionnalités et la personnalisation de la plateforme. Il est donc essentiel que la plateforme reste facilement personnalisable et neutre, tout en répondant aux normes d’accessibilité.

Description du projet pour la refonte d’Opigno LMS

Pour la refonte d’Opigno 3, nous avons identifié trois types principaux d’utilisateurs, chacun ayant des Pour répondre aux différents besoins de la refonte, nous avons identifié trois profils d’utilisateurs aux besoins spécifiques :

Administrateur : Gère la plateforme, les rôles utilisateurs et le contenu, garantissant le bon fonctionnement global.
Manager : Crée et gère les parcours de formation, supervise les classes et suit les progrès des apprenants.
Apprenant : Suit les parcours de formation, consulte sa progression, et interagit avec les managers et autres apprenants via des fonctionnalités de social learning.

Ces profils ont orienté le design pour une expérience optimisée répondant aux attentes de chaque type d’utilisateur.

Nouvelles Fonctionnalités Implémentées

Flux social général pour le partage de médias et d’éléments Opigno (formations, badges, certificats).
Interactions sur les publications dans le flux social.
Gestion des connexions entre utilisateurs.
Messagerie directe, one-to-one ou en groupe.
Création et gestion de communautés.
Profils utilisateur avec paramètres de visibilité public/privé et affichage des réalisations.

Wireframes

Les wireframes low-fidelity ont été conçus pour tester rapidement les dispositions et l’organisation de l’information sur les principales pages d’Opigno LMS. Cette étape a permis de valider les structures de base et d’assurer que la navigation était intuitive avant de passer aux détails visuels. Les wireframes ont également facilité les échanges avec les parties prenantes, permettant d’obtenir des retours précoces et d’itérer efficacement sur la mise en page et les fonctionnalités essentielles.

Prototypes Haute Fidélité & Design System

Les maquettes détaillées pour desktop et mobile ont été développées afin d’affiner l’apparence visuelle et les interactions principales d’Opigno LMS. Un design system moderne et cohérent a été élaboré pour assurer une personnalisation rapide des interfaces selon les besoins spécifiques de chaque client, tout en maintenant une identité visuelle alignée avec le site web d’Opigno et en respectant les normes WCAG. Enfin, des prototypes interactifs ont été créés pour valider les nouveaux flux utilisateurs, offrant une expérience plus intuitive et engageante pour tous les profils d’utilisateurs.

Résultats clés de la refonte d’Opigno LMS

La refonte d’Opigno LMS a permis de transformer l’interface et l’expérience utilisateur de manière significative. Voici les principaux résultats obtenus :

Interface modernisée et harmonisée : Amélioration de la hiérarchie visuelle et de la navigation pour rendre l’utilisation plus fluide et intuitive, tout en créant une interface plus cohérente.
Fonctionnalités sociales intégrées : Ajout d’un flux social, de la messagerie et de la création de communautés pour encourager les interactions entre utilisateurs.
Retour positif des clients : Les clients ont exprimé leur satisfaction quant à l’aspect esthétique de la plateforme, soulignant l’harmonie visuelle et la modernité du design.

Outils utilisés

Figma : Pour le design UI, les prototypes et le design system.
Adobe XD : Pour les wireframes initiaux et les premières esquisses de design.