Chapsvision

Aperçu

Alternance pendant un an chez Chapsvision avec pour mission principale la fusion des interfaces NP6 et l’ajout de nouvelles fonctionnalités.

Contexte

« Chapsvision est un éditeur français de logiciels qui propose des solutions pour le traitement de données massives et hétérogènes. NP6 est l’une de ses solutions, spécialisée dans le marketing automation avec des campagnes multicanales.

La solution NP6 se compose de deux applications qui doivent fusionner. Afin de rendre la solution plus homogène, il faut revoir les visuels de la solution via un audit et planifier les modifications à effectuer tout en concevant les nouvelles fonctionnalités. Il faut reprendre les design system pour n’en avoir plus qu’un commun et le plus détaillé possible. »

Quand était-ce ?

Début Janvier – fin Décembre 2023

Mon rôle

concepteur d’expérience ; UX/UI Designer ; graphiste

Les défis

  • fusionner deux interfaces avec des visuels et technologies différentes
  • concevoir de nouvelles fonctionnalités lors des sprints pour répondre aux attentes des clients
  • changement d’outils de conception et de technologies

Mes solutions

  • faire un audit des deux solutions pour conserver le meilleur
  • brainstorming, analyses et tests multiples de fonctionnalités
  • analyse des possibilités, passage d’un outil à un autre en ajustant ce qui doit l’être selon le logiciel, micro-formation 

Responsabilités

  • maintenir, transformer, améliorer et unifier le design system
  • concevoir de nouvelles mascottes et visuels selon les besoins
  • conception de wireframes, maquettes et prototypes
  • responsable de l’UI de NP6

Mon approche

Audit des interfaces

Afin de mieux comprendre NP6 et ses solutions, j’ai réalisé un audit de celles-ci. J’ai pu noter toutes mes incompréhensions des outils, mes remarques visuelles (différences entre les deux applications, problèmes de placements…), les éléments facilitant la compréhension des actions, etc. J’ai ensuite partagés ces différentes remarques aux Product Owners (PO) de NP6 et autres UX/UI designers ou développeurs pouvant s’occuper des applications.  

Réalisations

Une fois les tâches découpées et placées dans le board Azure, nous les prenions selon leur priorité. En plus de celles qui m’étaient affectées, je prenais également plusieurs tâches qui consistaient à redesigner des éléments et maquettes associées pour gagner en homogénéité et maintenir le design system. Pour chaque tâche je veillais à contacter le ou les PO l’ayant créée afin de mieux comprendre les besoins et attentes de celle-ci. Je réalisais ensuite divers wireframes à valider ou modifier avant de réaliser les maquettes finales que je transmettais aux PO et développeurs. Pour certaines tâches plus complexes je m’appuyais sur les connaissances et retours de mes collègues UX/UI designers afin d’échanger sur les diverses solutions qui pouvaient convenir. Ainsi, nous parvenions à trouver des réponses innovantes et respectant les éléments existants de l’application.

Pour le design system (DS), j’ai, dans un premier temps repris toutes les couleurs et fonts utilisées. J’ai comparé leurs utilisations et supprimé les éléments redondants ou inutilisés. Lorsque certains éléments étaient trop proches, je les ai modifiés ou ai ajouté des éléments pour proposer plus de choix aux utilisateurs de NP6. Pour plus de compréhension et de facilité d’utilisation pour les utilisateurs du DS, j’ai également catégorisé ces différents éléments, les ai renommés selon leurs utilisations et ai proposé une alternative en rgba aux codes hexa. Lorsque nous avons dû changer de logiciel, en passant de Adobe XD à figma, j’ai repris les différents élément du DS pour les rendre utilisables plus facilement sur figma. Ainsi, par exemple, nous gagnions du temps avec les divers styles, variables, composants et auto layouts implémentés dans le figma. Puisque j’étais en charge du DS, j’ai également rajouté les nouveaux éléments conçus pour les nouvelles fonctionnalités ainsi que ceux modifiés pour la fusion des deux interfaces. Pour s’assurer que le DS soit le plus simple à utiliser pour tous, j’ai suivi les bases de l’atomic design et design tokens.