design system

<<<

contexte

Plusieurs besoins internes sont à l’origine de la conception du design system d'Agorize:

  • un manque de cohérence entre nos différents produits et pages utilisant plusieurs frameworks
  • une volonté de synchroniser au mieux les équipes de développement et le design (composants, naming, couleurs…)
  • améliorer l’efficacité et faciliter le travail de l'équipe produit en réduisant le temps de prototypage parfois long, répétitif et à faible valeur ajoutée afin de tester rapidement les propositions
  • trouver un moyen efficace pour partager les connaissances et faciliter l’onboarding des nouveaux arrivants.

design principles

La première étape de ce travail de refonte a été de déterminer les valeurs et principes du produit avec les équipes technqiue, marketing et produit.

Cohérent
Agorize est découpé en plusieurs produits à destination de différents profils (participants, administrateurs, mentors, professeurs…). Le design system se doit d'uniformiser tous les composants pour créer une interface unique entre les différents rôles et faciliter le travail des développeurs.

Clair
Agorize est une plateforme très complète et parfois complexe. Il donc est essentiel d’optimiser l’imbrication des fonctionnalités et la facilité d’utilisation pour permettre à tout type de profil d’utiliser l’interface. Le langage visuel et les composants doivent servir cette simplicité.

Humain
Que ce soit un participant, un mentor ou un administrateur, la plateforme Agorize s'adresse à tous. Elle doit être inclusive et respecter les règles d'accessibilité.

Adaptatif
Les clients d'Agorize sont variés et chacun d'entre eux a sa propre identité et son propre langage. C'est pourquoi chaque composant de l'interface est conçu pour être adapté. Ainsi, la forme des boutons, les couleurs des messages flash ou le contenu de certains textes doivent être adaptables et personnalisables pour refléter les valeurs de nos clients.

Responsive
35% des utilisateurs d'Agorize étant des utilisateurs mobiles, chaque interface et composant doivent être conçus pour s'adapter à tout type d'écran : mobile, tablette et desktop.