Système `Best Fit' pour commandes B2B

FoilSports conçoit, fabrique et stocke des équipements de haute qualité pour les sports nautiques. Nous avons conçu et développé une plate-forme de back-office synchronisée avec la plateforme e-commerce B2B TradeGecko pour gérer les commandes en ligne et les fournisseurs, calculer les dates de livraison les mieux adaptées selon la production en cours et prévue et présenter un suivi de commandes aux clients. Fleuret 01 - 3

Team

1 directeur UX / UI et chef de projet
1 Web Designer
1 Développeur Front-end
1 développeur back-end

Methodology

Atelier UX / UI
Méthodologie de la cascade
Méthodologie Agile (MA)

Tools

Lark
TeamWork
Adobe Xd

Technologies

WordPress, HTML5, CSS, JavaScript, Bootstrap, mySQL, Symfony

Timeframe

4 mois

Le challenge

Foilsports a amélioré sa gamme de produits existante pour ses clients, ce qui lui a valu sa popularité. Pour gérer d’énormes quantités de commandes d’achat et de vente et pour disposer des données les plus à jour concernant leur stock et leurs stocks prévisionnels, ils ont décidé de construire un système propriétaire (application web) pour remplacer leurs nombreuses feuilles Excel.

Le principal défi ici n’était pas seulement de créer une interface d’administration conviviale avec beaucoup de données et d’actions, mais aussi de se connecter à Tradegecko, leur plate-forme de commerce électronique B2B où ils vendent et commandent leurs produits, et jouent avec ses données pour calculer les stocks. et créer des prévisions sur les mois et les commandes à venir.
C’était aussi un grand défi pour FoilSports de changer de plate-forme opérationnelle.
Ce nouveau système que nous appelons maintenant le système « Best fit » est de suivre les commandes et la quantité de stock avec des automatisations sur l’envoi d’e-mails de groupe du client (lorsqu’une commande passe d’un statut à un autre par exemple) et de passer des commandes de quantités de stock dans des créneaux disponibles pour être prêt. pour expédition.

En bref, ce Le plan d’expédition est donc automatiquement calculé par notre système et dépend de la disponibilité des produits et des bons de commande entrants.

Approche et conception du projet

Nous avons commencé un projet avec l’analyse de l’essence des problèmes et des points faibles du client à travers l’atelier. Le client nous a donné une liste des problèmes auxquels ils étaient confrontés dans le cadre de leur processus existant, qui utilisait des feuilles Excel incroyablement énormes.
Alors tout d’abord, le client voulait obtenir de nous des solutions UX, un panneau d’administration où il pouvait gérer toutes ses commandes et ses stocks et voir les prévisions automatiques sur les mois à venir pour lui permettre de savoir quel type de bons de commande il devait passer, pour éviter le manque potentiel de quantité de produit ou bien, avoir trop de quantité de stock dans certains cas.
Après avoir eu une solide compréhension de leur processus, de leurs problèmes et de ce que notre client souhaitait améliorer, nous avons commencé à travailler sur le prototypage de wireframes sur la base des informations recueillies lors de l’atelier technique que nous avons mené avec les parties prenantes de FoilSports et notre équipe d’analystes et de développeurs seniors.
Nous avons présenté au client la structure de base de la plate-forme en filaire, afin de ne pas passer beaucoup de temps sur les corrections dans la conception de l’interface utilisateur mais surtout pour définir les périmètres des fonctionnalités nécessaires dans le système.

Le cœur même de notre travail était de créer un ensemble personnalisable de différents composants suivant des caractéristiques très précises et techniques. Tout d’abord, nous avons construit la bibliothèque de composants d’interface utilisateur personnalisable. Comme les composants de conception sont toujours ajustables aux besoins des utilisateurs et à la marque, il était crucial de créer un ensemble de règles telles que les couleurs et le guide des en-têtes. Par conséquent, nous avons défini des couleurs de tableau de bord, des polices et des représentations de données reflétant l’identité d’entreprise FoilSports. Après cela, nous avons adopté cette directive de conception de base pour tous les éléments de conception.

Le développement de projets

Après avoir défini les fonctionnalités de base de l’application Web, nous avons commencé à créer la connexion entre Tradegecko et notre noyau système Best Fit afin de communiquer toutes les données nécessaires via notre API et nos webhooks Tradegecko.
Après avoir prêt l’ensemble de l’API et les webhooks branchés, nous avons créé l’interface frontale du système Best Fit où nous pouvions voir les résultats visuels de toutes les données transmises.
Maintenant, la partie difficile arrivait, le véritable « meilleur ajustement » devait être créé – le système qui devait calculer les commandes entrantes, en fonction de leurs statuts, des détails spécifiques et des informations sur le stock afin de passer automatiquement la commande à une expédition spécifique. date, en fonction des différentes règles d’expédition que nous avons définies avec le client.

Sur la base de tout ce qui précède, des automatisations via des tâches cron et des webhooks personnalisés ont été créées. Nous avons ensuite pu envoyer des informations automatisées aux clients concernant leurs commandes et les dates de livraison prévues.

Le résumé du projet

Notre objectif principal était d’introduire des conceptions UX et UI personnalisées, simples et intuitives pour la plate-forme, et ainsi de développer un système Best Fit sur mesure très spécifique qui automatiserait et aiderait considérablement le travail des administrateurs de FoilSports.

Pour atteindre notre objectif, nous avons « simplifié » leur processus, localisé les problèmes, réfléchi à la manière de l’améliorer, puis proposé des solutions d’expérience utilisateur pour enfin développer la solution technique associée.

En rationalisant les données des commandes d’achat et de vente, nous avons contribué à réduire considérablement la charge de travail des administrateurs de FoilSports pour gérer leurs stocks.
L’ensemble du panneau d’administration est maintenant là pour aider les utilisateurs à comprendre et à trouver les informations qu’ils souhaitent, tout en disposant des données les plus à jour sur le stock et le stock futur.